@cosmicdrift/kumiko-renderer 0.391.1 → 0.392.1

package/dist/app/action-form-body.d.ts

@@ -32,11 +32,9 @@ export declare function ActionFormBody({ schema, screen, translate, entityId, in
      *  from the clicked row, applied on top of searchParams through the same
      *  renderableFields/sensitive gates (see mergeSearchParamsIntoInitial). */
     readonly initialOverrides?: Readonly<Record<string, unknown>>;
-    /** Drawer-hosted usage (toolbarAction kind:"drawer"): called
-     *  instead of the redirect-based navigation on successful submit, so the
-     *  host closes the drawer + refetches its list regardless of whether
-     *  `screen.redirect` is set — a full-page redirect would navigate away
-     *  from the list the drawer sits on top of. */
+    /** Drawer-hosted usage: called on successful submit so the host closes the
+     *  drawer + refetches its list; a declared `screen.redirect` then navigates
+     *  (without returnTo, a drawer is no navigation target). */
     readonly onSuccess?: () => void;
     /** Drawer-hosted usage: replaces the cancelTarget/redirect-based Cancel
      *  handler so Cancel closes the drawer instead of navigating. */

package/dist/app/action-form-body.js

@@ -20,7 +20,7 @@ import { qualifyScreenId } from "./qualify-screen-id.js";
 import { QueryLoadingBanner } from "./query-state-banners.js";
 import { navigateToReturn, navigateToReturnOr, useReturnTarget } from "./return-to.js";
 import { screenAccessAllows } from "./screen-access.js";
-import { formatSummaryParams, navigateToRedirectTarget, redirectScreenTarget, resolveActionFormSummary, resolveRedirectTarget, resolveSuccessLinks, resolveSuccessMessageParams, returnToWinsOverRedirect, ScreenAccessDeniedBanner, ScreenMissingState, } from "./screen-shared.js";
+import { formatSummaryParams, navigateAfterDrawerSubmit, navigateToRedirectTarget, redirectScreenTarget, resolveActionFormSummary, resolveRedirectTarget, resolveSuccessLinks, resolveSuccessMessageParams, returnToWinsOverRedirect, ScreenAccessDeniedBanner, ScreenMissingState, } from "./screen-shared.js";
 export function useDrawerAction(schema) {
     const [drawerState, setDrawerState] = useState(null);
     const drawerAction = drawerState?.action ?? null;
@@ -182,6 +182,13 @@ export function ActionFormBody({ schema, screen, translate, entityId, initialOve
             return;
         if (onSuccess !== undefined) {
             onSuccess();
+            navigateAfterDrawerSubmit({
+                nav,
+                redirect: screen.redirect,
+                resultData: result.data,
+                schema,
+                appFeatures,
+            });
             return;
         }
         if (screen.redirect === undefined) {

package/dist/app/header-actions-bar.d.ts

@@ -2,9 +2,11 @@ import type { ReactNode } from "react";
 import type { RenderEditAction } from "../components/render-edit-types.ts";
 import type { usePrimitives } from "../primitives.tsx";
 import type { ErrorNotice } from "./error-reference.tsx";
-export declare function HeaderActionsBar({ actions, Button, Dialog, ActionOverflowMenu, onError, collapseAfterPrimary, compact, preferredPrimaryId, PageHeader, overflowTestId, }: {
+export declare function HeaderActionsBar({ actions, Button, Dialog, ActionOverflowMenu, onError, collapseAfterPrimary, compact, preferredPrimaryId, inlineActionIds, PageHeader, overflowTestId, }: {
     /** `primaryAction` of the screen: wins over the edit/primary-style precedence. */
     readonly preferredPrimaryId?: string;
+    /** `inlineActions` of the screen: stay buttons next to the primary instead of the menu. */
+    readonly inlineActionIds?: readonly string[];
     /** Header slot layout: only the primary action stays a button, the rest goes into the menu. */
     readonly collapseAfterPrimary?: boolean;
     /** Phone-width shell header: an icon-only primary button, the rest in the shell's overflow menu. */

package/dist/app/header-actions-bar.js

@@ -2,14 +2,14 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
 import { RenderEditActionButton } from "../components/render-edit-action-button.js";
 import { useActionMenuItems } from "../components/use-action-menu-items.js";
 import { useTranslation } from "../i18n.js";
-import { compactHeaderPrimary, orderPlainHeaderActions, primaryHeaderAction, } from "./header-actions.js";
+import { compactHeaderPrimary, orderPlainHeaderActions, splitHeaderActions, } from "./header-actions.js";
 // Header actions bar: <=2 actions render as plain buttons; >2 with an
 // `ActionOverflowMenu` primitive collapse to the primary button plus a menu
 // for the rest — same rule as RowActionsCell for table rows. Owns confirm
 // state for menu items: RenderEditActionButton already owns a per-button
 // confirm dialog for the always-visible primary action, but a menu item has
 // no button of its own to carry one.
-export function HeaderActionsBar({ actions, Button, Dialog, ActionOverflowMenu, onError, collapseAfterPrimary = false, compact = false, preferredPrimaryId, PageHeader, overflowTestId = "kumiko-screen-projection-detail-actions-overflow", }) {
+export function HeaderActionsBar({ actions, Button, Dialog, ActionOverflowMenu, onError, collapseAfterPrimary = false, compact = false, preferredPrimaryId, inlineActionIds, PageHeader, overflowTestId = "kumiko-screen-projection-detail-actions-overflow", }) {
     const t = useTranslation();
     const { toMenuItem, confirmDialog: pendingActionDialog } = useActionMenuItems({
         Dialog,
@@ -24,7 +24,6 @@ export function HeaderActionsBar({ actions, Button, Dialog, ActionOverflowMenu,
     if (actions.length <= maxPlainButtons || ActionOverflowMenu === undefined) {
         return (_jsx(_Fragment, { children: orderPlainHeaderActions(actions, preferredPrimaryId).map((action) => (_jsx(RenderEditActionButton, { action: action, Button: Button, Dialog: Dialog, hideIcon: true, onError: onError }, action.id))) }));
     }
-    const primary = primaryHeaderAction(actions, preferredPrimaryId);
-    const rest = actions.filter((a) => a.id !== primary?.id);
-    return (_jsxs(_Fragment, { children: [primary !== undefined && (_jsx(RenderEditActionButton, { action: primary, Button: Button, Dialog: Dialog, hideIcon: true, onError: onError }, primary.id)), _jsx(ActionOverflowMenu, { label: t("kumiko.list.row-actions.more"), testId: overflowTestId, items: rest.map(toMenuItem) }), pendingActionDialog] }));
+    const { buttons, menu } = splitHeaderActions(actions, preferredPrimaryId, inlineActionIds);
+    return (_jsxs(_Fragment, { children: [buttons.map((action) => (_jsx(RenderEditActionButton, { action: action, Button: Button, Dialog: Dialog, hideIcon: true, onError: onError }, action.id))), menu.length > 0 && (_jsx(ActionOverflowMenu, { label: t("kumiko.list.row-actions.more"), testId: overflowTestId, items: menu.map(toMenuItem) })), pendingActionDialog] }));
 }

package/dist/app/header-actions.d.ts

@@ -5,4 +5,9 @@ export type CompactHeaderPrimary = {
     readonly iconOnly: boolean;
 };
 export declare function compactHeaderPrimary(actions: readonly RenderEditAction[], preferredId?: string): CompactHeaderPrimary | undefined;
+export type SplitHeaderActions = {
+    readonly buttons: readonly RenderEditAction[];
+    readonly menu: readonly RenderEditAction[];
+};
+export declare function splitHeaderActions(actions: readonly RenderEditAction[], preferredId?: string, inlineIds?: readonly string[]): SplitHeaderActions;
 export declare function orderPlainHeaderActions(actions: readonly RenderEditAction[], preferredId?: string): readonly RenderEditAction[];

package/dist/app/header-actions.js

@@ -25,6 +25,17 @@ export function compactHeaderPrimary(actions, preferredId) {
     const iconAction = primaryHeaderAction(actions);
     return canStandAsIconButton(iconAction) ? { action: iconAction, iconOnly: true } : undefined;
 }
+// The primary action leads the visible buttons, the declared inline actions follow it,
+// everything else goes into the menu.
+export function splitHeaderActions(actions, preferredId, inlineIds) {
+    const primary = primaryHeaderAction(actions, preferredId);
+    const others = actions.filter((action) => action.id !== primary?.id);
+    const inline = others.filter((action) => inlineIds?.includes(action.id) === true);
+    return {
+        buttons: primary === undefined ? inline : [primary, ...inline],
+        menu: others.filter((action) => !inline.includes(action)),
+    };
+}
 export function orderPlainHeaderActions(actions, preferredId) {
     const preferred = preferredId !== undefined ? actions.find((a) => a.id === preferredId) : undefined;
     return preferred === undefined ? actions : [preferred, ...actions.filter((a) => a !== preferred)];

package/dist/app/kumiko-screen.js

@@ -55,7 +55,7 @@ export function KumikoScreen({ schema, qn, translate, entityId, onRowClick, onCo
         onCopyLink,
     });
     // Gate every entry (incl. direct URL): the body element is only mounted once the condition holds.
-    const body = screen.visibleWhen !== undefined ? (_jsx(ScreenVisibilityGate, { featureName: schema.featureName, visibleWhen: screen.visibleWhen, fallback: screen.fallback, translate: translate, children: _jsx(StandInChainBoundary, { children: screenBody }) })) : (_jsx(StandInChainBoundary, { children: screenBody }));
+    const body = screen.visibleWhen !== undefined ? (_jsx(ScreenVisibilityGate, { entityId: entityId, featureName: schema.featureName, visibleWhen: screen.visibleWhen, fallback: screen.fallback, translate: translate, children: _jsx(StandInChainBoundary, { children: screenBody }) }, entityId)) : (_jsx(StandInChainBoundary, { children: screenBody }));
     // An embedded screen (e.g. a dashboard panel) keeps its parent's host and
     // must not portal its page header into the shell that hosts the outer screen.
     if (outerHost !== undefined) {
@@ -63,10 +63,16 @@ export function KumikoScreen({ schema, qn, translate, entityId, onRowClick, onCo
     }
     return _jsx(ReturnHostProvider, { value: ownHost, children: body });
 }
-function ScreenVisibilityGate({ featureName, visibleWhen, fallback, translate, children, }) {
-    const result = useQuery(visibleWhen.query, {}, { live: true });
+function ScreenVisibilityGate({ entityId, featureName, visibleWhen, fallback, translate, children, }) {
+    // An idParam gate without a route id has nothing to ask: treated as hidden, never queried.
+    const missingRouteId = visibleWhen.idParam !== undefined && entityId === undefined;
+    const result = useQuery(visibleWhen.query, visibleWhen.idParam !== undefined && entityId !== undefined
+        ? { [visibleWhen.idParam]: entityId }
+        : {}, { live: true, enabled: !missingRouteId });
     const wasShown = useRef(false);
-    const verdict = evalVisibleWhenAfterShown(visibleWhen, result, wasShown.current);
+    const verdict = missingRouteId
+        ? "hidden"
+        : evalVisibleWhenAfterShown(visibleWhen, result, wasShown.current);
     useEffect(() => {
         if (verdict === "visible")
             wasShown.current = true;
@@ -77,7 +83,7 @@ function ScreenVisibilityGate({ featureName, visibleWhen, fallback, translate, c
         return _jsx(QueryLoadingBanner, {});
     }
     if (fallback !== undefined) {
-        return _jsx(FallbackScreen, { featureName: featureName, fallback: fallback, translate: translate });
+        return (_jsx(FallbackScreen, { featureName: featureName, fallback: fallback, translate: translate, ...(visibleWhen.idParam !== undefined && entityId !== undefined && { entityId }) }));
     }
     return (_jsxs(_Fragment, { children: [_jsx(LockedHeaderScope, {}), _jsx(ScreenUnavailableBanner, {})] }));
 }
@@ -86,14 +92,14 @@ function ScreenUnavailableBanner() {
     const t = useTranslation();
     return (_jsx(Banner, { padded: true, variant: "info", testId: "kumiko-screen-unavailable", children: t("kumiko.screen.unavailable") }));
 }
-function FallbackScreen({ featureName, fallback, translate, }) {
+function FallbackScreen({ featureName, fallback, translate, entityId, }) {
     const target = useEmbeddedScreen(featureName, fallback);
     // Also undefined when the user lacks access to the fallback screen, which is
     // not a framework error.
     if (target === undefined) {
         return (_jsxs(_Fragment, { children: [_jsx(LockedHeaderScope, {}), _jsx(ScreenUnavailableBanner, {})] }));
     }
-    return (_jsx(LockedHeaderScope, { standInScreenId: lastSegment(target.qn), children: _jsx(KumikoScreen, { schema: target.schema, qn: target.qn, translate: translate }) }));
+    return (_jsx(LockedHeaderScope, { standInScreenId: lastSegment(target.qn), children: _jsx(KumikoScreen, { schema: target.schema, qn: target.qn, translate: translate, ...(entityId !== undefined && { entityId }) }) }));
 }
 function renderScreenBody({ schema, screen, translate, entityId, onRowClick, onCopyLink, }) {
     switch (screen.type) {

package/dist/app/projection-detail-header-model.d.ts

@@ -1,7 +1,8 @@
 import type { ProjectionDetailScreenDefinition } from "@cosmicdrift/kumiko-framework/ui-types";
-import type { Translate } from "../headless/index.ts";
-import { type StatusTone } from "../primitives.tsx";
-export declare function headerStatusTone(header: NonNullable<ProjectionDetailScreenDefinition["header"]>, record: Readonly<Record<string, unknown>>): StatusTone | undefined;
+import { type Translate } from "../headless/index.ts";
+import { type StatusBadgeOptionTone } from "../primitives.tsx";
+export declare function headerStatusTone(header: NonNullable<ProjectionDetailScreenDefinition["header"]>, record: Readonly<Record<string, unknown>>): StatusBadgeOptionTone | undefined;
+export declare function resolveHeaderStatusText(screen: ProjectionDetailScreenDefinition, record: Readonly<Record<string, unknown>>, translate: Translate): string;
 export declare function resolveSubtitleHref(header: ProjectionDetailScreenDefinition["header"], record: Readonly<Record<string, unknown>>): string | undefined;
 export type DetailTabItem = {
     readonly id: string;

package/dist/app/projection-detail-header-model.js

@@ -1,5 +1,6 @@
-import { isWriteFormEditSection } from "@cosmicdrift/kumiko-framework/ui-types";
-import { statusToneForOptionTone, statusToneForValue } from "../primitives.js";
+import { isFieldsEditSection, isFormatSpec, isWriteFormEditSection, normalizeEditField, sectionFieldSpecs, } from "@cosmicdrift/kumiko-framework/ui-types";
+import { applyFormatSpec } from "../headless/index.js";
+import { statusToneForOptionTone, statusToneForValue, } from "../primitives.js";
 import { isAbsoluteHttpUrl } from "./projection-detail-navigation.js";
 export function headerStatusTone(header, record) {
     // skip: a header without status has no tone
@@ -12,6 +13,36 @@ export function headerStatusTone(header, record) {
     const declaredTone = declared !== undefined ? statusToneForOptionTone(declared) : undefined;
     return declaredTone ?? statusToneForValue(value);
 }
+function layoutStatusFormat(screen, statusField) {
+    for (const section of screen.layout.sections) {
+        if (!isFieldsEditSection(section))
+            continue;
+        for (const spec of sectionFieldSpecs(section)) {
+            const field = normalizeEditField(spec);
+            if (field.field !== statusField)
+                continue;
+            const renderer = field.renderer;
+            if (isFormatSpec(renderer) &&
+                (renderer.format === "enumOption" || renderer.format === "i18nText")) {
+                return renderer;
+            }
+        }
+    }
+    return undefined;
+}
+export function resolveHeaderStatusText(screen, record, translate) {
+    const statusField = screen.header?.status;
+    // skip: a header without status has no badge text
+    if (statusField === undefined)
+        return "";
+    const raw = record[statusField];
+    const rawText = String(raw ?? "");
+    const format = screen.header?.statusFormat ?? layoutStatusFormat(screen, statusField);
+    if (format === undefined)
+        return rawText;
+    const formatted = applyFormatSpec(format, raw, translate);
+    return formatted === "" ? rawText : formatted;
+}
 export function resolveSubtitleHref(header, record) {
     // skip: no subtitleHref declared
     if (header?.subtitleHref === undefined)

package/dist/app/projection-detail-header-region.js

@@ -47,6 +47,8 @@ function renderPageHeaderBranch(model, pieces, headerSlot, PageHeader) {
     return (_jsxs(_Fragment, { children: [_jsx(PageHeader, { ...(header !== undefined && { title: String(record[header.title] ?? "") }), ...(header === undefined && recordTitle !== undefined && { title: recordTitle }), ...(!pageHeaderCompact && statusBadge !== undefined && { status: statusBadge }), ...(hasHeaderActions && {
                     actions: (_jsx(Grid, { columns: "auto", testId: "kumiko-screen-projection-detail-actions", children: _jsx(HeaderActionsBar, { actions: model.headerActionsList, Button: Button, Dialog: Dialog, ActionOverflowMenu: ActionOverflowMenu, onError: setActionError, collapseAfterPrimary: true, compact: pageHeaderCompact, PageHeader: PageHeader, ...(screen.primaryAction !== undefined && {
                                 preferredPrimaryId: screen.primaryAction,
+                            }), ...(screen.inlineActions !== undefined && {
+                                inlineActionIds: screen.inlineActions,
                             }) }) })),
                 }) }), MetricBand === undefined && bandSubtitle, MetricBand === undefined && headerSlot, (hasMetrics || bandSubtitle !== undefined || headerSlot !== undefined) &&
                 (MetricBand !== undefined || hasMetrics) &&

package/dist/app/projection-detail-header.js

@@ -2,13 +2,13 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
 import { Fragment } from "react";
 import { ErrorReference } from "./error-reference.js";
 import { HeaderActionsBar } from "./header-actions-bar.js";
-import { headerStatusTone, resolveSubtitleHref } from "./projection-detail-header-model.js";
+import { headerStatusTone, resolveHeaderStatusText, resolveSubtitleHref, } from "./projection-detail-header-model.js";
 import { buildSubtitleParts, runMetricNavigate } from "./projection-detail-navigation.js";
 import { navigateTargetAllows } from "./screen-access.js";
 export function renderHeaderActionsContent(model) {
     const { screen, primitives, headerActionsList, setActionError } = model;
     const { Grid, Button, Dialog, ActionOverflowMenu } = primitives;
-    return (_jsx(Grid, { columns: "auto", testId: "kumiko-screen-projection-detail-actions", children: _jsx(HeaderActionsBar, { actions: headerActionsList, Button: Button, Dialog: Dialog, ActionOverflowMenu: ActionOverflowMenu, onError: setActionError, ...(screen.primaryAction !== undefined && { preferredPrimaryId: screen.primaryAction }) }) }));
+    return (_jsx(Grid, { columns: "auto", testId: "kumiko-screen-projection-detail-actions", children: _jsx(HeaderActionsBar, { actions: headerActionsList, Button: Button, Dialog: Dialog, ActionOverflowMenu: ActionOverflowMenu, onError: setActionError, ...(screen.primaryAction !== undefined && { preferredPrimaryId: screen.primaryAction }), ...(screen.inlineActions !== undefined && { inlineActionIds: screen.inlineActions }) }) }));
 }
 // Plain Text, not Heading — the Card title slot already renders as its own
 // heading element (h3); nesting another heading (h1) inside it is invalid HTML.
@@ -16,7 +16,8 @@ export function renderHeaderTitleSlot(model) {
     const { screen, record, primitives } = model;
     const { Grid, Text, StatusBadge } = primitives;
     const header = screen.header;
-    return header !== undefined ? (header.status !== undefined ? (_jsxs(Grid, { columns: "auto", children: [_jsx(Text, { testId: "kumiko-screen-projection-detail-title", children: String(record[header.title] ?? "") }), StatusBadge !== undefined ? (_jsx(StatusBadge, { value: String(record[header.status] ?? ""), tone: headerStatusTone(header, record), testId: "kumiko-screen-projection-detail-status" })) : (_jsx(Text, { testId: "kumiko-screen-projection-detail-status", children: String(record[header.status] ?? "") }))] })) : (_jsx(Text, { testId: "kumiko-screen-projection-detail-title", children: String(record[header.title] ?? "") }))) : undefined;
+    const statusText = resolveHeaderStatusText(screen, record, model.effectiveTranslate);
+    return header !== undefined ? (header.status !== undefined ? (_jsxs(Grid, { columns: "auto", children: [_jsx(Text, { testId: "kumiko-screen-projection-detail-title", children: String(record[header.title] ?? "") }), StatusBadge !== undefined ? (_jsx(StatusBadge, { value: statusText, tone: headerStatusTone(header, record), testId: "kumiko-screen-projection-detail-status" })) : (_jsx(Text, { testId: "kumiko-screen-projection-detail-status", children: statusText }))] })) : (_jsx(Text, { testId: "kumiko-screen-projection-detail-title", children: String(record[header.title] ?? "") }))) : undefined;
 }
 function renderSubtitleParts(model, subtitleParts) {
     const { Text, Link } = model.primitives;
@@ -75,7 +76,7 @@ export function renderStatusBadge(model) {
     const { screen, record, primitives } = model;
     const { StatusBadge } = primitives;
     const header = screen.header;
-    return header?.status !== undefined && StatusBadge !== undefined ? (_jsx(StatusBadge, { value: String(record[header.status] ?? ""), tone: headerStatusTone(header, record), testId: "kumiko-screen-projection-detail-status" })) : undefined;
+    return header?.status !== undefined && StatusBadge !== undefined ? (_jsx(StatusBadge, { value: resolveHeaderStatusText(screen, record, model.effectiveTranslate), tone: headerStatusTone(header, record), testId: "kumiko-screen-projection-detail-status" })) : undefined;
 }
 // Lives in the band's subtitle row so it shares the metrics' horizontal inset.
 export function renderBandSubtitle(model, statusBadge, headerSubtitleSlot, pageHeaderCompact) {

package/dist/app/row-actions.d.ts

@@ -43,7 +43,7 @@ export declare function buildProjectionRowActions(options: {
 }): readonly DataTableRowAction[] | undefined;
 type OpenToolbarDrawer = (action: ToolbarAction & {
     readonly kind: "drawer";
-}) => void;
+}, initialValues?: Readonly<Record<string, unknown>>) => void;
 export declare function buildProjectionToolbarActions(options: {
     readonly toolbarActions: readonly RelatedListToolbarAction[] | undefined;
     readonly translate: Translate;

package/dist/app/row-actions.js

@@ -277,7 +277,7 @@ function buildNavigateToolbarAction(action, translate, nav, host, prefill, recor
         },
     };
 }
-function buildDrawerToolbarAction(action, translate, openDrawer) {
+function buildDrawerToolbarAction(action, translate, openDrawer, record) {
     const actionIcon = resolveActionIcon(action.id);
     return {
         id: action.id,
@@ -285,10 +285,12 @@ function buildDrawerToolbarAction(action, translate, openDrawer) {
         ...(action.style !== undefined && { style: action.style }),
         confirmRequired: false,
         ...(actionIcon !== undefined && { icon: actionIcon }),
-        onTrigger: () => openDrawer(action),
+        onTrigger: () => action.params !== undefined && record !== undefined
+            ? openDrawer(action, evalRowExtractor(action.params, record))
+            : openDrawer(action),
     };
 }
-function buildWriteHandlerToolbarAction(action, translate, refetch, dispatcher) {
+function buildWriteHandlerToolbarAction(action, translate, refetch, dispatcher, record) {
     const actionIcon = resolveActionIcon(action.id);
     return {
         id: action.id,
@@ -300,7 +302,10 @@ function buildWriteHandlerToolbarAction(action, translate, refetch, dispatcher)
             confirmLabel: translate(action.confirmLabel),
         }),
         onTrigger: async () => {
-            const result = await dispatcher.write(action.handler, action.payload ?? {});
+            const extracted = action.params !== undefined && record !== undefined
+                ? evalRowExtractor(action.params, record)
+                : undefined;
+            const result = await dispatcher.write(action.handler, { ...action.payload, ...extracted });
             if (!result.isSuccess) {
                 throw new WriteFailedError(result.error, dispatcherErrorText(result.error, translate));
             }
@@ -308,6 +313,15 @@ function buildWriteHandlerToolbarAction(action, translate, refetch, dispatcher)
         },
     };
 }
+// Fail closed: `visible` and `params` are evaluated against the parent record, so without one
+// the action stays hidden. (navigate falls back to the implicit parent prefill without params.)
+function isToolbarActionHiddenForRecord(action, record) {
+    if (action.visible !== undefined &&
+        (record === undefined || !evalFieldCondition(action.visible, record))) {
+        return true;
+    }
+    return action.kind !== "navigate" && action.params !== undefined && record === undefined;
+}
 // Shared by entityList, projectionList, and relatedList toolbars so the
 // three call sites can't drift apart.
 export function buildProjectionToolbarActions(options) {
@@ -316,11 +330,8 @@ export function buildProjectionToolbarActions(options) {
         return undefined;
     const out = [];
     for (const action of toolbarActions) {
-        // Fail closed: a conditional action without a record to evaluate against stays hidden.
-        if (action.visible !== undefined &&
-            (record === undefined || !evalFieldCondition(action.visible, record))) {
+        if (isToolbarActionHiddenForRecord(action, record))
             continue;
-        }
         if (action.kind === "navigate") {
             if (access !== undefined &&
                 !navigateTargetAllows({ screen: action.screen }, access.appFeatures, access.userRoles)) {
@@ -334,13 +345,13 @@ export function buildProjectionToolbarActions(options) {
                 warnDrawerActionDropped("toolbarAction", action.id);
                 continue;
             }
-            out.push(buildDrawerToolbarAction(action, translate, openDrawer));
+            out.push(buildDrawerToolbarAction(action, translate, openDrawer, record));
             continue;
         }
         // writeHandler — skip without a dispatcher instead of crashing (same as rowActions).
         if (dispatcher === undefined)
             continue;
-        out.push(buildWriteHandlerToolbarAction(action, translate, refetch, dispatcher));
+        out.push(buildWriteHandlerToolbarAction(action, translate, refetch, dispatcher, record));
     }
     return out.length > 0 ? out : undefined;
 }

package/dist/app/screen-shared.d.ts

@@ -68,5 +68,12 @@ export declare function navigateAfterRedirect(options: {
     readonly resultData: unknown;
     readonly record: Readonly<Record<string, unknown>>;
 }): void;
+export declare function navigateAfterDrawerSubmit(options: {
+    readonly nav: NavApi;
+    readonly schema: FeatureSchema;
+    readonly appFeatures: readonly FeatureSchema[];
+    readonly redirect: string | ActionFormRedirect | undefined;
+    readonly resultData: unknown;
+}): void;
 export declare function overlayUpdatedProjection(record: Readonly<Record<string, unknown>>, resultData: unknown): Readonly<Record<string, unknown>>;
 export {};

package/dist/app/screen-shared.js

@@ -320,6 +320,18 @@ export function navigateAfterRedirect(options) {
     }
     navigateToRedirectTarget(nav, resolveRedirectTarget(redirect, resultData, schema, appFeatures, record));
 }
+// A drawer is no navigation target, so returnTo does not apply. Redirecting onto the host
+// screen would only reset its filters/scroll/tab; the drawer's close + refetch already refreshed it.
+export function navigateAfterDrawerSubmit(options) {
+    const { nav, schema, appFeatures, redirect, resultData } = options;
+    if (redirect === undefined)
+        return;
+    const target = resolveRedirectTarget(redirect, resultData, schema, appFeatures);
+    const hostScreenId = nav.route === undefined ? undefined : lastSegment(nav.route.screenId);
+    const isHostScreen = target.screenId === hostScreenId && target.entityId === undefined && target.tab === undefined;
+    if (!isHostScreen)
+        navigateToRedirectTarget(nav, target);
+}
 // The update payload nests the saved projection under `data`; a changed
 // parent FK lives there, not in the pre-edit `record`.
 export function overlayUpdatedProjection(record, resultData) {

package/dist/components/related-list-section.js

@@ -92,6 +92,11 @@ function buildRowTone(rule) {
         return undefined;
     return (row) => (evalFieldCondition(rule, { ...row.values }) ? rule.tone : undefined);
 }
+function pickEmptyStateText(emptyState, record) {
+    if (emptyState === undefined)
+        return undefined;
+    return (emptyState.variants?.find((variant) => evalFieldCondition(variant.when, record)) ?? emptyState);
+}
 export function RelatedListSection({ section, parentId, record, featureName, translate, hideTitle, grow, onOpenDrawer, actions, embedded, onAfterWrite, refreshToken, }) {
     const { Banner, Section, Card, FillContainer, Text, Button, Dialog } = usePrimitives();
     const [emptyStateActionError, setEmptyStateActionError] = useState(null);
@@ -248,7 +253,7 @@ export function RelatedListSection({ section, parentId, record, featureName, tra
         host,
         access: { appFeatures, userRoles },
         ...(onOpenDrawer !== undefined && {
-            openDrawer: (action) => onOpenDrawer(action, undefined),
+            openDrawer: onOpenDrawer,
         }),
     }), [
         appFeatures,
@@ -302,7 +307,8 @@ export function RelatedListSection({ section, parentId, record, featureName, tra
         onOpenDrawer,
         refetchSelfAndHost,
     ]);
-    const emptyStateContent = section.emptyState !== undefined ? (_jsxs(_Fragment, { children: [_jsx(Text, { children: section.emptyState.title }), section.emptyState.description !== undefined && (_jsx(Text, { variant: "small", children: section.emptyState.description })), emptyStateActionButton !== undefined && (_jsx(RenderEditActionButton, { action: emptyStateActionButton, Button: Button, Dialog: Dialog, onError: setEmptyStateActionError }))] })) : undefined;
+    const emptyStateText = pickEmptyStateText(section.emptyState, record);
+    const emptyStateContent = emptyStateText !== undefined ? (_jsxs(_Fragment, { children: [_jsx(Text, { children: emptyStateText.title }), emptyStateText.description !== undefined && (_jsx(Text, { variant: "small", children: emptyStateText.description })), emptyStateActionButton !== undefined && (_jsx(RenderEditActionButton, { action: emptyStateActionButton, Button: Button, Dialog: Dialog, onError: setEmptyStateActionError }))] })) : undefined;
     // Without a cursor-driven pager the client-side sort covers only the fetched
     // rows; the banner keeps it from claiming "these are the top N".
     const content = listRows.firstLoad ? (_jsx(Banner, { padded: true, variant: "loading", testId: "related-list-loading", children: t("kumiko.widget.loading") })) : listRows.error ? (_jsx(Banner, { padded: true, variant: "error", testId: "related-list-error", children: dispatcherErrorText(listRows.error, effectiveTranslate) })) : (_jsxs(_Fragment, { children: [listRows.truncated && (_jsx(Banner, { variant: "info", testId: "related-list-truncated", children: effectiveTranslate("kumiko.list.related-list-truncated", {

package/dist/headless/view-model/edit.js

@@ -91,6 +91,15 @@ export function computeRelatedListSectionViewModel(sectionSpec, translate) {
                 ...(sectionSpec.emptyState.action !== undefined && {
                     action: sectionSpec.emptyState.action,
                 }),
+                ...(sectionSpec.emptyState.variants !== undefined && {
+                    variants: sectionSpec.emptyState.variants.map((variant) => ({
+                        when: variant.when,
+                        title: translate(variant.title),
+                        ...(variant.description !== undefined && {
+                            description: translate(variant.description),
+                        }),
+                    })),
+                }),
             },
         }),
     };

package/dist/headless/view-model/types.d.ts

@@ -1,4 +1,4 @@
-import type { EditFieldSpec, EditSectionSpec, FieldAffix, FieldFillAction, FieldIconKey, FieldRenderer, IconKey, ListBulkAction, ListColumnSpec, ListFacetSpec, ListSortSpec, ListTableOptions, OptionsQueryPayload, PlatformComponent, RelatedListRowTone, RelatedListToolbarAction, RowAction, RowActionMode, ScreenSlots, SelectOptionTone } from "@cosmicdrift/kumiko-framework/ui-types";
+import type { EditFieldSpec, EditSectionSpec, FieldAffix, FieldFillAction, FieldIconKey, FieldRenderer, IconKey, ListBulkAction, ListColumnSpec, ListFacetSpec, ListSortSpec, ListTableOptions, OptionsQueryPayload, PlatformComponent, RelatedListEmptyStateVariant, RelatedListRowTone, RelatedListToolbarAction, RowAction, RowActionMode, ScreenSlots, SelectOptionTone } from "@cosmicdrift/kumiko-framework/ui-types";
 export type RuntimeRenderer = (value: unknown, row?: Readonly<Record<string, unknown>>) => string;
 /** Where a cell's text links to. `href` comes from NavApi.hrefFor (new-tab and
  *  copy-link work); `onPress` is the in-app navigation for a plain click. */
@@ -369,6 +369,7 @@ export type EditRelatedListSectionViewModel = {
         readonly title: string;
         readonly description?: string;
         readonly action?: RowAction;
+        readonly variants?: readonly RelatedListEmptyStateVariant[];
     };
 };
 export type EditWriteFormSectionViewModel = {

package/dist/hooks/live-query-entities.d.ts

@@ -0,0 +1,6 @@
+import type { FeatureSchema } from "../app/feature-schema.ts";
+import type { LiveEvent, LiveEventSubscriber } from "../sse/live-events.tsx";
+export declare function entityFromQueryType(type: string): string | undefined;
+export declare function liveEntitiesForQuery(type: string, features: readonly FeatureSchema[]): readonly string[];
+export declare function useLiveEntitiesForQuery(type: string): readonly string[];
+export declare function subscribeToEntities(subscribe: LiveEventSubscriber, entities: readonly string[], listener: (event: LiveEvent) => void): () => void;

package/dist/hooks/live-query-entities.js

@@ -0,0 +1,44 @@
+import { useMemo } from "react";
+import { useAppFeatures } from "../app/app-features-context.js";
+import { toKebab } from "../app/qn.js";
+// Entity of a standard `<feature>:query:<entity>:<verb>` type; undefined for
+// non-conforming types so live mode skips them instead of subscribing to a
+// channel no event will ever match.
+export function entityFromQueryType(type) {
+    const parts = type.split(":");
+    if (parts.length !== 4)
+        return undefined;
+    if (parts[1] !== "query")
+        return undefined;
+    return parts[2];
+}
+// The server signals both the r.entity() name and its kebab-case form (executors
+// may write under either), so the client listens on both.
+export function liveEntitiesForQuery(type, features) {
+    const names = new Set();
+    const nameSegment = entityFromQueryType(type);
+    if (nameSegment !== undefined)
+        names.add(nameSegment);
+    for (const feature of features) {
+        for (const entity of feature.queryLiveEntities?.[type] ?? [])
+            names.add(entity);
+    }
+    const subscribed = new Set();
+    for (const name of names) {
+        subscribed.add(name);
+        subscribed.add(toKebab(name));
+    }
+    return [...subscribed].sort();
+}
+export function useLiveEntitiesForQuery(type) {
+    const features = useAppFeatures();
+    const featuresKey = useMemo(() => liveEntitiesForQuery(type, features).join("\n"), [type, features]);
+    return useMemo(() => (featuresKey === "" ? [] : featuresKey.split("\n")), [featuresKey]);
+}
+export function subscribeToEntities(subscribe, entities, listener) {
+    const unsubscribers = entities.map((entity) => subscribe(entity, listener));
+    return () => {
+        for (const unsubscribe of unsubscribers)
+            unsubscribe();
+    };
+}

package/dist/hooks/use-query.d.ts

@@ -1,4 +1,5 @@
 import type { DispatcherError } from "../headless/index.ts";
+export { entityFromQueryType } from "./live-query-entities.ts";
 export type UseQueryResult<TData> = {
     readonly data: TData | null;
     readonly error: DispatcherError | null;
@@ -11,5 +12,4 @@ export type UseQueryOptions = {
     readonly refetchIntervalMs?: number;
     readonly concurrency?: number;
 };
-export declare function entityFromQueryType(type: string): string | undefined;
 export declare function useQuery<TData = unknown>(type: string, payload: unknown, options?: UseQueryOptions): UseQueryResult<TData>;

package/dist/hooks/use-query.js

@@ -1,19 +1,9 @@
 import { useCallback, useEffect, useRef, useState } from "react";
 import { useDispatcher, useOptionalQueryPools } from "../context/dispatcher-context.js";
 import { useLiveEvents } from "../sse/live-events.js";
+import { subscribeToEntities, useLiveEntitiesForQuery } from "./live-query-entities.js";
 import { createLiveRefetchScheduler } from "./live-refetch-scheduler.js";
-// Extract the entity-name from a standard Kumiko query type. Returns
-// undefined for non-conforming types so the live-mode silently skips
-// them instead of subscribing to a channel no event will ever match.
-export function entityFromQueryType(type) {
-    // Expected shape: "<feature>:query:<entity>:<verb>"
-    const parts = type.split(":");
-    if (parts.length !== 4)
-        return undefined;
-    if (parts[1] !== "query")
-        return undefined;
-    return parts[2];
-}
+export { entityFromQueryType } from "./live-query-entities.js";
 function isValidConcurrency(value) {
     return value !== undefined && Number.isFinite(value) && value >= 1;
 }
@@ -118,20 +108,20 @@ export function useQuery(type, payload, options = {}) {
     // A separate effect ensures changes to `live` or `type` update the
     // subscription lifecycle exactly once.
     const subscribeLive = useLiveEvents();
+    const liveEntities = useLiveEntitiesForQuery(type);
     useEffect(() => {
         // skip: live mode or query disabled, no SSE subscription needed
         if (!live || !enabled)
             return;
-        const entity = entityFromQueryType(type);
-        // skip: query type has no mapped entity, nothing to subscribe to
-        if (entity === undefined)
+        // skip: no entity to listen on, nothing to subscribe to
+        if (liveEntities.length === 0)
             return;
         const scheduler = createLiveRefetchScheduler(() => runFetch(true));
-        const unsubscribe = subscribeLive(entity, scheduler.trigger);
+        const unsubscribe = subscribeToEntities(subscribeLive, liveEntities, scheduler.trigger);
         return () => {
             unsubscribe();
             scheduler.dispose();
         };
-    }, [live, enabled, type, runFetch, subscribeLive]);
+    }, [live, enabled, liveEntities, runFetch, subscribeLive]);
     return { data, error, loading, refetch: run };
 }

package/dist/primitives.d.ts

@@ -1334,13 +1334,15 @@ export type TabsProps = {
     readonly testId?: string;
 };
 export type StatusTone = "ok" | "warn" | "bad" | "critical" | "muted";
+/** Tones a select option can request: the status tones plus the brand `accent`. */
+export type StatusBadgeOptionTone = StatusTone | "accent";
 /** Status pill. `value` is the raw column value — tone-mapping is the app's job. */
 export type StatusBadgeProps = {
     readonly value: string;
-    readonly tone?: StatusTone;
+    readonly tone?: StatusBadgeOptionTone;
     readonly testId?: string;
 };
-export declare function statusToneForOptionTone(tone: SelectOptionTone): StatusTone | undefined;
+export declare function statusToneForOptionTone(tone: SelectOptionTone): StatusBadgeOptionTone | undefined;
 export declare function statusToneForValue(value: string): StatusTone | undefined;
 /** Structured JSON display (audit payload/metadata, job logs, unsupported
  *  jsonb/embedded field fallback). Takes the raw value, not a pre-stringified

package/dist/primitives.js

@@ -50,6 +50,8 @@ const STATUS_TONE_BY_OPTION_TONE = {
     ok: "ok",
     warn: "warn",
     bad: "bad",
+    critical: "critical",
+    accent: "accent",
     neutral: "muted",
 };
 // Own-key check: an unknown tone from an untyped definition must yield undefined so callers fall back to the value heuristic.

package/dist/web/app/dashboard-body.js

@@ -25,6 +25,7 @@ function PanelBody({ panel, label, screenId, screenParams, translate, }) {
                 ...screenParams.filterParams,
                 ...screenParams.rangeParams,
                 ...screenParams.recordParams,
+                ...panel.params,
             } }));
     }
     const text = label ?? "";

package/dist/web/layout/shell-breadcrumb.d.ts

@@ -1,4 +1,5 @@
 import type { ScreenDefinition } from "@cosmicdrift/kumiko-framework/ui-types";
+import type { NavNode } from "../../headless/index.ts";
 export type BreadcrumbCrumb = {
     readonly label: string;
     readonly screenId?: string;
@@ -9,3 +10,4 @@ export declare function screenTitleKey(screenShortId: string): string;
  *  (unknown screen, or no explicit/heuristic parent). */
 export declare function resolveParentScreenId(screens: readonly ScreenDefinition[], screenId: string): string | undefined;
 export declare function resolveDetailBreadcrumb(screens: readonly ScreenDefinition[], detailScreenId: string, t: (key: string) => string): readonly BreadcrumbCrumb[] | undefined;
+export declare function activeNavLabel(nodes: readonly NavNode[], screenId: string, t: (key: string) => string): string | undefined;

package/dist/web/layout/shell-breadcrumb.js

@@ -32,3 +32,14 @@ export function resolveDetailBreadcrumb(screens, detailScreenId, t) {
         { label: t(screenTitleKey(detailScreenId)) },
     ];
 }
+export function activeNavLabel(nodes, screenId, t) {
+    for (const node of nodes) {
+        if (node.screen !== undefined && lastSegment(node.screen) === screenId) {
+            return node.label.includes(".") || node.label.includes(":") ? t(node.label) : node.label;
+        }
+        const child = activeNavLabel(node.children, screenId, t);
+        if (child !== undefined)
+            return child;
+    }
+    return undefined;
+}

package/dist/web/layout/shell-header.d.ts

@@ -4,9 +4,10 @@ type ShellHeaderUser = {
     readonly id: string;
     readonly roles: readonly string[];
 };
-export declare function ShellHeader({ schema, user, headerActions, }: {
+export declare function ShellHeader({ schema, user, headerActions, allowedNavQns, }: {
     readonly schema: AppSchema | FeatureSchema;
     readonly user?: ShellHeaderUser;
     readonly headerActions?: ReactNode;
+    readonly allowedNavQns?: ReadonlySet<string>;
 }): ReactNode;
 export {};

package/dist/web/layout/shell-header.js

@@ -16,11 +16,11 @@ import { cn } from "../lib/cn.js";
 import { Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, } from "../ui/breadcrumb.js";
 import { SidebarTrigger } from "../ui/sidebar.js";
 import { HeaderOverflowMenuContext, headerOverflowMenuItemClass } from "./header-overflow-menu.js";
-import { buildNavRegistrySliceForApp, lastSegment } from "./nav-tree.js";
+import { buildNavRegistrySliceForApp } from "./nav-tree.js";
 import { usePageHeaderSlot } from "./page-header-slot.js";
-import { resolveDetailBreadcrumb, screenTitleKey, } from "./shell-breadcrumb.js";
+import { activeNavLabel, resolveDetailBreadcrumb, screenTitleKey, } from "./shell-breadcrumb.js";
 import { SHELL_HEADER_CONTROLS_CLASSES } from "./uniform-bar-controls.js";
-export function ShellHeader({ schema, user, headerActions, }) {
+export function ShellHeader({ schema, user, headerActions, allowedNavQns, }) {
     const nav = useNav();
     const t = useTranslation();
     const appSchema = toAppSchema(schema);
@@ -28,6 +28,12 @@ export function ShellHeader({ schema, user, headerActions, }) {
         const source = buildNavRegistrySliceForApp(appSchema);
         return resolveNavigation({ source, ...(user !== undefined && { user }) });
     }, [appSchema, user]);
+    const allowedTree = useMemo(() => {
+        if (allowedNavQns === undefined)
+            return undefined;
+        const source = buildNavRegistrySliceForApp(appSchema, allowedNavQns);
+        return resolveNavigation({ source, ...(user !== undefined && { user }) });
+    }, [appSchema, user, allowedNavQns]);
     const allScreens = useMemo(() => appSchema.features.flatMap((f) => f.screens), [appSchema.features]);
     const slot = usePageHeaderSlot();
     const standInScreenId = slot?.breadcrumbScreenId;
@@ -43,11 +49,12 @@ export function ShellHeader({ schema, user, headerActions, }) {
             if (detailCrumbs !== undefined && detailCrumbs.length > 1)
                 return detailCrumbs;
         }
-        const navLabel = activeNavLabel(tree, screenId, (k) => t(k));
+        const navLabel = (allowedTree !== undefined ? activeNavLabel(allowedTree, screenId, t) : undefined) ??
+            activeNavLabel(tree, screenId, t);
         if (navLabel !== undefined)
             return [{ label: navLabel }];
         return resolveDetailBreadcrumb(allScreens, screenId, t);
-    }, [allScreens, screenId, entityId, t, tree]);
+    }, [allScreens, screenId, entityId, t, tree, allowedTree]);
     const setStatusElement = slot?.setStatusElement;
     const setActionsElement = slot?.setActionsElement;
     const titleOverride = slot?.title;
@@ -147,14 +154,3 @@ function HeaderOverflow({ items, headerActions, }) {
                         // being restyled through a child selector that reaches into their markup.
                         className: "flex flex-col items-stretch gap-1", onClick: () => setOpen(false), children: _jsx(HeaderOverflowMenuContext.Provider, { value: true, children: headerActions }) }))] })] }));
 }
-function activeNavLabel(nodes, screenId, t) {
-    for (const node of nodes) {
-        if (node.screen !== undefined && lastSegment(node.screen) === screenId) {
-            return node.label.includes(".") || node.label.includes(":") ? t(node.label) : node.label;
-        }
-        const child = activeNavLabel(node.children, screenId, t);
-        if (child !== undefined)
-            return child;
-    }
-    return undefined;
-}

package/dist/web/layout/workspace-shell.js

@@ -150,7 +150,7 @@ export function WorkspaceShell({ brand, schema, topbarActions, user, initialWork
     // The second column appears only when a screen fills it (sidebar-09 pattern);
     // otherwise every other screen would have an empty strip beside the navigation.
     const panel = useSidebarPanelHost();
-    return (_jsx(SidebarProvider, { ...fillCls.provider, children: _jsxs(SidebarPanelProvider, { value: panel.value, children: [_jsxs(Sidebar, { collapsible: "icon", mobileTitle: t("kumiko.sidebar.title"), mobileDescription: t("kumiko.sidebar.description"), children: [_jsxs(SidebarHeader, { "data-kumiko-layout": "sidebar-header", children: [brand, switcher] }), _jsx(SidebarContent, { "data-kumiko-layout": "sidebar-nav", children: sidebarContent }), sidebarFooter !== undefined && (_jsx(SidebarFooter, { "data-kumiko-layout": "sidebar-footer", className: "border-t border-sidebar-border", children: sidebarFooter })), _jsx(SidebarRail, { "aria-label": t("kumiko.sidebar.toggle"), title: t("kumiko.sidebar.toggle") })] }), _jsx("div", { ref: panel.ref, "data-kumiko-layout": "sidebar-panel", className: panel.occupied ? "flex h-svh shrink-0 flex-col" : "hidden" }), _jsx(SidebarInset, { className: fillCls.inset, children: _jsxs(PageHeaderSlotProvider, { children: [_jsx(ShellHeader, { schema: app, ...(user !== undefined && { user }), ...(topbarActions !== undefined && { headerActions: topbarActions }) }), _jsx("main", { className: fillCls.main, children: activeTarget !== undefined ? (_jsx(EditorPanel, { resolvers: resolvers })) : (_jsx(UserRolesProvider, { roles: user?.roles, children: children })) })] }) })] }) }));
+    return (_jsx(SidebarProvider, { ...fillCls.provider, children: _jsxs(SidebarPanelProvider, { value: panel.value, children: [_jsxs(Sidebar, { collapsible: "icon", mobileTitle: t("kumiko.sidebar.title"), mobileDescription: t("kumiko.sidebar.description"), children: [_jsxs(SidebarHeader, { "data-kumiko-layout": "sidebar-header", children: [brand, switcher] }), _jsx(SidebarContent, { "data-kumiko-layout": "sidebar-nav", children: sidebarContent }), sidebarFooter !== undefined && (_jsx(SidebarFooter, { "data-kumiko-layout": "sidebar-footer", className: "border-t border-sidebar-border", children: sidebarFooter })), _jsx(SidebarRail, { "aria-label": t("kumiko.sidebar.toggle"), title: t("kumiko.sidebar.toggle") })] }), _jsx("div", { ref: panel.ref, "data-kumiko-layout": "sidebar-panel", className: panel.occupied ? "flex h-svh shrink-0 flex-col" : "hidden" }), _jsx(SidebarInset, { className: fillCls.inset, children: _jsxs(PageHeaderSlotProvider, { children: [_jsx(ShellHeader, { schema: app, ...(user !== undefined && { user }), ...(allowedNavQns !== undefined && { allowedNavQns }), ...(topbarActions !== undefined && { headerActions: topbarActions }) }), _jsx("main", { className: fillCls.main, children: activeTarget !== undefined ? (_jsx(EditorPanel, { resolvers: resolvers })) : (_jsx(UserRolesProvider, { roles: user?.roles, children: children })) })] }) })] }) }));
 }
 // --- helpers (exported for tests) ---
 export function filterByAccess(workspaces, userRoles) {

package/dist/web/primitives/data-table/data-cell-props.d.ts

@@ -2,6 +2,6 @@ import type { ListColumnViewModel } from "../../../headless/index.ts";
 /** Optional presentation props every DataTableCell gets from its column. */
 export declare function columnCellPresentationProps(col: ListColumnViewModel): {
     optionLabels?: Readonly<Record<string, string>> | undefined;
-    optionTones?: Readonly<Partial<Record<string, "bad" | "neutral" | "ok" | "warn">>> | undefined;
+    optionTones?: Readonly<Partial<Record<string, "accent" | "bad" | "critical" | "neutral" | "ok" | "warn">>> | undefined;
     grouping?: boolean | undefined;
 };

package/dist/web/primitives/data-table/toolbar.d.ts

@@ -2,5 +2,6 @@ import type { ReactNode } from "react";
 import type { DataTableModel } from "./use-data-table-state.ts";
 export declare function buildModelFacetCluster(m: DataTableModel): ReactNode;
 export declare function hasToolbarContent(m: DataTableModel, facetCluster: ReactNode): boolean;
+export declare function toolbarMergesDescription(m: DataTableModel, facetCluster: ReactNode): boolean;
 export declare function renderToolbar(m: DataTableModel, facetCluster: ReactNode): ReactNode;
-export declare function renderToolbarDescription(m: DataTableModel, hasToolbar: boolean): ReactNode;
+export declare function renderToolbarDescription(m: DataTableModel, hasToolbar: boolean, inToolbarRow?: boolean): ReactNode;

package/dist/web/primitives/data-table/toolbar.js

@@ -40,14 +40,27 @@ function renderFacetToggle(m, facetCluster) {
     const { testId, facetsOpenNarrow, setFacetsOpenNarrow } = m;
     return (_jsxs(_Fragment, { children: [_jsx(UiButton, { type: "button", variant: "outline", size: "icon", className: "size-11", "aria-label": m.tableTranslate?.("kumiko.list.filter.toggle") ?? "Filter", "aria-expanded": facetsOpenNarrow, "data-testid": testId !== undefined ? `${testId}-filter-toggle` : "filter-toggle", onClick: () => setFacetsOpenNarrow((open) => !open), children: _jsx(SlidersHorizontal, { className: "size-4", "aria-hidden": "true" }) }), facetsOpenNarrow && _jsx("div", { className: "w-full", children: facetCluster })] }));
 }
+// With only end content (no search, no facets) the row has room for the description,
+// so both share one line instead of stacking the description under the actions.
+export function toolbarMergesDescription(m, facetCluster) {
+    return (m.toolbarDescription !== undefined &&
+        m.toolbarStart === undefined &&
+        facetCluster === undefined &&
+        toolbarEndHasContent(m.view, m.exportList, m.toolbarEnd));
+}
 export function renderToolbar(m, facetCluster) {
     const { testId, toolbarStart } = m;
     const collapsesFacetsBehindButton = m.isNarrow && m.fillsHeight && facetCluster !== undefined;
-    return (_jsxs("div", { "data-testid": testId !== undefined ? `${testId}-toolbar` : "render-list-toolbar", className: toolbarClassName(m), children: [toolbarStart !== undefined && renderToolbarStart(m, toolbarStart), collapsesFacetsBehindButton ? renderFacetToggle(m, facetCluster) : facetCluster, _jsx(ToolbarEndCluster, { view: m.view, columnLabels: new Map(m.schemaColumns.map((col) => [col.field, col.label])), exportList: m.exportList, toolbarEnd: m.toolbarEnd })] }));
+    const mergesDescription = toolbarMergesDescription(m, facetCluster);
+    return (_jsxs("div", { "data-testid": testId !== undefined ? `${testId}-toolbar` : "render-list-toolbar", className: cn(toolbarClassName(m), mergesDescription && "justify-between", mergesDescription && m.fillsHeight && !m.isNarrow && "md:py-2", 
+        // A dashboard panel title above has no inset; the description must share its left edge.
+        mergesDescription && m.fillsHeight && m.insideEmbeddedScreen && "px-0"), children: [mergesDescription && renderToolbarDescription(m, true, true), toolbarStart !== undefined && renderToolbarStart(m, toolbarStart), collapsesFacetsBehindButton ? renderFacetToggle(m, facetCluster) : facetCluster, _jsx(ToolbarEndCluster, { view: m.view, columnLabels: new Map(m.schemaColumns.map((col) => [col.field, col.label])), exportList: m.exportList, toolbarEnd: m.toolbarEnd })] }));
 }
-export function renderToolbarDescription(m, hasToolbar) {
+export function renderToolbarDescription(m, hasToolbar, inToolbarRow = false) {
     const { testId, toolbarDescription, fillsHeight, isNarrow } = m;
     if (toolbarDescription === undefined)
         return null;
-    return (_jsx("p", { "data-testid": testId !== undefined ? `${testId}-description` : "render-list-description", className: cn("m-0 pb-2 text-sm text-muted-foreground", fillsHeight && (isNarrow ? "px-3" : "px-6"), fillsHeight && !hasToolbar && "pt-4"), children: toolbarDescription }));
+    return (_jsx("p", { "data-testid": testId !== undefined ? `${testId}-description` : "render-list-description", className: cn("m-0 text-sm text-muted-foreground", 
+        // min-w-48 lets the actions wrap below the text instead of squeezing it.
+        inToolbarRow ? "min-w-48 flex-1" : "pb-2", !inToolbarRow && fillsHeight && (isNarrow ? "px-3" : "px-6"), !inToolbarRow && fillsHeight && !hasToolbar && "pt-4"), children: toolbarDescription }));
 }

package/dist/web/primitives/data-table/use-data-table-state.d.ts

@@ -30,6 +30,7 @@ export type DataTableModel = Omit<DataTableProps, "columns"> & {
     readonly rowTestId: (row: ListRowViewModel) => string;
     readonly expansion: RowExpansion | undefined;
     readonly fillsHeight: boolean;
+    readonly insideEmbeddedScreen: boolean;
     readonly selection: ReturnType<typeof useBulkSelection>;
     readonly headerRowRef: ReturnType<typeof useMeasuredColumnWidths>["headerRowRef"];
     readonly pins: ColumnPins<ListColumnViewModel>;

package/dist/web/primitives/data-table/use-data-table-state.js

@@ -1,4 +1,5 @@
 import { useId, useState } from "react";
+import { useIsEmbeddedScreen } from "../../../context/embedded-screen-context.js";
 import { useOptionalLocale, useOptionalTranslation } from "../../../index.js";
 import { useIsNarrowViewport } from "../use-narrow-viewport.js";
 import { isPinningActive, isResizingActive } from "./column-layout-mode.js";
@@ -55,6 +56,7 @@ export function useDataTableState(props) {
     const expansion = resolveRowExpansion(props);
     const isRowExpandable = expansion !== undefined;
     const fillsHeight = scrollBody === true;
+    const insideEmbeddedScreen = useIsEmbeddedScreen();
     const selection = useBulkSelection({
         bulk,
         rows,
@@ -110,6 +112,7 @@ export function useDataTableState(props) {
         rowTestId,
         expansion,
         fillsHeight,
+        insideEmbeddedScreen,
         selection,
         headerRowRef,
         pins,

package/dist/web/primitives/data-table-cell.js

@@ -259,6 +259,8 @@ const ROW_TONE_CLASS = {
     bad: "bg-status-bad/10 hover:bg-status-bad/15",
     warn: "bg-status-warn/10 hover:bg-status-warn/15",
     ok: "bg-status-ok/10 hover:bg-status-ok/15",
+    critical: "bg-status-critical/10 hover:bg-status-critical/15",
+    accent: "bg-primary/10 hover:bg-primary/15",
     neutral: "",
 };
 export function rowToneClass(tone) {

package/dist/web/primitives/data-table.js

@@ -1,7 +1,7 @@
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { cn } from "../lib/cn.js";
 import { renderTableContent } from "./data-table/table-content.js";
-import { buildModelFacetCluster, hasToolbarContent, renderToolbar, renderToolbarDescription, } from "./data-table/toolbar.js";
+import { buildModelFacetCluster, hasToolbarContent, renderToolbar, renderToolbarDescription, toolbarMergesDescription, } from "./data-table/toolbar.js";
 import { useDataTableState } from "./data-table/use-data-table-state.js";
 import { screenPaddingClassName } from "./layout.js";
 // `screenPadding`: on a list screen this wrapper IS the screen container,
@@ -28,10 +28,11 @@ export function DefaultDataTable(props) {
     const model = useDataTableState(props);
     const facetCluster = buildModelFacetCluster(model);
     const hasToolbar = hasToolbarContent(model, facetCluster);
+    const mergesDescription = toolbarMergesDescription(model, facetCluster);
     // dashboard-01 pattern: the toolbar (search + facets + "+ New") sits ABOVE
     // the table in the same padding block; no separate bg bar, no screen title
     // (that lives in the shell's breadcrumb). The toolbar is NOT sticky: lists
     // typically scroll with the page container, not internally. Sticky would
     // compete with the topbar.
-    return (_jsxs("div", { className: wrapperClassName(model), children: [!model.fillsHeight && renderToolbarDescription(model, hasToolbar), hasToolbar && renderToolbar(model, facetCluster), model.fillsHeight && renderToolbarDescription(model, hasToolbar), renderTableContent(model)] }));
+    return (_jsxs("div", { className: wrapperClassName(model), children: [!mergesDescription && !model.fillsHeight && renderToolbarDescription(model, hasToolbar), hasToolbar && renderToolbar(model, facetCluster), !mergesDescription && model.fillsHeight && renderToolbarDescription(model, hasToolbar), renderTableContent(model)] }));
 }

package/dist/web/primitives/layout-elements.js

@@ -21,8 +21,8 @@ export function DefaultSection({ id, title, subtitle, children, actions, variant
     // footer — a title-less section still draws the row when actions are
     // present, so a hideTitle tabs-Section with `actions` isn't stranded.
     const TitleTag = insideScreenForm ? "h2" : "h3";
-    const titleBlock = title !== undefined || subtitle !== undefined ? (_jsxs("div", { className: "flex flex-col gap-1", children: [title !== undefined && (_jsxs(TitleTag, { "data-testid": testId !== undefined ? `${testId}-title` : undefined, className: "flex items-center gap-2 text-base font-semibold leading-none tracking-tight", children: [icon !== undefined && _jsx(Icon, { name: icon, className: "size-4 text-muted-foreground" }), title] })), subtitle !== undefined && (_jsx("div", { "data-testid": testId !== undefined ? `${testId}-subtitle` : undefined, className: cn("text-sm text-muted-foreground", insideScreenForm && "text-[13px] text-foreground-secondary"), children: subtitle }))] })) : null;
-    const header = titleBlock !== null || actions !== undefined ? (_jsxs("div", { className: "flex items-start justify-between gap-4", children: [titleBlock, actions !== undefined && (_jsx("div", { "data-testid": testId !== undefined ? `${testId}-actions` : undefined, className: "ml-auto flex shrink-0 items-center gap-2", children: actions }))] })) : null;
+    const titleBlock = title !== undefined || subtitle !== undefined ? (_jsxs("div", { className: "flex min-w-48 flex-1 flex-col gap-1", children: [title !== undefined && (_jsxs(TitleTag, { "data-testid": testId !== undefined ? `${testId}-title` : undefined, className: "flex items-center gap-2 text-base font-semibold leading-none tracking-tight", children: [icon !== undefined && _jsx(Icon, { name: icon, className: "size-4 text-muted-foreground" }), title] })), subtitle !== undefined && (_jsx("div", { "data-testid": testId !== undefined ? `${testId}-subtitle` : undefined, className: cn("text-sm text-muted-foreground", insideScreenForm && "text-[13px] text-foreground-secondary"), children: subtitle }))] })) : null;
+    const header = titleBlock !== null || actions !== undefined ? (_jsxs("div", { className: "flex flex-wrap items-start justify-between gap-x-4 gap-y-3", children: [titleBlock, actions !== undefined && (_jsx("div", { "data-testid": testId !== undefined ? `${testId}-actions` : undefined, className: "ml-auto flex shrink-0 items-center gap-2", children: actions }))] })) : null;
     // Inside a form: divider-less section WITHOUT a card surface of its own.
     // The separator lines BETWEEN sections come from the divide-y wrapper in
     // the form.

package/dist/web/widgets/infinity-list.js

@@ -1,6 +1,7 @@
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useRef, useState } from "react";
-import { entityFromQueryType, useDispatcher, useLiveEvents, useTranslation } from "../../index.js";
+import { subscribeToEntities, useLiveEntitiesForQuery } from "../../hooks/live-query-entities.js";
+import { useDispatcher, useLiveEvents, useTranslation } from "../../index.js";
 import { EmptyState, ErrorState, LoadingState } from "./states.js";
 /** Cursor-paginated scroll list (mail inbox, activity feeds) — loads the
  *  next page when the end sentinel becomes visible (IntersectionObserver),
@@ -11,6 +12,7 @@ export function InfinityList({ query, payload, pageSize = 50, rows, nextCursor,
     const dispatcher = useDispatcher();
     const t = useTranslation();
     const subscribeLive = useLiveEvents();
+    const liveEntities = useLiveEntitiesForQuery(query);
     const [state, setState] = useState({ kind: "loading" });
     const sentinelRef = useRef(null);
     const payloadKey = JSON.stringify(payload ?? {});
@@ -136,9 +138,8 @@ export function InfinityList({ query, payload, pageSize = 50, rows, nextCursor,
         // skip: live mode off, no SSE subscription needed
         if (!live)
             return;
-        const entity = entityFromQueryType(query);
-        // skip: query type has no mapped entity, nothing to subscribe to
-        if (entity === undefined)
+        // skip: no entity to listen on, nothing to subscribe to
+        if (liveEntities.length === 0)
             return;
         const runRefresh = () => {
             liveInFlightRef.current = true;
@@ -162,7 +163,7 @@ export function InfinityList({ query, payload, pageSize = 50, rows, nextCursor,
                 runRefresh();
             }, 250);
         };
-        const unsubscribe = subscribeLive(entity, scheduleRefresh);
+        const unsubscribe = subscribeToEntities(subscribeLive, liveEntities, scheduleRefresh);
         return () => {
             unsubscribe();
             if (liveTimerRef.current !== null) {
@@ -170,7 +171,7 @@ export function InfinityList({ query, payload, pageSize = 50, rows, nextCursor,
                 liveTimerRef.current = null;
             }
         };
-    }, [live, query, refreshFirstPage, subscribeLive]);
+    }, [live, liveEntities, refreshFirstPage, subscribeLive]);
     useEffect(() => {
         const sentinel = sentinelRef.current;
         // skip: no further page or not ready yet — observer not needed

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cosmicdrift/kumiko-renderer",
-  "version": "0.391.1",
+  "version": "0.392.1",
   "description": "React renderer for Kumiko screens. The root export holds the platform-agnostic logic (primitives contract, hooks, KumikoScreen, navigation and SSE abstractions); ./headless the DOM-free UI logic, ./live the HTTP dispatcher, ./web the browser bindings (HTML primitives, history navigation, EventSource live events, createKumikoApp).",
   "license": "MIT",
   "author": "Marc Frost <marc@cosmicdriftgamestudio.com>",
@@ -48,8 +48,8 @@
     }
   },
   "dependencies": {
-    "@cosmicdrift/kumiko-framework": "0.391.1",
-    "@cosmicdrift/kumiko-types": "0.391.1",
+    "@cosmicdrift/kumiko-framework": "0.392.1",
+    "@cosmicdrift/kumiko-types": "0.392.1",
     "@radix-ui/react-dialog": "^1.1.15",
     "@radix-ui/react-dropdown-menu": "^2.1.16",
     "@radix-ui/react-label": "^2.1.8",
@@ -92,8 +92,8 @@
     }
   },
   "devDependencies": {
-    "@cosmicdrift/kumiko-locale-de": "0.391.1",
-    "@cosmicdrift/kumiko-testing": "0.391.1",
+    "@cosmicdrift/kumiko-locale-de": "0.392.1",
+    "@cosmicdrift/kumiko-testing": "0.392.1",
     "@tailwindcss/cli": "^4.3.0",
     "@testing-library/react": "^16.3.2",
     "@testing-library/user-event": "^14.6.1",

package/src/changes.json

@@ -1,4 +1,52 @@
 [
+  {
+    "version": "0.392.1",
+    "type": "fix",
+    "title": "List descriptions sit beside the toolbar actions",
+    "detail": "A description plus a toolbar with only end content (no search, no facets) renders as one row with the actions on the right, in embedded and full-height lists. Before, a full-height list put the description under the create button. With search or facets the layout is unchanged. Section header actions wrap below the title on narrow widths."
+  },
+  {
+    "version": "0.392.0",
+    "type": "improvement",
+    "title": "The projectionDetail header badge shows the translated status",
+    "detail": "The header badge formats its text with header.statusFormat. Without it, the badge reuses the layout renderer of the status field when that is enumOption or i18nText, so header and body show the same text. Without either, the raw value is shown as before. The tone keeps resolving on the raw value."
+  },
+  {
+    "version": "0.392.0",
+    "type": "fix",
+    "title": "The shell header title follows the active workspace",
+    "detail": "When two navs point at the same screen, the breadcrumb now takes the label of the nav the sidebar shows for the active workspace. Before, the first nav in the app won, so the title could differ from the sidebar entry. Without a matching nav in the workspace, the old lookup applies."
+  },
+  {
+    "version": "0.392.0",
+    "type": "improvement",
+    "title": "The detail header keeps inlineActions as buttons",
+    "detail": "HeaderActionsBar takes inlineActionIds and renders those actions as buttons after the primary action; only the remaining actions go into the overflow menu, and no menu is shown when none remain."
+  },
+  {
+    "version": "0.392.0",
+    "type": "improvement",
+    "title": "The relatedList empty state follows the parent record",
+    "detail": "RelatedListSection evaluates emptyState.variants against the parent record and shows the first matching text. The headless view model translates the variant texts."
+  },
+  {
+    "version": "0.392.0",
+    "type": "improvement",
+    "title": "English header comments in the renderer e2e config",
+    "detail": "Comment-only change in the renderer Playwright config and the demo dev bootstrap; no runtime behavior changes."
+  },
+  {
+    "version": "0.392.0",
+    "type": "improvement",
+    "title": "A drawer-hosted actionForm follows its redirect",
+    "detail": "After a successful submit the drawer closes, the host refetches, and a declared redirect then navigates like on the full page, without returnTo. A redirect that points at the screen the drawer sits on (no record id, no tab) does not navigate, so filters and scroll position stay. Behavior change: before, a drawer ignored redirect."
+  },
+  {
+    "version": "0.392.0",
+    "type": "improvement",
+    "title": "Live queries follow the handler's liveEntities",
+    "detail": "useQuery({ live: true }) and InfinityList refetch on signals for the entity in the query name and for every entity the query handler declares in liveEntities, in both the declared and the kebab-case form. The app schema carries them per feature as queryLiveEntities, and a tenant feature toggle strips them with the feature. A query that reads a second entity no longer needs a name under that entity to stay live."
+  },
   {
     "version": "0.391.0",
     "type": "improvement",