@simmalugnt-se/payload-editor-assistant 0.11.2 → 0.12.0

package/dist/form/diff.js

@@ -41,7 +41,7 @@ const FIELD_PREVIEW = 300;
  * `labels` names related documents by id (see `labelRelations`), so a chosen image reads as its
  * filename or alt text instead of an id. Rich text is listed by `richTextLines` instead.
  */
-export function humanDiff(current, operations, language = "en", labels) {
+export function humanDiff(current, operations, language = "en", labels, fieldLabel = label) {
     const copy = COPY[language];
     const nameOf = (value) => {
         const id = typeof value === "string" || typeof value === "number"
@@ -65,30 +65,30 @@ export function humanDiff(current, operations, language = "en", labels) {
                 const before = getAtPath(current, parseFieldPath(operation.path));
                 return {
                     path: operation.path,
-                    text: `${label(operation.path)}: ${preview(named(before), copy)} → ${preview(named(operation.value), copy)}`,
+                    text: `${fieldLabel(operation.path)}: ${preview(named(before), copy)} → ${preview(named(operation.value), copy)}`,
                 };
             }
             case "unset":
-                return { path: operation.path, text: copy.clear(label(operation.path)) };
+                return { path: operation.path, text: copy.clear(fieldLabel(operation.path)) };
             case "array.insert":
                 return {
                     path: operation.path,
-                    text: withFields(copy.addItem(operation.index + 1, label(operation.path)), operation.value, copy),
+                    text: withFields(copy.addItem(operation.index + 1, fieldLabel(operation.path)), operation.value, copy),
                 };
             case "array.remove":
                 return {
                     path: operation.path,
-                    text: copy.removeItem(operation.index + 1, label(operation.path)),
+                    text: copy.removeItem(operation.index + 1, fieldLabel(operation.path)),
                 };
             case "array.move":
                 return {
                     path: operation.path,
-                    text: copy.moveItem(operation.from + 1, operation.to + 1, label(operation.path)),
+                    text: copy.moveItem(operation.from + 1, operation.to + 1, fieldLabel(operation.path)),
                 };
             case "array.replace":
                 return {
                     path: operation.path,
-                    text: withFields(copy.replaceItem(operation.index + 1, label(operation.path)), operation.value, copy),
+                    text: withFields(copy.replaceItem(operation.index + 1, fieldLabel(operation.path)), operation.value, copy),
                 };
             case "blocks.insert":
                 return {
@@ -98,7 +98,7 @@ export function humanDiff(current, operations, language = "en", labels) {
             case "blocks.remove":
                 return {
                     path: operation.path,
-                    text: copy.removeBlock(operation.index + 1, label(operation.path)),
+                    text: copy.removeBlock(operation.index + 1, fieldLabel(operation.path)),
                 };
             case "blocks.move":
                 return { path: operation.path, text: copy.moveBlock(operation.from + 1, operation.to + 1) };
@@ -116,9 +116,9 @@ export function humanDiff(current, operations, language = "en", labels) {
  * The parts of a rich text field that changed: `before` as the model read it (Markdown blocks),
  * `after` as compiled, where `{ keep: i }` is block `i` unchanged.
  */
-export function richTextLines(path, before, after, language = "en") {
+export function richTextLines(path, before, after, language = "en", fieldLabel = label) {
     const copy = COPY[language];
-    const field = label(path);
+    const field = fieldLabel(path);
     const part = (block) => typeof block === "string"
         ? preview(block, copy, FIELD_PREVIEW)
         : `[${block.type ?? "?"}]`;

package/dist/form/field-label.d.ts

@@ -0,0 +1,20 @@
+import type { FieldNode } from "../schema/fields.ts";
+export type FieldPathGroup = {
+    path: string;
+    label: string;
+    kind: "container" | "block" | "row" | "group";
+    position?: number;
+};
+/** Schema labels and one-based row positions for a concrete form field path. */
+export declare function fieldPathLabels(fields: FieldNode[], path: string, data: unknown, language?: "en" | "sv"): {
+    label: string;
+    context?: string;
+    full: string;
+};
+/** Structured parents let the review group fields instead of repeating breadcrumbs. */
+export declare function fieldPathInfo(fields: FieldNode[], path: string, data: unknown, language?: "en" | "sv"): {
+    label: string;
+    context?: string;
+    full: string;
+    groups: FieldPathGroup[];
+};

package/dist/form/field-label.js

@@ -0,0 +1,72 @@
+/** Schema labels and one-based row positions for a concrete form field path. */
+export function fieldPathLabels(fields, path, data, language = "en") {
+    const { groups: _groups, ...labels } = fieldPathInfo(fields, path, data, language);
+    return labels;
+}
+/** Structured parents let the review group fields instead of repeating breadcrumbs. */
+export function fieldPathInfo(fields, path, data, language = "en") {
+    const parts = [];
+    const groups = [];
+    let scope = fields;
+    let value = data;
+    let field;
+    let schemaPath = "";
+    let concretePath = "";
+    for (const segment of path.split(".")) {
+        concretePath = concretePath ? `${concretePath}.${segment}` : segment;
+        value = value?.[segment];
+        if (/^\d+$/.test(segment)) {
+            const position = Number(segment) + 1;
+            if (field?.type === "blocks") {
+                const blockType = value?.blockType;
+                const block = field.blocks?.find((block) => block.slug === blockType);
+                parts.push(`${name(block?.label ?? block?.slug ?? "block")} (block ${position})`);
+                groups.push({
+                    path: concretePath,
+                    label: name(block?.label ?? block?.slug ?? "block"),
+                    kind: "block",
+                    position,
+                });
+                scope = block?.fields ?? [];
+            }
+            else {
+                const row = language === "sv" ? "rad" : "row";
+                parts[parts.length - 1] = `${parts.at(-1) ?? ""} (${row} ${position})`;
+                groups.push({
+                    path: concretePath,
+                    label: `${name(row)} ${position}`,
+                    kind: "row",
+                    position,
+                });
+            }
+            continue;
+        }
+        schemaPath = schemaPath ? `${schemaPath}.${segment}` : segment;
+        field = scope.find((entry) => entry.path === schemaPath);
+        parts.push(name(field?.label ?? segment));
+        if (field?.type === "group" || field?.type === "blocks" || field?.type === "array") {
+            groups.push({
+                path: concretePath,
+                label: name(field.label ?? segment),
+                kind: field.type === "group" ? "group" : "container",
+            });
+        }
+        else if (!field && scope.some((entry) => entry.path.startsWith(`${schemaPath}.`))) {
+            groups.push({ path: concretePath, label: name(segment), kind: "group" });
+        }
+        // Named tabs are flattened by walkFields, but their name remains in each child's path.
+        if (field)
+            scope = field.fields ?? [];
+    }
+    const label = parts.at(-1) ?? name(path);
+    const context = parts.length > 1 ? parts.slice(0, -1).join(" › ") : undefined;
+    return {
+        label,
+        ...(context ? { context } : {}),
+        full: parts.join(" › ") || label,
+        groups: groups.filter((group) => group.path !== path),
+    };
+}
+function name(value) {
+    return value.charAt(0).toUpperCase() + value.slice(1);
+}

package/dist/form/shape.d.ts

@@ -1,5 +1,8 @@
-import type { FieldNode } from "../schema/fields.ts";
+import { type FieldNode } from "../schema/fields.ts";
+import type { FormOperation } from "./operations.ts";
 import { type RichTextLink } from "./rich-text.ts";
+/** Rich text fields the operations reach, whole or by block, as form paths. */
+export declare function richTextPaths(operations: FormOperation[], fields: FieldNode[], current: Record<string, unknown>): string[];
 /**
  * A copy of `data` where each rich text field the converters can read is a list of `{ keep: i }`,
  * one per stored block, so operations can set, insert or remove single blocks (`layout.1.content.2`)

package/dist/form/shape.js

@@ -1,4 +1,22 @@
+import { fieldAtPath } from "../schema/fields.js";
 import { fromBlocks, isLexicalState, isRichTextBlocks, toBlocks, } from "./rich-text.js";
+/** Rich text fields the operations reach, whole or by block, as form paths. */
+export function richTextPaths(operations, fields, current) {
+    const paths = new Set();
+    for (const operation of operations) {
+        if (!("path" in operation))
+            continue;
+        const segments = operation.path.split(".");
+        for (let end = 1; end <= segments.length; end++) {
+            const prefix = segments.slice(0, end).join(".");
+            if (fieldAtPath(fields, prefix, current)?.type === "richText") {
+                paths.add(prefix);
+                break;
+            }
+        }
+    }
+    return [...paths];
+}
 /**
  * A copy of `data` where each rich text field the converters can read is a list of `{ keep: i }`,
  * one per stored block, so operations can set, insert or remove single blocks (`layout.1.content.2`)

package/dist/runtime/agent.d.ts

@@ -13,7 +13,7 @@ export type AgentChatResult = {
         capability: "form.propose" | "draft.create" | "content.update";
         /** The form with the change applied, shown in Admin before the editor keeps it. */
         preview?: ProposalPreview;
-        /** A batch's change list, with what the editor may rewrite. */
+        /** Structured fields and rich text previews for Admin's review. */
         lines?: ProposalLine[];
     };
     navigate?: {

package/dist/runtime/agent.js

@@ -228,7 +228,10 @@ function buildSdkTools(ai, ctx, captured, previews, emit) {
                         : { ...executed, preview: undefined };
                     if (preview && executed.ok && executed.pendingApproval) {
                         previews.set(executed.pendingApproval.approvalId, preview);
-                        emit({ type: "proposal", pendingApproval: { ...executed.pendingApproval, preview } });
+                        emit({
+                            type: "proposal",
+                            pendingApproval: { ...executed.pendingApproval, lines: executed.lines, preview },
+                        });
                     }
                     emit({
                         type: "step",

package/dist/runtime/tools.d.ts

@@ -53,7 +53,7 @@ export type ToolSuccess = {
         nonce: string;
         capability: "form.propose" | "draft.create" | "content.update";
     };
-    /** The change list; a batch shows it per document. */
+    /** Structured review data for Admin, including full rich text previews. */
     lines?: ProposalLine[];
     navigate?: {
         href: string;
@@ -94,7 +94,36 @@ export declare function executeTool(name: string, input: Record<string, unknown>
  */
 export declare function toolModelOutput(outcome: ToolOutcome): {
     type: "json";
-    value: ToolOutcome;
+    value: ToolFailure;
+} | {
+    type: "json";
+    value: {
+        ok: true;
+        capability: string;
+        data?: unknown;
+        pendingApproval?: {
+            title: string;
+            summary: string;
+            approvalId: string;
+            nonce: string;
+            capability: "form.propose" | "draft.create" | "content.update";
+        };
+        navigate?: {
+            href: string;
+            label: string;
+        } | {
+            candidates: Array<{
+                href: string;
+                label: string;
+            }>;
+        };
+        /** For the model only, as file parts (see `toolModelOutput`); never sent to Admin. */
+        images?: Array<{
+            id?: string | number;
+            mediaType: string;
+            data: string;
+        }>;
+    };
 } | {
     type: "content";
     value: ({

package/dist/runtime/tools.js

@@ -233,7 +233,7 @@ export async function executeTool(name, input, ctx) {
                     nonce: proposed.nonce,
                     capability,
                 },
-                ...(batch ? { lines: proposed.lines } : {}),
+                lines: proposed.lines,
                 preview: proposed.preview,
             };
         }
@@ -246,10 +246,15 @@ export async function executeTool(name, input, ctx) {
  * has one, and the rest as text before them.
  */
 export function toolModelOutput(outcome) {
-    if (!outcome.ok || !outcome.images?.length) {
+    if (!outcome.ok) {
         return { type: "json", value: outcome };
     }
-    const { images, ...rest } = outcome;
+    // Full previews belong to Admin; the model already has its operations and the text summary.
+    const { lines: _lines, preview: _preview, ...modelOutcome } = outcome;
+    if (!modelOutcome.images?.length) {
+        return { type: "json", value: modelOutcome };
+    }
+    const { images, ...rest } = modelOutcome;
     return {
         type: "content",
         value: [

package/dist/schema/project.d.ts

@@ -3,10 +3,15 @@ import { type FieldNode } from "./fields.ts";
 export declare function projectRecord(data: Record<string, unknown> | null | undefined, fields: FieldNode[], redact?: (input: {
     slug: string;
     data: Record<string, unknown>;
-}) => Record<string, unknown>, slug?: string): {
+}) => Record<string, unknown>, slug?: string, mode?: "model" | "form"): {
     data: Record<string, unknown>;
     truncated: boolean;
 };
+/** Allowlisted, redacted form data keeps stored rich text and is never replaced by a size excerpt. */
+export declare function projectFormRecord(data: Record<string, unknown>, fields: FieldNode[], redact?: (input: {
+    slug: string;
+    data: Record<string, unknown>;
+}) => Record<string, unknown>, slug?: string): Record<string, unknown>;
 export declare function projectIdentity(doc: Record<string, unknown>, locale?: string): Record<string, unknown>;
 export declare function capRecord(data: Record<string, unknown>): {
     data: Record<string, unknown>;

package/dist/schema/project.js

@@ -2,7 +2,7 @@ import { isDeniedFieldName } from "../config/denied-fields.js";
 import { toBlocks } from "../form/rich-text.js";
 import { isFieldAllowed } from "./fields.js";
 const MAX_CHARS = 16_000;
-export function projectRecord(data, fields, redact, slug = "") {
+export function projectRecord(data, fields, redact, slug = "", mode = "model") {
     const projected = {};
     if (!data) {
         return { data: projected, truncated: false };
@@ -11,10 +11,14 @@ export function projectRecord(data, fields, redact, slug = "") {
         if (!(field.name in data)) {
             continue;
         }
-        projected[field.name] = projectValue(data[field.name], field);
+        projected[field.name] = projectValue(data[field.name], field, mode);
     }
     const redacted = redact ? redact({ slug, data: projected }) : projected;
-    return capRecord(redacted);
+    return mode === "form" ? { data: redacted, truncated: false } : capRecord(redacted);
+}
+/** Allowlisted, redacted form data keeps stored rich text and is never replaced by a size excerpt. */
+export function projectFormRecord(data, fields, redact, slug = "") {
+    return projectRecord(data, fields, redact, slug, "form").data;
 }
 export function projectIdentity(doc, locale) {
     const identity = {
@@ -53,13 +57,14 @@ export function filterRootKeys(data, allowlist, denyFields) {
     }
     return next;
 }
-function projectValue(value, field) {
+function projectValue(value, field, mode) {
     if (value === null || value === undefined) {
         return value;
     }
     if (field.type === "array" && Array.isArray(value)) {
         return value.map((item) => item && typeof item === "object" && !Array.isArray(item)
-            ? projectRecord(item, field.fields ?? []).data
+            ? projectRecord(item, field.fields ?? [], undefined, "", mode)
+                .data
             : item);
     }
     if (field.type === "blocks" && Array.isArray(value)) {
@@ -70,7 +75,7 @@ function projectValue(value, field) {
             const record = item;
             const blockType = typeof record.blockType === "string" ? record.blockType : "";
             const block = field.blocks?.find((entry) => entry.slug === blockType);
-            const projected = projectRecord(record, block?.fields ?? []).data;
+            const projected = projectRecord(record, block?.fields ?? [], undefined, "", mode).data;
             return {
                 id: record.id,
                 blockType,
@@ -79,13 +84,14 @@ function projectValue(value, field) {
         });
     }
     if (field.type === "group" && value && typeof value === "object" && !Array.isArray(value)) {
-        return projectRecord(value, field.fields ?? []).data;
+        return projectRecord(value, field.fields ?? [], undefined, "", mode)
+            .data;
     }
     if (field.type === "relationship" || field.type === "upload") {
         return projectRelation(value);
     }
     if (field.type === "richText") {
-        return toBlocks(value, field.editor) ?? value;
+        return mode === "form" ? value : (toBlocks(value, field.editor) ?? value);
     }
     return value;
 }

package/dist/styles/assistant.css

@@ -240,6 +240,12 @@ html[data-theme="dark"] .ea-aside {
   line-height: 1.5;
 }
 
+.ea-approval__review {
+  max-height: 50vh;
+  overflow-y: auto;
+  margin-bottom: calc(var(--base) * 0.6);
+}
+
 .ea-approval__hint {
   margin: 0 0 calc(var(--base) * 0.4);
   color: var(--theme-elevation-500);
@@ -479,7 +485,7 @@ html[data-theme="dark"] .ea-trigger--open .ea-trigger__icon {
   padding: calc(var(--base) * 0.5) calc(var(--base) * 0.6);
   border: 1px solid var(--theme-elevation-150);
   border-radius: var(--style-radius-m);
-  background: var(--theme-elevation-50);
+  background: var(--theme-elevation-0);
   font-size: 13px;
   line-height: 1.45;
 }
@@ -504,10 +510,17 @@ html[data-theme="dark"] .ea-trigger--open .ea-trigger__icon {
 }
 
 .ea-batch__card-head {
+  position: sticky;
+  top: 0;
+  z-index: 1;
   display: flex;
   align-items: center;
   gap: calc(var(--base) * 0.4);
   min-width: 0;
+  margin: calc(var(--base) * -0.5) calc(var(--base) * -0.6) 0;
+  padding: calc(var(--base) * 0.5) calc(var(--base) * 0.6);
+  border-bottom: 1px solid var(--theme-elevation-150);
+  background: var(--theme-elevation-0);
 }
 
 .ea-batch__card-head input[type="checkbox"] {
@@ -549,29 +562,120 @@ html[data-theme="dark"] .ea-trigger--open .ea-trigger__icon {
   font-size: 12px;
 }
 
-.ea-batch__lines {
-  margin: calc(var(--base) * 0.4) 0 0;
-  padding-left: 1.1em;
+.ea-review {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+  margin-top: 16px;
+  font-size: 13px;
+  line-height: 1.5;
+}
+
+.ea-review__collection > h4 {
+  margin: 0 0 8px;
+  color: var(--theme-elevation-600);
+  font-size: 11px;
+  font-weight: 600;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
 }
 
-.ea-batch__edit {
+.ea-review__children {
   display: flex;
   flex-direction: column;
-  gap: 2px;
-  margin-inline-start: -1.1em;
-  list-style: none;
+  gap: 16px;
+  min-width: 0;
 }
 
-.ea-batch__label {
+.ea-review__group {
+  padding-top: 12px;
+  border-top: 1px solid var(--theme-elevation-150);
+}
+
+.ea-review__group > summary {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  cursor: pointer;
+  color: var(--theme-text);
+  font-size: 14px;
   font-weight: 600;
+  list-style: none;
+}
+
+.ea-review__group > summary::-webkit-details-marker {
+  display: none;
 }
 
-.ea-batch__before {
+.ea-review__group > summary::before {
+  content: "";
+  width: 5px;
+  height: 5px;
+  flex-shrink: 0;
+  border-right: 1.5px solid currentColor;
+  border-bottom: 1.5px solid currentColor;
+  transform: rotate(-45deg);
+  transition: transform 100ms;
+}
+
+.ea-review__group[open] > summary::before {
+  transform: rotate(45deg);
+}
+
+.ea-review__group > summary:focus-visible {
+  outline: 2px solid var(--ea-accent);
+  outline-offset: 3px;
+}
+
+.ea-review__group > .ea-review__children {
+  margin-top: 14px;
+}
+
+.ea-review__group--row,
+.ea-review__group--group {
+  padding-top: 0;
+  padding-inline-start: 10px;
+  border-top: 0;
+  border-inline-start: 2px solid var(--theme-elevation-150);
+}
+
+.ea-review__group--row > summary,
+.ea-review__group--group > summary {
+  font-size: 12px;
+}
+
+.ea-review__badge {
+  margin-inline-start: auto;
   color: var(--theme-elevation-600);
-  overflow-wrap: anywhere;
+  font-size: 11px;
+  font-weight: 400;
+}
+
+.ea-review__field {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  min-width: 0;
+}
+
+.ea-review__field-head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+}
+
+.ea-review__field-head label {
+  font-size: 12px;
+  font-weight: 600;
+}
+
+.ea-review__new {
+  color: var(--theme-elevation-500);
+  font-size: 10px;
 }
 
-.ea-batch__edit textarea {
+.ea-review__field textarea {
   box-sizing: border-box;
   width: 100%;
   padding: calc(var(--base) * 0.3) calc(var(--base) * 0.4);
@@ -586,12 +690,111 @@ html[data-theme="dark"] .ea-trigger--open .ea-trigger__icon {
   min-height: calc(2lh + calc(var(--base) * 0.6));
 }
 
-.ea-batch__count {
+.ea-review__field textarea:focus-visible {
+  outline: 2px solid var(--ea-accent);
+  outline-offset: 1px;
+}
+
+.ea-review__count {
   align-self: flex-end;
   color: var(--theme-elevation-500);
   font-size: 11px;
 }
 
+.ea-review__current {
+  color: var(--theme-elevation-600);
+  font-size: 12px;
+}
+
+.ea-review__current > summary {
+  cursor: pointer;
+}
+
+.ea-review__current > p,
+.ea-review__value {
+  margin: 0;
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+}
+
+.ea-review__current > p,
+.ea-review__current > .ea-review__rich {
+  margin-top: 8px;
+}
+
+.ea-review__preview,
+.ea-review__value {
+  padding: 12px;
+  border: 1px solid var(--theme-elevation-150);
+  border-radius: var(--style-radius-s);
+  background: var(--theme-elevation-50);
+}
+
+.ea-review__rich {
+  color: var(--theme-text);
+  line-height: 1.65;
+  overflow-wrap: anywhere;
+}
+
+.ea-review__rich > :first-child {
+  margin-top: 0;
+}
+
+.ea-review__rich > :last-child {
+  margin-bottom: 0;
+}
+
+.ea-review__rich p {
+  margin: 0 0 12px;
+  white-space: pre-wrap;
+}
+
+.ea-review__rich h1,
+.ea-review__rich h2,
+.ea-review__rich h3,
+.ea-review__rich h4,
+.ea-review__rich h5,
+.ea-review__rich h6 {
+  margin: 16px 0 8px;
+  font-size: 14px;
+  font-weight: 600;
+  line-height: 1.4;
+}
+
+.ea-review__rich ul,
+.ea-review__rich ol {
+  margin: 0 0 12px;
+  padding-inline-start: 20px;
+}
+
+.ea-review__rich li + li {
+  margin-top: 4px;
+}
+
+.ea-review__rich blockquote {
+  margin: 12px 0;
+  padding-inline-start: 12px;
+  border-inline-start: 2px solid var(--theme-elevation-250);
+}
+
+.ea-review__link {
+  text-decoration: underline;
+  text-underline-offset: 2px;
+}
+
+.ea-review__embedded {
+  display: block;
+  padding: 8px;
+  border: 1px dashed var(--theme-elevation-250);
+  color: var(--theme-elevation-600);
+  font-size: 12px;
+}
+
+.ea-review__change p {
+  margin: 0;
+  white-space: pre-wrap;
+}
+
 .ea-batch__text,
 .ea-batch__hint {
   margin: calc(var(--base) * 0.3) 0 0;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@simmalugnt-se/payload-editor-assistant",
-  "version": "0.11.2",
+  "version": "0.12.0",
   "description": "Context-aware editor assistant plugin for Payload Admin",
   "keywords": [
     "payload",