@cosmicdrift/kumiko-renderer 0.394.0 → 0.396.0

package/dist/app/content-preview.js

@@ -1,6 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useId } from "react";
-import { escapeHtmlAttr } from "../headless/index.js";
 import { useContentEditor } from "./content-editors.js";
 const VARIABLE_PATTERN = /\{\{\s*(\w+)\s*\}\}/g;
 const noop = () => { };
@@ -12,15 +11,8 @@ export function substituteVariables(content, variables) {
 export function ContentPreview({ content, variables, contentFormat, }) {
     const Editor = useContentEditor(contentFormat);
     const id = useId();
-    // "rich" content is HTML (see ContentCollectionDefinition.contentFormat) —
-    // an example value substituted in raw could break the markup (`<`) or
-    // render as an unescaped entity (`&`). "plain"/"markdown" content is text,
-    // no escaping wanted there.
-    const safeVariables = contentFormat === "rich"
-        ? Object.fromEntries(Object.entries(variables).map(([name, value]) => [name, escapeHtmlAttr(value)]))
-        : variables;
     // "document" keeps `{{x}}` as-is: substituting it into a button/link href would make the
     // schema drop that node; variable chips stay visible.
-    const value = contentFormat === "document" ? content : substituteVariables(content, safeVariables);
+    const value = contentFormat === "document" ? content : substituteVariables(content, variables);
     return _jsx(Editor, { id: id, value: value, onChange: noop, variables: [], readOnly: true });
 }

package/dist/app/secrets-edit-body.js

@@ -1,5 +1,6 @@
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useMemo, useState } from "react";
+import { FormScreenLayout } from "../components/form-screen-layout.js";
 import { useDispatcher } from "../context/dispatcher-context.js";
 import { useUserRoles } from "../context/user-roles-context.js";
 import { useQuery } from "../hooks/use-query.js";
@@ -20,7 +21,7 @@ function groupSectionsByTitle(sections) {
 // unlike ConfigEditBody there is no server value to pre-fill a draft with —
 // every input starts at "" and stays that way unless the user types into it.
 export function SecretsEditBody({ screen, translate }) {
-    const { Banner, Dialog, Form, Section, Field, Input, Button, Text, Grid } = usePrimitives();
+    const { Banner, Dialog, Section, Field, Input, Button, Text, Grid } = usePrimitives();
     const t = useTranslation();
     const effectiveTranslate = translate ?? t;
     const dispatcher = useDispatcher();
@@ -111,10 +112,10 @@ export function SecretsEditBody({ screen, translate }) {
     }))
         .filter((group) => group.fields.length > 0);
     const unsavedCount = Object.values(drafts).filter((value) => value.trim() !== "").length;
-    return (_jsxs(_Fragment, { children: [_jsxs(Form, { onSubmit: () => {
+    return (_jsxs(_Fragment, { children: [_jsxs(FormScreenLayout, { onSubmit: () => {
                     void handleSubmit();
-                }, testId: "secrets-edit-form", width: "full", fillHeight: true, stickyActions: true, screenForm: true, unsavedCount: unsavedCount, ...(screen.description !== undefined && {
-                    subtitle: effectiveTranslate(screen.description),
+                }, testId: "secrets-edit-form", width: "full", unsavedCount: unsavedCount, ...(screen.description !== undefined && {
+                    description: effectiveTranslate(screen.description),
                 }), actions: _jsxs(_Fragment, { children: [unsavedCount > 0 && (_jsx(Button, { type: "button", variant: "ghost", disabled: submitting, onClick: () => setDrafts({}), testId: "secrets-edit-discard", [STICKY_PRIMARY_ACTION_PROP]: true, children: effectiveTranslate("kumiko.form.discard") })), _jsx(Button, { type: "submit", variant: "primary", loading: submitting, disabled: submitting || unsavedCount === 0, testId: "secrets-edit-submit", children: effectiveTranslate("kumiko.form.saveChanges") })] }), children: [submitError !== null && (_jsx(Banner, { variant: "error", testId: "secrets-edit-error", children: submitError })), sectionGroups.map((section) => (_jsx(Section, { layout: "settings-list", title: effectiveTranslate(section.title), subtitle: effectiveTranslate("config.secrets.description"), children: _jsx(Grid, { columns: 1, list: true, children: section.fields.map((fieldId) => {
                                 const qualified = screen.secretKeys[fieldId];
                                 if (qualified === undefined)

package/dist/components/form-screen-layout.d.ts

@@ -7,7 +7,8 @@ export type FormScreenLayoutProps = {
     readonly secondaryActions?: ReactNode;
     readonly onSubmit?: () => void;
     readonly width?: FormWidth;
+    readonly unsavedCount?: number;
     readonly testId?: string;
 };
 /** For custom screens: the standard form screen layout; fill it with `Section` (title, icon, subtitle). */
-export declare function FormScreenLayout({ children, description, actions, secondaryActions, onSubmit, width, testId, }: FormScreenLayoutProps): ReactNode;
+export declare function FormScreenLayout({ children, description, actions, secondaryActions, onSubmit, width, unsavedCount, testId, }: FormScreenLayoutProps): ReactNode;

package/dist/components/form-screen-layout.js

@@ -7,7 +7,7 @@ const FORM_SCREEN_LAYOUT_PROPS = {
 };
 const NOOP = () => { };
 /** For custom screens: the standard form screen layout; fill it with `Section` (title, icon, subtitle). */
-export function FormScreenLayout({ children, description, actions, secondaryActions, onSubmit = NOOP, width, testId, }) {
+export function FormScreenLayout({ children, description, actions, secondaryActions, onSubmit = NOOP, width, unsavedCount, testId, }) {
     const { Form } = usePrimitives();
-    return (_jsx(Form, { onSubmit: onSubmit, ...FORM_SCREEN_LAYOUT_PROPS, ...(description !== undefined && { subtitle: description }), ...(actions !== undefined && { actions }), ...(secondaryActions !== undefined && { secondaryActions }), ...(width !== undefined && { width }), ...(testId !== undefined && { testId }), children: children }));
+    return (_jsx(Form, { onSubmit: onSubmit, ...FORM_SCREEN_LAYOUT_PROPS, ...(description !== undefined && { subtitle: description }), ...(actions !== undefined && { actions }), ...(secondaryActions !== undefined && { secondaryActions }), ...(width !== undefined && { width }), ...(unsavedCount !== undefined && { unsavedCount }), ...(testId !== undefined && { testId }), children: children }));
 }

package/dist/components/render-edit-banners.js

@@ -52,7 +52,7 @@ export function renderFormErrorBanner({ engine: { props, state }, layout, }) {
                 onReload();
                 state.setFormError(null);
                 state.setExtraDeleteIssues([]);
-            }, testId: "render-edit-form-error-reload", children: translate("kumiko.actions.reload") })) : undefined, children: [_jsx(Text, { testId: "render-edit-form-error-key", children: translate(formError.i18nKey, formError.i18nParams) }), layout.rootIssues.map((issue) => (_jsx(Text, { testId: "render-edit-form-error-root", children: translate(issue.i18nKey, issue.params) }, `${issue.path}:${issue.i18nKey}`))), state.extraDeleteIssues.map((issue) => (_jsx(Text, { testId: "render-edit-form-error-extra", children: translate(issue.i18nKey, issue.params) }, `${issue.path}:${issue.i18nKey}`)))] })));
+            }, testId: "render-edit-form-error-reload", children: translate("kumiko.actions.reload") })) : undefined, children: [_jsx(Text, { testId: "render-edit-form-error-key", children: translate(formError.i18nKey, formError.i18nParams) }), layout.rootIssues.map((issue) => (_jsx(Text, { testId: "render-edit-form-error-root", children: translate(issue.i18nKey, issue.params) }, `${issue.path}:${issue.i18nKey}`))), layout.unplacedIssues.map((issue) => (_jsx(Text, { testId: "render-edit-form-error-unplaced", children: translate(issue.i18nKey, issue.params) }, `${issue.path}:${issue.i18nKey}`))), state.extraDeleteIssues.map((issue) => (_jsx(Text, { testId: "render-edit-form-error-extra", children: translate(issue.i18nKey, issue.params) }, `${issue.path}:${issue.i18nKey}`)))] })));
 }
 export function renderRootIssueBanners({ engine: { state }, layout, }) {
     const { Banner, Text } = state.primitives;

package/dist/components/render-edit-layout-flags.d.ts

@@ -3,6 +3,7 @@ import type { FieldIssue, FormValues } from "../headless/index.ts";
 import type { RenderEditEngine } from "./render-edit-render-model.ts";
 export type LayoutFlags = {
     readonly rootIssues: readonly FieldIssue[];
+    readonly unplacedIssues: readonly FieldIssue[];
     readonly isScreenForm: boolean;
     readonly titleInShell: boolean;
     readonly menuPageHeaderActions: boolean;
@@ -25,5 +26,5 @@ export type FooterFlags = {
     readonly hasUnsavedInput: boolean;
 };
 export type FooterSlotComponent = ReturnType<typeof useExtensionSectionComponent>;
-export declare function deriveLayoutFlags<TValues extends FormValues, TCtx>({ props, state, form, }: RenderEditEngine<TValues, TCtx>): LayoutFlags;
+export declare function deriveLayoutFlags<TValues extends FormValues, TCtx>({ props, state, form, sections, }: RenderEditEngine<TValues, TCtx>): LayoutFlags;
 export declare function deriveFooterFlags<TValues extends FormValues, TCtx>(engine: RenderEditEngine<TValues, TCtx>, layout: LayoutFlags, footerSlotComponent: FooterSlotComponent): FooterFlags;

package/dist/components/render-edit-layout-flags.js

@@ -1,6 +1,6 @@
 import { PROJECTION_DETAIL_ENTITY } from "@cosmicdrift/kumiko-framework/ui-types";
 import { shouldRenderActionsIconOnly } from "../primitives.js";
-import { ROOT_ISSUE_PATH, resolveExtensionEntityId } from "./render-edit-logic.js";
+import { issuesWithoutRenderedField, ROOT_ISSUE_PATH, resolveExtensionEntityId, } from "./render-edit-logic.js";
 function hasSecondaryFormActions(props, menuPageHeaderActions, cancelInHeaderMenu) {
     const { onDelete, onCopyLink, actions, menuActions, onCancel } = props;
     const hasRecordActions = !menuPageHeaderActions && (onDelete !== undefined || onCopyLink !== undefined);
@@ -9,7 +9,7 @@ function hasSecondaryFormActions(props, menuPageHeaderActions, cancelInHeaderMen
     const hasCancel = onCancel !== undefined && !cancelInHeaderMenu;
     return hasRecordActions || hasCustomActions || hasMenuActions || hasCancel;
 }
-export function deriveLayoutFlags({ props, state, form, }) {
+export function deriveLayoutFlags({ props, state, form, sections, }) {
     const { fillScreenHeight, hideSectionTitles, headerRegion, actions, onCancel } = props;
     const { PageHeader, ActionOverflowMenu } = state.primitives;
     // Screen forms (entityEdit/actionForm filling the shell height) drop the card;
@@ -24,6 +24,7 @@ export function deriveLayoutFlags({ props, state, form, }) {
     const cancelInHeaderMenu = menuPageHeaderActions && state.isWizard && onCancel !== undefined;
     return {
         rootIssues,
+        unplacedIssues: issuesWithoutRenderedField(form.snapshot.errors, sections.filteredSections, new Set(Object.keys(props.formDerivation?.derive ?? {}))),
         isScreenForm,
         titleInShell,
         menuPageHeaderActions,

package/dist/components/render-edit-logic.d.ts

@@ -1,9 +1,10 @@
-import type { DispatcherError, EditFieldViewModel, EditSectionViewModel, SubmitResult } from "../headless/index.ts";
+import type { DispatcherError, EditFieldViewModel, EditSectionViewModel, FieldIssue, SubmitResult } from "../headless/index.ts";
 export declare function hasEditableSection(sections: readonly EditSectionViewModel[]): boolean;
 export declare function resolveExtensionEntityId(entityIdProp: string | null | undefined, vmId: string | null): string | null;
 export declare function shouldNotifyCaller(result: SubmitResult<unknown>, extensionsPersisted: boolean): boolean;
 export declare function issueRootField(path: string): string;
 export declare function hasIssueWithoutRenderedField(issuePaths: readonly string[], sections: readonly EditSectionViewModel[], derivedTargets?: ReadonlySet<string>): boolean;
+export declare function issuesWithoutRenderedField(errors: Readonly<Record<string, readonly FieldIssue[]>>, sections: readonly EditSectionViewModel[], derivedTargets?: ReadonlySet<string>): readonly FieldIssue[];
 export declare function hasIssueWithoutVisibleField(issuePaths: readonly string[], fields: readonly EditFieldViewModel[]): boolean;
 export declare function findFirstErroringSectionIndex(sections: readonly EditSectionViewModel[], issuePaths: readonly string[]): number | undefined;
 export declare function filterEditSections(sections: readonly EditSectionViewModel[], fieldsFilter: readonly string[] | undefined): readonly EditSectionViewModel[];

package/dist/components/render-edit-logic.js

@@ -42,6 +42,20 @@ export function hasIssueWithoutRenderedField(issuePaths, sections, derivedTarget
     const renderedFields = sections.flatMap((s) => s.kind === "fields" && s.visible ? s.fields : []);
     return hasIssueWithoutVisibleField(paths, renderedFields);
 }
+// The server issues the banner has to carry itself because no rendered field shows them
+// (an extension section's value such as a page body, `version`, a hidden field).
+export function issuesWithoutRenderedField(errors, sections, derivedTargets = new Set()) {
+    const visibleFields = new Set(sections
+        .flatMap((s) => (s.kind === "fields" && s.visible ? s.fields : []))
+        .filter((f) => f.visible)
+        .map((f) => f.field));
+    return Object.entries(errors)
+        .filter(([path]) => {
+        const root = issueRootField(path);
+        return path !== ROOT_ISSUE_PATH && !derivedTargets.has(root) && !visibleFields.has(root);
+    })
+        .flatMap(([, issues]) => issues);
+}
 export function hasIssueWithoutVisibleField(issuePaths, fields) {
     if (issuePaths.length === 0)
         return true;

package/dist/web/app/client-plugin.d.ts

@@ -72,7 +72,7 @@ export type ClientFeatureDefinition = {
      *  `navProviders`; the static map wins on key collision (explicit beats
      *  derived). */
     readonly navProvidersFromCollections?: (collections: readonly QualifiedContentCollection[]) => CollectionNavProviders;
-    /** Content editor components — map `contentFormat` ("plain" | "rich" | "markdown" | "document") →
+    /** Content editor components — map `contentFormat` ("plain" | "document") →
      *  React component. `r.contentCollection()` declares which format an
      *  editor edits; the collection's editor UI (template-resolver's
      *  TextBlockEditor et al.) looks the component up here and falls back to

package/dist/web/index.d.ts

@@ -12,7 +12,6 @@ export type { KumikoLinkProps } from "./app/nav.tsx";
 export { KumikoLink, useBrowserNavApi } from "./app/nav.tsx";
 export { PlainContentEditor } from "./app/plain-content-editor.tsx";
 export { useResolvers } from "./app/resolvers-context.tsx";
-export { RichContentEditor } from "./app/rich-content-editor.tsx";
 export { clearRememberedListState } from "./app/session-list-state-store.ts";
 export type { NavIconKey } from "./icons.tsx";
 export { Icon } from "./icons.tsx";
@@ -43,6 +42,7 @@ export { SidebarBrand } from "./layout/sidebar-brand.tsx";
 export { SidebarPanel } from "./layout/sidebar-panel.tsx";
 export type { SidebarUserProps } from "./layout/sidebar-user.tsx";
 export { SidebarUser } from "./layout/sidebar-user.tsx";
+export { useDispatchTarget } from "./layout/target-resolver-stub.tsx";
 export { parseTargetFromSearchParams } from "./layout/target-url.ts";
 export type { ThemeMenuItemProps } from "./layout/theme-menu-item.tsx";
 export { ThemeMenuItem } from "./layout/theme-menu-item.tsx";

package/dist/web/index.js

@@ -11,7 +11,6 @@ export { createBrowserDraftStorage } from "./app/draft-storage.js";
 export { KumikoLink, useBrowserNavApi } from "./app/nav.js";
 export { PlainContentEditor } from "./app/plain-content-editor.js";
 export { useResolvers } from "./app/resolvers-context.js";
-export { RichContentEditor } from "./app/rich-content-editor.js";
 export { clearRememberedListState } from "./app/session-list-state-store.js";
 export { Icon } from "./icons.js";
 export { AppLayout } from "./layout/app-layout.js";
@@ -28,6 +27,7 @@ export { Sidebar } from "./layout/sidebar.js";
 export { SidebarBrand } from "./layout/sidebar-brand.js";
 export { SidebarPanel } from "./layout/sidebar-panel.js";
 export { SidebarUser } from "./layout/sidebar-user.js";
+export { useDispatchTarget } from "./layout/target-resolver-stub.js";
 export { parseTargetFromSearchParams } from "./layout/target-url.js";
 export { ThemeMenuItem } from "./layout/theme-menu-item.js";
 export { ThemeToggle } from "./layout/theme-toggle.js";

package/dist/web/lib/upload-file-ref.d.ts

@@ -3,7 +3,10 @@ export type FileRefTarget = Pick<FileUploadFormDataInput, "entityType" | "entity
 /** Carries the server's own `error` message when the upload endpoint sent one. */
 export declare class FileUploadFailedError extends Error {
     readonly fromServer: boolean;
-    constructor(message: string, fromServer: boolean);
+    readonly httpStatus?: number | undefined;
+    readonly code?: string | undefined;
+    constructor(message: string, fromServer: boolean, httpStatus?: number | undefined, code?: string | undefined);
 }
+export declare function isSessionEndedUploadError(cause: unknown): boolean;
 /** Posts one file to the stack's file endpoint (double-submit CSRF) and returns the new FileRef id. */
 export declare function uploadFileRef(file: Blob, target?: FileRefTarget): Promise<string>;

package/dist/web/lib/upload-file-ref.js

@@ -1,14 +1,25 @@
 import { propertyOf } from "@cosmicdrift/kumiko-types/type-guards";
 import { CSRF_HEADER_NAME, readCsrfToken } from "../../live/index.js";
+import { isSessionEndedError } from "../../session/session-ended.js";
 import { buildFileUploadFormData } from "./file-upload-form-data.js";
 /** Carries the server's own `error` message when the upload endpoint sent one. */
 export class FileUploadFailedError extends Error {
     fromServer;
-    constructor(message, fromServer) {
+    httpStatus;
+    code;
+    constructor(message, fromServer, httpStatus, code) {
         super(message);
         this.fromServer = fromServer;
+        this.httpStatus = httpStatus;
+        this.code = code;
     }
 }
+export function isSessionEndedUploadError(cause) {
+    return (cause instanceof FileUploadFailedError &&
+        cause.code !== undefined &&
+        cause.httpStatus !== undefined &&
+        isSessionEndedError({ code: cause.code, httpStatus: cause.httpStatus }));
+}
 /** Posts one file to the stack's file endpoint (double-submit CSRF) and returns the new FileRef id. */
 export async function uploadFileRef(file, target) {
     const csrf = readCsrfToken();
@@ -21,9 +32,10 @@ export async function uploadFileRef(file, target) {
     const id = propertyOf(json, "id");
     if (!res.ok || typeof id !== "string") {
         const message = propertyOf(json, "error");
+        const code = propertyOf(json, "code");
         throw typeof message === "string"
-            ? new FileUploadFailedError(message, true)
-            : new FileUploadFailedError(`upload failed (${res.status})`, false);
+            ? new FileUploadFailedError(message, true, res.status, typeof code === "string" ? code : undefined)
+            : new FileUploadFailedError(`upload failed (${res.status})`, false, res.status);
     }
     return id;
 }

package/dist/web/primitives/file-upload.js

@@ -6,17 +6,18 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
 // file name link. A disabled input shows the value only, without controls.
 import { ImageIcon, Loader2, Upload } from "lucide-react";
 import { useRef, useState } from "react";
-import { useTranslation } from "../../index.js";
+import { useSessionEndedSignal, useTranslation } from "../../index.js";
 import { toAcceptAttr } from "../lib/accept-attr.js";
 import { resizeImageBeforeUpload } from "../lib/resize-image.js";
 import { uploadErrorKey } from "../lib/upload-error-key.js";
-import { uploadFileRef } from "../lib/upload-file-ref.js";
+import { isSessionEndedUploadError, uploadFileRef } from "../lib/upload-file-ref.js";
 import { Button as UiButton } from "../ui/button.js";
 import { FileNameLink, FileThumbnail } from "./file-thumbnail.js";
 // React's input typings have no `webkitdirectory`; spreading keeps it typed-cast-free.
 const DIRECTORY_INPUT_ATTRS = { webkitdirectory: "", multiple: true };
 export function FileUploadInput({ kind, id, value, onChange, accept, disabled, entityType, uploadActionForm, entityId, fieldName, imageVariant, capture, directory, onFilesPicked, pickLabel, testId, }) {
     const t = useTranslation();
+    const sessionEnded = useSessionEndedSignal();
     const inputRef = useRef(null);
     const [uploading, setUploading] = useState(false);
     const [error, setError] = useState(null);
@@ -42,6 +43,8 @@ export function FileUploadInput({ kind, id, value, onChange, accept, disabled, e
             }));
         }
         catch (cause) {
+            if (isSessionEndedUploadError(cause))
+                sessionEnded?.notify();
             setError(t(uploadErrorKey(cause)));
         }
         finally {

package/dist/web/primitives/files-dropzone.js

@@ -3,12 +3,13 @@ import { jsx as _jsx } from "react/jsx-runtime";
 // file, the field value is the array of FileRef ids of the files that uploaded. Failed files stay
 // out of the value; removing a row removes its id.
 import { useEffect, useRef } from "react";
-import { useTranslation } from "../../index.js";
+import { useSessionEndedSignal, useTranslation } from "../../index.js";
 import { FileCountLimitError, uploadErrorKey } from "../lib/upload-error-key.js";
-import { uploadFileRef } from "../lib/upload-file-ref.js";
+import { isSessionEndedUploadError, uploadFileRef, } from "../lib/upload-file-ref.js";
 import { UploadZone } from "../widgets/upload-zone.js";
 export function FilesDropzoneInput({ id, value, onChange, accept, maxSize, maxCount, disabled, entityType, uploadActionForm, entityId, fieldName, testId, }) {
     const t = useTranslation();
+    const sessionEnded = useSessionEndedSignal();
     // Uploads of one batch finish independently; building each next value from the render's
     // `value` would drop the ids of the others. Re-synced whenever the owner changes the value.
     const latestIds = useRef(value);
@@ -33,6 +34,11 @@ export function FilesDropzoneInput({ id, value, onChange, accept, maxSize, maxCo
             onChange(latestIds.current);
             return fileId;
         }
+        catch (cause) {
+            if (isSessionEndedUploadError(cause))
+                sessionEnded?.notify();
+            throw cause;
+        }
         finally {
             uploadsRunning.current -= 1;
         }

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

@@ -84,6 +84,12 @@ export function InfinityList({ query, payload, pageSize = 50, rows, nextCursor,
             requestSeq.current += 1;
         };
     }, [load]);
+    // Trailing debounce + in-flight coalesce: bulk SSE storms must not fan out
+    // into one query per event. A refresh already running schedules
+    // exactly one trailing pass after it settles.
+    const liveTimerRef = useRef(null);
+    const liveInFlightRef = useRef(false);
+    const liveTrailingRef = useRef(false);
     // Live-mode: on an SSE event for the query's entity, refetch only the
     // first page and merge it in — rows the fresh page still contains move
     // to the front (newest-first feeds), rows it dropped (edited/deleted
@@ -98,8 +104,12 @@ export function InfinityList({ query, payload, pageSize = 50, rows, nextCursor,
         // rows bumps (below), because those are newer than the running load's.
         const seqAtStart = requestSeq.current;
         const res = await dispatcher.query(query, { ...payload, limit: pageSize });
-        if (seqAtStart !== requestSeq.current)
+        if (seqAtStart !== requestSeq.current) {
+            // A load-more bumps the sequence without covering page 1, so the signal that
+            // triggered this refresh would otherwise be lost.
+            liveTrailingRef.current = true;
             return;
+        }
         // skip: background live refresh failed, keep showing the current rows
         if (!res.isSuccess)
             return;
@@ -137,12 +147,6 @@ export function InfinityList({ query, payload, pageSize = 50, rows, nextCursor,
             return { kind: "ready", rows: [...freshRows, ...staleRows], cursor: prev.cursor };
         });
     }, [dispatcher, query, pageSize, payloadKey]);
-    // Trailing debounce + in-flight coalesce: bulk SSE storms must not fan out
-    // into one query per event. A refresh already running schedules
-    // exactly one trailing pass after it settles.
-    const liveTimerRef = useRef(null);
-    const liveInFlightRef = useRef(false);
-    const liveTrailingRef = useRef(false);
     useEffect(() => {
         // skip: live mode off, no SSE subscription needed
         if (!live)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cosmicdrift/kumiko-renderer",
-  "version": "0.394.0",
+  "version": "0.396.0",
   "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,12 +48,8 @@
     }
   },
   "dependencies": {
-    "@cosmicdrift/kumiko-framework": "0.394.0",
-    "@cosmicdrift/kumiko-types": "0.394.0",
-    "@tiptap/core": "^3.31.3",
-    "@tiptap/pm": "^3.31.3",
-    "@tiptap/react": "^3.31.3",
-    "@tiptap/starter-kit": "^3.31.3",
+    "@cosmicdrift/kumiko-framework": "0.396.0",
+    "@cosmicdrift/kumiko-types": "0.396.0",
     "@types/qrcode": "^1.5.5",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
@@ -83,8 +79,8 @@
     }
   },
   "devDependencies": {
-    "@cosmicdrift/kumiko-locale-de": "0.394.0",
-    "@cosmicdrift/kumiko-testing": "0.394.0",
+    "@cosmicdrift/kumiko-locale-de": "0.396.0",
+    "@cosmicdrift/kumiko-testing": "0.396.0",
     "@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,16 @@
 [
+  {
+    "version": "0.395.0",
+    "type": "improvement",
+    "title": "Server field errors without a field on the form show in the form banner",
+    "detail": "An entityEdit save that fails with a field error whose path is not a rendered field (for example a field an extension section writes) now shows the message in the form error banner instead of losing it."
+  },
+  {
+    "version": "0.395.0",
+    "type": "fix",
+    "title": "A live refresh that a load-more supersedes is retried instead of lost",
+    "detail": "When a live signal triggered a first-page refresh while the list loaded its next page, the refresh result was discarded and nothing re-ran it, so the change on page 1 stayed invisible until the next event. The discarded refresh now runs once more."
+  },
   {
     "version": "0.394.0",
     "type": "improvement",

package/dist/web/app/rich-content-editor.d.ts

@@ -1,3 +0,0 @@
-import { type ReactNode } from "react";
-import { type ContentEditorProps } from "../../index.ts";
-export declare function RichContentEditor(props: ContentEditorProps): ReactNode;

package/dist/web/app/rich-content-editor.js

@@ -1,15 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-// @runtime client
-//
-// "rich" contentFormat editor: WYSIWYG on tiptap. Public contract is the
-// same four props every ContentEditorComponent gets — no tiptap type
-// crosses this boundary. tiptap itself is dynamic-imported (TiptapEditor
-// lives in ./tiptap-editor) so an app that never mounts a "rich" collection
-// never pays for it; the fallback while the chunk loads is the same plain
-// textarea uses for a missing editor, never a blank panel.
-import { lazy, Suspense } from "react";
-import { TextareaContentEditor } from "../../index.js";
-const TiptapEditor = lazy(() => import("./tiptap-editor.js"));
-export function RichContentEditor(props) {
-    return (_jsx(Suspense, { fallback: _jsx(TextareaContentEditor, { ...props }), children: _jsx(TiptapEditor, { ...props }) }));
-}

package/dist/web/app/tiptap-editor.d.ts

@@ -1,3 +0,0 @@
-import { type ReactNode } from "react";
-import { type ContentEditorProps } from "../../index.ts";
-export default function TiptapEditor({ id, value, onChange, variables, readOnly, }: ContentEditorProps): ReactNode;

package/dist/web/app/tiptap-editor.js

@@ -1,120 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-// @runtime client
-//
-// tiptap-backed implementation behind RichContentEditor's lazy() boundary —
-// never import this file directly, tiptap must only load when a "rich"
-// collection is actually rendered. StarterKit covers bold/italic/lists/
-// headings, and its bundled Link extension autolinks on type/paste — no
-// link button, so no URL-prompt UI to build or test.
-import { EditorContent, useEditor, useEditorState } from "@tiptap/react";
-import StarterKit from "@tiptap/starter-kit";
-import { Bold as BoldIcon, Heading1, Heading2, Italic as ItalicIcon, List, ListOrdered, } from "lucide-react";
-import { useEffect } from "react";
-import { TextareaContentEditor, usePrimitives, useTranslation, VariableChips, } from "../../index.js";
-import { cn } from "../lib/cn.js";
-function Toolbar({ actions, disabled, }) {
-    const { Button } = usePrimitives();
-    return (_jsx("div", { className: "flex flex-wrap gap-1 border-b border-input p-1", children: actions.map((action) => (_jsx(Button, { type: "button", variant: action.isActive ? "primary" : "secondary", size: "icon", disabled: disabled, onClick: action.onClick, ariaLabel: action.label, children: _jsx(action.icon, { size: 16 }) }, action.label))) }));
-}
-export default function TiptapEditor({ id, value, onChange, variables, readOnly, }) {
-    const t = useTranslation();
-    // ponytail: rich = StarterKit's schema (bold/italic/lists/headings/links).
-    // Anything the schema doesn't model — <table>, <div>/<span>, style attrs,
-    // <img>, classes — is dropped on first parse (setContent below, and the
-    // initial `content: value` here). Upgrade if that ceiling is hit: add the
-    // matching tiptap extensions, or a raw-HTML mode for markup StarterKit
-    // can't represent.
-    const editor = useEditor({
-        extensions: [StarterKit],
-        content: value,
-        editable: !readOnly,
-        // Suspense (RichContentEditor's lazy boundary) speculatively mounts
-        // this component before committing it; immediate render would create
-        // an editor instance during that throwaway pass.
-        immediatelyRender: false,
-        // Caller-supplied id — the Field wrapping the editor (TextBlockEditor)
-        // associates its label via this id, see ContentEditorProps.id in
-        // content-editors.tsx.
-        editorProps: { attributes: { id } },
-        onUpdate: ({ editor: e }) => onChange(e.getHTML()),
-    });
-    // `useEditor` alone leaves `editor.isActive(...)` reads in the render body
-    // frozen on the last prop-driven render — @tiptap/react v3 defaults
-    // `shouldRerenderOnTransaction` to false, so a selection-only change (e.g.
-    // moving the cursor into bold text without typing) never triggers a
-    // re-render on its own. `useEditorState` subscribes to transactions itself
-    // and only re-renders when the selected slice of state actually changes.
-    const activeState = useEditorState({
-        editor,
-        selector: ({ editor: e }) => e === null
-            ? null
-            : {
-                bold: e.isActive("bold"),
-                italic: e.isActive("italic"),
-                heading1: e.isActive("heading", { level: 1 }),
-                heading2: e.isActive("heading", { level: 2 }),
-                bulletList: e.isActive("bulletList"),
-                orderedList: e.isActive("orderedList"),
-            },
-    });
-    // TextBlockEditor loads the entry's content asynchronously (by-slug query
-    // resolves after mount), so `value` arrives after useEditor already read
-    // its initial (empty) content once. Sync it in — guarded against
-    // clobbering in-flight typing by comparing against the editor's own HTML.
-    useEffect(() => {
-        if (editor && value !== editor.getHTML()) {
-            editor.commands.setContent(value, { emitUpdate: false });
-        }
-    }, [value, editor]);
-    useEffect(() => {
-        editor?.setEditable(!readOnly);
-    }, [readOnly, editor]);
-    if (!editor)
-        return (_jsx(TextareaContentEditor, { id: id, value: value, onChange: onChange, variables: variables, readOnly: readOnly }));
-    const actions = [
-        {
-            label: t("kumiko.contentEditor.bold"),
-            icon: BoldIcon,
-            isActive: activeState?.bold ?? false,
-            onClick: () => editor.chain().focus().toggleBold().run(),
-        },
-        {
-            label: t("kumiko.contentEditor.italic"),
-            icon: ItalicIcon,
-            isActive: activeState?.italic ?? false,
-            onClick: () => editor.chain().focus().toggleItalic().run(),
-        },
-        {
-            label: t("kumiko.contentEditor.heading1"),
-            icon: Heading1,
-            isActive: activeState?.heading1 ?? false,
-            onClick: () => editor.chain().focus().toggleHeading({ level: 1 }).run(),
-        },
-        {
-            label: t("kumiko.contentEditor.heading2"),
-            icon: Heading2,
-            isActive: activeState?.heading2 ?? false,
-            onClick: () => editor.chain().focus().toggleHeading({ level: 2 }).run(),
-        },
-        {
-            label: t("kumiko.contentEditor.bulletList"),
-            icon: List,
-            isActive: activeState?.bulletList ?? false,
-            onClick: () => editor.chain().focus().toggleBulletList().run(),
-        },
-        {
-            label: t("kumiko.contentEditor.orderedList"),
-            icon: ListOrdered,
-            isActive: activeState?.orderedList ?? false,
-            onClick: () => editor.chain().focus().toggleOrderedList().run(),
-        },
-    ];
-    const insertVariable = (name) => {
-        editor
-            .chain()
-            .focus()
-            .insertContent({ type: "text", text: `{{${name}}}` })
-            .run();
-    };
-    return (_jsxs("div", { className: "rounded-md border border-input bg-transparent", children: [_jsx(Toolbar, { actions: actions, disabled: readOnly }), _jsx(EditorContent, { editor: editor, className: cn("min-h-40 px-3 py-2 text-base outline-none md:text-sm", "[&_.ProseMirror]:min-h-40 [&_.ProseMirror]:outline-none", "[&_ul]:list-disc [&_ol]:list-decimal [&_ul]:pl-6 [&_ol]:pl-6", "[&_h1]:text-xl [&_h1]:font-bold [&_h2]:text-lg [&_h2]:font-bold", "[&_a]:underline [&_a]:text-primary", "[&_strong]:font-bold [&_em]:italic") }), variables.length > 0 && (_jsx("div", { className: "border-t border-input p-1", children: _jsx(VariableChips, { variables: variables, onInsert: insertVariable, disabled: readOnly }) }))] }));
-}