@semiont/react-ui 0.5.27 → 0.5.28

package/dist/{zh-5FHVWDIN.js → zh-ID6DRYU4.js}

@@ -13,6 +13,8 @@ var AssistProgress = {
   codeCompleteCreated: "\u5DF2\u521B\u5EFA {{count}} \u4E2A{{kind}}",
   codeGeneratingResource: "\u751F\u6210\u4E2D\u2026",
   codeCreatingResource: "\u6B63\u5728\u521B\u5EFA\u8D44\u6E90\u2026",
+  codeCompleteGenerated: "\u5DF2\u521B\u5EFA\u8D44\u6E90",
+  codeCompleteGeneratedTruncated: "\u5DF2\u521B\u5EFA\u8D44\u6E90 \u2014 \u5728\u957F\u5EA6\u9650\u5236\u5904\u88AB\u622A\u65AD",
   kindHighlight: "\u9AD8\u4EAE",
   kindComment: "\u8BC4\u8BBA",
   kindAssessment: "\u8BC4\u4F30",
@@ -247,6 +249,7 @@ var ReferencesPanel = {
   noIncomingReferences: "\u65E0\u4F20\u5165\u5F15\u7528",
   stub: "\u5B58\u6839\u5F15\u7528\uFF08\u672A\u94FE\u63A5\uFF09",
   resolved: "\u5DF2\u89E3\u6790\u5F15\u7528\uFF08\u5DF2\u94FE\u63A5\uFF09",
+  derived: "\u6D3E\u751F",
   open: "\u6253\u5F00",
   unlink: "\u53D6\u6D88\u94FE\u63A5",
   resolve: "\u89E3\u6790\u5F15\u7528",
@@ -254,7 +257,6 @@ var ReferencesPanel = {
   createReference: "\u521B\u5EFA\u5F15\u7528",
   entityTypesOptional: "\u5B9E\u4F53\u7C7B\u578B\uFF08\u53EF\u9009\uFF09",
   fragmentSelected: "\u5DF2\u9009\u62E9\u7247\u6BB5",
-  imageRegionSelected: "\u5DF2\u9009\u62E9\u56FE\u50CF\u533A\u57DF",
   annotateReferences: "\u6CE8\u91CA\u5F15\u7528",
   selectEntityTypes: "\u5B9E\u4F53\u7C7B\u578B\uFF1A",
   select: "\u9009\u62E9",
@@ -265,8 +267,6 @@ var ReferencesPanel = {
   annotating: "\u6B63\u5728\u6CE8\u91CA...",
   includeDescriptiveReferences: "\u5305\u542B\u63CF\u8FF0\u6027\u5F15\u7528",
   descriptiveReferencesTooltip: "\u540C\u65F6\u67E5\u627E\u8BF8\u5982\u300C\u9996\u5E2D\u6267\u884C\u5B98\u300D\u3001\u300C\u79D1\u6280\u5DE8\u5934\u300D\u3001\u300C\u7269\u7406\u5B66\u5BB6\u300D\u7B49\u77ED\u8BED\uFF08\u9664\u540D\u79F0\u5916\uFF09",
-  annotationProgressTitle: "\u6B63\u5728\u6CE8\u91CA\u5B9E\u4F53\u5F15\u7528",
-  cancelAnnotation: "\u53D6\u6D88\u6CE8\u91CA",
   found: "\u627E\u5230 {{count}} \u4E2A",
   complete: "\u6CE8\u91CA\u5B8C\u6210\uFF01",
   failed: "\u6CE8\u91CA\u5931\u8D25",
@@ -381,19 +381,14 @@ var Settings = {
 };
 var AnnotateView = {};
 var ResourceGenerate = {
-  gatherTitle: "\u914D\u7F6E\u6536\u96C6",
-  reviewTitle: "\u67E5\u770B\u4E0A\u4E0B\u6587",
-  configureTitle: "\u914D\u7F6E\u751F\u6210",
-  next: "\u4E0B\u4E00\u6B65",
-  back: "\u8FD4\u56DE",
-  cancel: "\u53D6\u6D88",
   gatherIntro: "\u9009\u62E9\u8981\u5305\u542B\u5728\u6536\u96C6\u7684\u4E0A\u4E0B\u6587\u4E2D\u7684\u5185\u5BB9\u3002",
   includeContent: "\u5305\u542B\u8D44\u6E90\u5185\u5BB9",
   includeSummary: "\u5305\u542B\u6458\u8981",
   gatherDepth: "\u6DF1\u5EA6",
   gatherMaxResources: "\u6700\u5927\u8D44\u6E90\u6570",
   gatherButton: "\u6536\u96C6",
-  excludeLabel: "\u4ECE\u53EC\u56DE\u4E2D\u6392\u9664",
+  editGather: "\u66F4\u6539\u6536\u96C6\u8BBE\u7F6E",
+  recallLabel: "\u5DF2\u5305\u542B\u5728\u53EC\u56DE\u4E2D \u2014 \u53D6\u6D88\u9009\u62E9\u4EE5\u6392\u9664",
   loadingContext: "\u6B63\u5728\u6536\u96C6\u4E0A\u4E0B\u6587...",
   failedContext: "\u6536\u96C6\u4E0A\u4E0B\u6587\u5931\u8D25",
   sourceContextLabel: "\u8D44\u6E90",
@@ -411,18 +406,22 @@ var ResourceGenerate = {
   maxLength: "\u6700\u5927\u957F\u5EA6",
   maxLengthHelp: "\u6700\u5927\u4EE4\u724C\u6570",
   generate: "\u751F\u6210",
-  progressTitle: "\u6B63\u5728\u751F\u6210\u8D44\u6E90",
-  progressCancel: "\u53D6\u6D88\u751F\u6210",
-  progressInProgress: "\u6B63\u5728\u751F\u6210\u2026",
-  progressComplete: "\u751F\u6210\u5B8C\u6210\uFF01",
-  progressFailed: "\u751F\u6210\u5931\u8D25",
-  maxLengthCeiling: "\u53D7 {{model}} \u9650\u5236\u4E3A {{maxOutputTokens}} \u4E2A\u8BCD\u5143\u3002"
+  maxLengthCeiling: "\u53D7 {{model}} \u9650\u5236\u4E3A {{maxOutputTokens}} \u4E2A\u8BCD\u5143\u3002",
+  graphPaneTitle: "\u5468\u8FB9",
+  graphEmpty: "\u5C1A\u65E0\u94FE\u63A5\u3002",
+  resourceLinkLabel: "\u8D44\u6E90\u94FE\u63A5",
+  corpusPaneTitle: "\u76F8\u4F3C\u6BB5\u843D",
+  corpusEmpty: "\u672A\u627E\u5230\u76F8\u4F3C\u6BB5\u843D\u3002",
+  excludedReceipt: "{{types}} \u5DF2\u4ECE\u672C\u6B21\u53EC\u56DE\u4E2D\u6392\u9664",
+  machineRead: "OCR",
+  score: "\u8BC4\u5206",
+  saveLocation: "\u4FDD\u5B58\u4F4D\u7F6E",
+  discardDraftPrompt: "\u653E\u5F03\u6B64\u8349\u7A3F\uFF1F",
+  discardDraft: "\u653E\u5F03",
+  keepEditing: "\u7EE7\u7EED\u7F16\u8F91",
+  title: "\u4ECE\u6B64\u8D44\u6E90\u751F\u6210"
 };
 var ReferenceWizard = {
-  gatherTitle: "\u5DF2\u6536\u96C6\u7684\u4E0A\u4E0B\u6587",
-  configureGenerationTitle: "\u914D\u7F6E\u751F\u6210",
-  configureSearchTitle: "\u914D\u7F6E\u641C\u7D22",
-  searchResultsTitle: "\u641C\u7D22\u7ED3\u679C",
   sourceContextLabel: "\u8D44\u6E90\u4E2D\u7684\u6CE8\u91CA\u4E0A\u4E0B\u6587",
   connectionsLabel: "\u5BF9\u7B49\u6CE8\u91CA",
   citedByLabel: "\u8D44\u6E90\u88AB\u5F15\u7528",
@@ -430,7 +429,6 @@ var ReferenceWizard = {
   userHintPlaceholder: "\u63CF\u8FF0\u6B64\u6CE8\u91CA\u6240\u6307\u7684\u5185\u5BB9...",
   loadingContext: "\u6B63\u5728\u6536\u96C6\u4E0A\u4E0B\u6587...",
   failedContext: "\u6536\u96C6\u4E0A\u4E0B\u6587\u5931\u8D25",
-  cancel: "\u53D6\u6D88",
   generate: "\u751F\u6210",
   compose: "\u7F16\u5199",
   resolutionStrategyLabel: "\u89E3\u6790\u7B56\u7565",
@@ -453,8 +451,26 @@ var ReferenceWizard = {
   semanticScoring: "\u8BED\u4E49\u8BC4\u5206",
   semanticScoringHelp: "\u4F7F\u7528 AI \u6309\u8BED\u4E49\u76F8\u5173\u6027\u5BF9\u7ED3\u679C\u8FDB\u884C\u8BC4\u5206",
   searching: "\u641C\u7D22\u4E2D...",
+  searchFailed: "\u641C\u7D22\u5931\u8D25",
   search: "\u641C\u7D22",
-  maxLengthCeiling: "\u53D7 {{model}} \u9650\u5236\u4E3A {{maxOutputTokens}} \u4E2A\u8BCD\u5143\u3002"
+  maxLengthCeiling: "\u53D7 {{model}} \u9650\u5236\u4E3A {{maxOutputTokens}} \u4E2A\u8BCD\u5143\u3002",
+  graphPaneTitle: "\u5468\u8FB9",
+  graphEmpty: "\u5C1A\u65E0\u94FE\u63A5 \u2014 \u89E3\u6790\u6B64\u5F15\u7528\u5C06\u521B\u5EFA\u7B2C\u4E00\u4E2A\u3002",
+  resourceLinkLabel: "\u8D44\u6E90\u94FE\u63A5",
+  corpusPaneTitle: "\u76F8\u4F3C\u6BB5\u843D",
+  corpusEmpty: "\u672A\u627E\u5230\u76F8\u4F3C\u6BB5\u843D \u2014 \u641C\u7D22\u4E0D\u592A\u53EF\u80FD\u6709\u7ED3\u679C\u3002",
+  excludedReceipt: "{{types}} \u5DF2\u4ECE\u672C\u6B21\u53EC\u56DE\u4E2D\u6392\u9664",
+  machineRead: "OCR",
+  userHintEffect: "\u5F15\u5BFC\u641C\u7D22\u4E0E\u751F\u6210",
+  saveLocation: "\u4FDD\u5B58\u4F4D\u7F6E",
+  entityTypes: "\u5B9E\u4F53\u7C7B\u578B",
+  contentLabel: "\u5185\u5BB9",
+  createAndLink: "\u521B\u5EFA\u5E76\u94FE\u63A5",
+  creatingAndLinking: "\u6B63\u5728\u521B\u5EFA\u5E76\u94FE\u63A5\u2026",
+  discardDraftPrompt: "\u653E\u5F03\u6B64\u8349\u7A3F\uFF1F",
+  discardDraft: "\u653E\u5F03",
+  keepEditing: "\u7EE7\u7EED\u7F16\u8F91",
+  resolveTitle: "\u89E3\u6790\u5F15\u7528"
 };
 var OutcomeToasts = {
   createFailed: "\u65E0\u6CD5\u521B\u5EFA\u6279\u6CE8\uFF1A{{detail}}",
@@ -522,4 +538,4 @@ export {
   UnifiedAnnotationsPanel,
   zh_default as default
 };
-//# sourceMappingURL=zh-5FHVWDIN.js.map
+//# sourceMappingURL=zh-ID6DRYU4.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@semiont/react-ui",
-  "version": "0.5.27",
+  "version": "0.5.28",
   "engines": {
     "node": ">=24.0.0"
   },
@@ -36,6 +36,7 @@
   },
   "files": [
     "dist",
+    "!dist/**/*.map",
     "src/styles",
     "src/components",
     "src/features",
@@ -91,21 +92,21 @@
   },
   "devDependencies": {
     "@headlessui/react": "^2.2.10",
-    "@testing-library/jest-dom": "^7.0.0",
+    "@testing-library/jest-dom": "^7.0.1",
     "@testing-library/react": "^16.1.0",
     "@types/react": "^19.2.18",
     "@types/react-dom": "^19.2.4",
     "@vitest/coverage-v8": "^4.1.8",
     "autoprefixer": "^10.5.4",
     "axe-core": "^4.12.1",
-    "cssnano": "^8.0.2",
+    "cssnano": "^8.0.5",
     "fast-check": "^4.9.0",
     "jest-axe": "^11.0.0",
     "jsdom": "^29.1.1",
     "postcss-import": "^16.1.1",
     "rollup": "^4.62.3",
     "rollup-plugin-dts": "^6.4.1",
-    "styled-components": "^6.4.3",
+    "styled-components": "^6.5.2",
     "tsup": "^8.0.1",
     "typescript": "^6.0.2",
     "vitest": "^4.1.10"
@@ -117,13 +118,13 @@
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
-    "url": "https://github.com/The-AI-Alliance/semiont.git",
+    "url": "git+https://github.com/The-AI-Alliance/semiont.git",
     "directory": "packages/react-ui"
   },
   "dependencies": {
-    "@semiont/core": "0.5.27",
-    "@semiont/http-transport": "0.5.27",
-    "@semiont/sdk": "0.5.27",
+    "@semiont/core": "0.5.28",
+    "@semiont/http-transport": "0.5.28",
+    "@semiont/sdk": "0.5.28",
     "clsx": "^2.1.1",
     "pdfjs-dist": "^6.2.108",
     "react-error-boundary": "^6.1.2",

package/src/components/AssistProgress.tsx

@@ -57,6 +57,22 @@ export type AssistDataType =
 export interface AssistProgressProps {
   progress: JobProgress;
   dataType: AssistDataType;
+  /**
+   * What the finished run produced, offered as a link in the ended frame
+   * (GENERATE-FROM-RESOURCE D8). The label is the artifact's own name — user
+   * content, never translated. Rendered only once `ended`: mid-run there is no
+   * outcome to offer, whatever the caller has wired.
+   */
+  outcome?: { label: string; onOpen: () => void } | undefined;
+  /**
+   * The owner's terminal sentence, rendered in place of the payload message
+   * once `ended` (GENERATION-ARRIVAL P1). The producer's final frame is a
+   * fire-and-forget emit that can lose the race with `job:complete`, so an
+   * ended frame must not trust the last payload to describe the ending —
+   * the owner, which signalled `ended`, supplies the words too. Inert while
+   * the run is live.
+   */
+  endedMessage?: string;
   /**
    * The run has ENDED. The owner's fact, not the payload's
    * (ASSIST-PROGRESS-CONSOLIDATION D7): terminality is signalled on
@@ -96,6 +112,8 @@ export function AssistProgress({
   progress,
   dataType,
   ended,
+  outcome,
+  endedMessage,
   onCancel,
   onDismiss,
   translations: tr,
@@ -155,7 +173,9 @@ export function AssistProgress({
           {ended ? '✅' : '✨'}
         </span>
         <span data-testid="semiont-assist-status">
-          {progress.message ? tr.message(progress.message) : tr.inProgress}
+          {ended && endedMessage
+            ? endedMessage
+            : progress.message ? tr.message(progress.message) : tr.inProgress}
         </span>
       </div>
 
@@ -166,11 +186,25 @@ export function AssistProgress({
         </div>
       )}
 
+      {/* D8: the finished run's artifact, by name. */}
+      {ended && outcome && (
+        <button
+          type="button"
+          onClick={outcome.onOpen}
+          className="semiont-assist-progress__outcome"
+          data-testid="semiont-assist-outcome"
+        >
+          {outcome.label}
+        </button>
+      )}
+
+      {/* An ended run is 100% done by definition — the last payload's number
+          is a mid-run fact and must not survive the ending (A1). */}
       <div className="semiont-progress-bar" data-testid="semiont-assist-bar">
         <div
           className="semiont-progress-bar__fill"
           data-type={dataType}
-          style={{ width: `${progress.percentage}%` }}
+          style={{ width: `${ended ? 100 : progress.percentage}%` }}
         />
       </div>
 

package/src/components/CodeMirrorRenderer.tsx

@@ -37,7 +37,7 @@ interface Props {
   onTextSelect?: (exact: string, position: { start: number; end: number }) => void;
   onChange?: (content: string) => void;
   editable?: boolean;
-  newAnnotationIds?: Set<string>;
+  sparkleAnnotationIds?: Set<string>;
   hoveredAnnotationId?: string | null;
   scrollToAnnotationId?: string | null;
   sourceView?: boolean; // If true, show raw source (no markdown rendering)
@@ -52,7 +52,7 @@ interface Props {
 // Effect to update annotation decorations with segments and new IDs
 interface AnnotationUpdate {
   segments: TextSegment[];
-  newAnnotationIds?: Set<string>;
+  sparkleAnnotationIds?: Set<string>;
 }
 
 const updateAnnotationsEffect = StateEffect.define<AnnotationUpdate>();
@@ -70,10 +70,10 @@ const updateWidgetsEffect = StateEffect.define<WidgetUpdate>();
 // Build CodeMirror decorations from pure metadata
 function buildAnnotationDecorations(
   segments: TextSegment[],
-  newAnnotationIds?: Set<string>
+  sparkleAnnotationIds?: Set<string>
 ): DecorationSet {
   const builder = new RangeSetBuilder<Decoration>();
-  const entries = computeAnnotationDecorations(segments, newAnnotationIds);
+  const entries = computeAnnotationDecorations(segments, sparkleAnnotationIds);
 
   for (const { start, end, meta } of entries) {
     const decoration = Decoration.mark({
@@ -103,7 +103,7 @@ function createAnnotationDecorationsField() {
 
       for (const effect of tr.effects) {
         if (effect.is(updateAnnotationsEffect)) {
-          decorations = buildAnnotationDecorations(effect.value.segments, effect.value.newAnnotationIds);
+          decorations = buildAnnotationDecorations(effect.value.segments, effect.value.sparkleAnnotationIds);
         }
       }
 
@@ -175,7 +175,7 @@ export function CodeMirrorRenderer({
   segments = [],
   onChange,
   editable = false,
-  newAnnotationIds,
+  sparkleAnnotationIds,
   hoveredAnnotationId,
   scrollToAnnotationId,
   sourceView = false,
@@ -410,9 +410,9 @@ export function CodeMirrorRenderer({
     if (!viewRef.current) return;
 
     viewRef.current.dispatch({
-      effects: updateAnnotationsEffect.of({ segments: convertedSegments, ...(newAnnotationIds && { newAnnotationIds }) })
+      effects: updateAnnotationsEffect.of({ segments: convertedSegments, ...(sparkleAnnotationIds && { sparkleAnnotationIds }) })
     });
-  }, [convertedSegments, newAnnotationIds]);
+  }, [convertedSegments, sparkleAnnotationIds]);
 
   // Update widgets when content, segments, or generatingReferenceId changes
   useEffect(() => {

package/src/components/__tests__/AssistProgress.test.tsx

@@ -267,6 +267,26 @@ describe('AssistProgress — P3 consolidation', () => {
     expect(screen.getByTestId(STATUS).textContent).toContain('tr.code(detecting-entities)');
   });
 
+  it('the outcome link renders only in the ended frame (GENERATE-FROM-RESOURCE P2, D8)', async () => {
+    // The label is the resource's name — user content, deliberately NOT a
+    // translation. While the run is live there is no outcome to offer, even if
+    // a caller wires the prop early.
+    const onOpen = vi.fn();
+    const outcome = { label: 'Summary of PB', onOpen };
+    const { rerender } = render(
+      <AssistProgress ended={false} progress={detecting()} dataType="generation"
+        outcome={outcome} translations={T3()} />,
+    );
+    expect(screen.queryByText('Summary of PB')).toBeNull();
+
+    rerender(
+      <AssistProgress ended progress={detecting()} dataType="generation"
+        outcome={outcome} translations={T3()} />,
+    );
+    await userEvent.click(screen.getByRole('button', { name: 'Summary of PB' }));
+    expect(onOpen).toHaveBeenCalledTimes(1);
+  });
+
   it('H1: the params line appears only when it adds information', () => {
     // The discriminator is the COUNT, not the copy — splitting a localized
     // string on commas to decide whether to show it would be its own defect.
@@ -288,3 +308,42 @@ describe('AssistProgress — P3 consolidation', () => {
     expect(screen.getByTestId(PARAMS)).toBeInTheDocument();
   });
 });
+
+// ─────────────────────────────────────────────────────────────────────────────
+// GENERATION-ARRIVAL P1 — the honest ended frame. The producer's terminal
+// 100% frame races job:complete and can lose (its emit is a fire-and-forget
+// heartbeat); terminality is the OWNER's fact (D7), so the ended rendering
+// stops trusting the last payload: full bar, and the owner's terminal
+// sentence when it supplies one.
+// ─────────────────────────────────────────────────────────────────────────────
+describe('AssistProgress — the honest ended frame (GENERATION-ARRIVAL P1)', () => {
+  it('A1: an ended frame renders a FULL bar whatever the last payload said', () => {
+    const { container } = render(
+      <AssistProgress ended progress={detecting({ percentage: 95 })} dataType="generation" translations={T3()} />,
+    );
+    const fill = container.querySelector('.semiont-progress-bar__fill') as HTMLElement;
+    expect(fill.style.width).toBe('100%');
+  });
+
+  it('a live frame keeps the payload percentage', () => {
+    const { container } = render(
+      <AssistProgress ended={false} progress={detecting({ percentage: 95 })} dataType="generation" translations={T3()} />,
+    );
+    const fill = container.querySelector('.semiont-progress-bar__fill') as HTMLElement;
+    expect(fill.style.width).toBe('95%');
+  });
+
+  it('endedMessage replaces the stale payload copy once ended', () => {
+    render(
+      <AssistProgress ended endedMessage="tr.ended" progress={detecting({ percentage: 95 })} dataType="generation" translations={T3()} />,
+    );
+    expect(screen.getByTestId(STATUS).textContent).toBe('tr.ended');
+  });
+
+  it('endedMessage is inert while the run is live', () => {
+    render(
+      <AssistProgress ended={false} endedMessage="tr.ended" progress={detecting()} dataType="generation" translations={T3()} />,
+    );
+    expect(screen.getByTestId(STATUS).textContent).toBe('tr.code(detecting-entities)');
+  });
+});

package/src/components/modals/ComposeStep.tsx

@@ -0,0 +1,218 @@
+'use client';
+
+import React, { useState } from 'react';
+import { LOCALES } from '@semiont/core';
+import { CodeMirrorRenderer } from '../CodeMirrorRenderer';
+import { WizardFooter } from './WizardFooter';
+
+/**
+ * COMPOSE-IN-MODAL P1 — the compose strategy's form, as a pure step.
+ *
+ * The from-reference slice of the compose page, lifted: name, save location,
+ * entity types, language, editor. Deliberately none of the page's
+ * upload/format/encoding machinery (the modal composes text; uploads stay on
+ * the standalone page — plan non-goal). The draft is CONTROLLED by the host
+ * (WIZARD-NAVIGATION D3), and the evidence display is the host's job (A3).
+ */
+
+export interface ComposeDraft {
+  name: string;
+  /** Bare working-tree path; the file:// prefix is applied at submit. */
+  storagePath: string;
+  content: string;
+  /** Picked types — consulted only when the reference fixed none (D6). */
+  entityTypes: string[];
+  language: string;
+}
+
+export interface ComposeParams {
+  name: string;
+  /** Full file:// URI. */
+  storagePath: string;
+  content: string;
+  entityTypes: string[];
+  language: string;
+}
+
+export interface ComposeStepProps {
+  draft: ComposeDraft;
+  onDraftChange: (patch: Partial<ComposeDraft>) => void;
+  /** Entity types fixed when the reference was created — read-only tags when
+   *  non-empty (D6): they are not this step's to change. */
+  referenceEntityTypes: string[];
+  /** Picker vocabulary when the reference fixed none. Owner-supplied, so a
+   *  failed load cannot surface as an empty vocabulary. */
+  entityTypeOptions: string[];
+  showLineNumbers: boolean;
+  hoverDelayMs: number;
+  onBack: () => void;
+  /** Create-and-link. Async: the footer pends until it settles; rejection
+   *  re-enables it (the host surfaces the error — same posture as Link). */
+  onCompose: (params: ComposeParams) => Promise<void>;
+  translations: {
+    resourceTitle: string;
+    resourceTitlePlaceholder: string;
+    saveLocation: string;
+    entityTypes: string;
+    language: string;
+    contentLabel: string;
+    back: string;
+    createAndLink: string;
+    creatingAndLinking: string;
+  };
+}
+
+export function ComposeStep({
+  draft,
+  onDraftChange,
+  referenceEntityTypes,
+  entityTypeOptions,
+  showLineNumbers,
+  hoverDelayMs,
+  onBack,
+  onCompose,
+  translations: t,
+}: ComposeStepProps) {
+  const [isCreating, setIsCreating] = useState(false);
+  const fixedTypes = referenceEntityTypes.length > 0;
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    if (!draft.name.trim() || !draft.storagePath.trim()) return;
+    setIsCreating(true);
+    try {
+      await onCompose({
+        name: draft.name,
+        storagePath: `file://${draft.storagePath}`,
+        content: draft.content,
+        entityTypes: fixedTypes ? referenceEntityTypes : draft.entityTypes,
+        language: draft.language,
+      });
+    } catch {
+      // The rejection's job ends here: it kept the wizard's close from
+      // running and the host already surfaced the failure. Letting it
+      // escape a React event handler is an unhandled rejection.
+    } finally {
+      setIsCreating(false);
+    }
+  };
+
+  return (
+    <form onSubmit={handleSubmit} className="semiont-form">
+      {/* Name */}
+      <div className="semiont-form__field">
+        <label htmlFor="compose-name" className="semiont-form__label">
+          {t.resourceTitle}
+        </label>
+        <input
+          id="compose-name"
+          type="text"
+          value={draft.name}
+          onChange={(e) => onDraftChange({ name: e.target.value })}
+          placeholder={t.resourceTitlePlaceholder}
+          required
+          className="semiont-input"
+          disabled={isCreating}
+        />
+      </div>
+
+      {/* Storage URI */}
+      <div className="semiont-form__field">
+        <label htmlFor="compose-storagePath" className="semiont-form__label">
+          {t.saveLocation}
+        </label>
+        <div className="semiont-input-addon">
+          <span className="semiont-input-addon__prefix">file://</span>
+          <input
+            id="compose-storagePath"
+            type="text"
+            value={draft.storagePath}
+            onChange={(e) => onDraftChange({ storagePath: e.target.value })}
+            placeholder="people/my-resource.md"
+            required
+            className="semiont-input semiont-input--addon"
+            disabled={isCreating}
+          />
+        </div>
+      </div>
+
+      {/* Entity types: fixed at reference creation → tags; otherwise picker */}
+      <div className="semiont-form__field">
+        <div className="semiont-form__label">{t.entityTypes}</div>
+        {fixedTypes ? (
+          <div className="semiont-form__entity-type-tags" role="list">
+            {referenceEntityTypes.map((type) => (
+              <span key={type} role="listitem" className="semiont-form__entity-type-tag">
+                {type}
+              </span>
+            ))}
+          </div>
+        ) : (
+          <div className="semiont-form__entity-type-buttons" role="group">
+            {entityTypeOptions.map((type) => {
+              const isSelected = draft.entityTypes.includes(type);
+              return (
+                <button
+                  key={type}
+                  type="button"
+                  onClick={() => onDraftChange({
+                    entityTypes: isSelected
+                      ? draft.entityTypes.filter((x) => x !== type)
+                      : [...draft.entityTypes, type],
+                  })}
+                  className="semiont-form__entity-type-button"
+                  data-selected={isSelected}
+                  aria-pressed={isSelected}
+                  disabled={isCreating}
+                >
+                  {type}
+                </button>
+              );
+            })}
+          </div>
+        )}
+      </div>
+
+      {/* Language */}
+      <div className="semiont-form__field">
+        <label htmlFor="compose-language" className="semiont-form__label">
+          {t.language}
+        </label>
+        <select
+          id="compose-language"
+          value={draft.language}
+          onChange={(e) => onDraftChange({ language: e.target.value })}
+          disabled={isCreating}
+          className="semiont-select"
+        >
+          {LOCALES.map((lang) => (
+            <option key={lang.code} value={lang.code}>
+              {lang.nativeName}
+            </option>
+          ))}
+        </select>
+      </div>
+
+      {/* Content editor */}
+      <div className="semiont-form__field semiont-form__editor">
+        <label className="semiont-form__label">{t.contentLabel}</label>
+        <div className="semiont-form__editor-wrapper" lang={draft.language}>
+          <CodeMirrorRenderer
+            content={draft.content}
+            editable={!isCreating}
+            sourceView={true}
+            showLineNumbers={showLineNumbers}
+            hoverDelayMs={hoverDelayMs}
+            onChange={(content: string) => onDraftChange({ content })}
+          />
+        </div>
+      </div>
+
+      <WizardFooter
+        backLabel={t.back}
+        onBack={onBack}
+        primary={{ label: t.createAndLink, pendingLabel: t.creatingAndLinking, pending: isCreating, type: 'submit' }}
+      />
+    </form>
+  );
+}

package/src/components/modals/ConfigureGatherStep.tsx

@@ -1,6 +1,7 @@
 'use client';
 
 import React, { useState } from 'react';
+import { WizardFooter } from './WizardFooter';
 
 export interface ResourceGatherConfig {
   depth: number;
@@ -10,16 +11,13 @@ export interface ResourceGatherConfig {
 }
 
 export interface ConfigureGatherStepProps {
-  defaults?: Partial<ResourceGatherConfig>;
   onGather: (config: ResourceGatherConfig) => void;
-  onCancel: () => void;
   translations: {
     intro: string;
     includeContent: string;
     includeSummary: string;
     depth: string;
     maxResources: string;
-    cancel: string;
     gather: string;
   };
   /** Slot for the exclusion multi-select (GENERATE-FROM-BUTTON Phase 4). */
@@ -29,13 +27,14 @@ export interface ConfigureGatherStepProps {
 /**
  * First step of the resource-generate flow: pick the gather options before
  * `gather.resource` runs. The `children` slot hosts the entity-type exclusion
- * multi-select (Phase 4).
+ * multi-select (Phase 4). Dismissal is the modal's corner ✕/Esc/backdrop
+ * (WIZARD-NAVIGATION D1), so the footer carries the advance alone.
  */
-export function ConfigureGatherStep({ defaults, onGather, onCancel, translations: t, children }: ConfigureGatherStepProps) {
-  const [includeContent, setIncludeContent] = useState(defaults?.includeContent ?? true);
-  const [includeSummary, setIncludeSummary] = useState(defaults?.includeSummary ?? true);
-  const [depth, setDepth] = useState(defaults?.depth ?? 2);
-  const [maxResources, setMaxResources] = useState(defaults?.maxResources ?? 10);
+export function ConfigureGatherStep({ onGather, translations: t, children }: ConfigureGatherStepProps) {
+  const [includeContent, setIncludeContent] = useState(true);
+  const [includeSummary, setIncludeSummary] = useState(true);
+  const [depth, setDepth] = useState(2);
+  const [maxResources, setMaxResources] = useState(10);
 
   const handleSubmit = (e: React.FormEvent) => {
     e.preventDefault();
@@ -43,7 +42,7 @@ export function ConfigureGatherStep({ defaults, onGather, onCancel, translations
   };
 
   return (
-    <form onSubmit={handleSubmit} className="semiont-form semiont-form--scrollable">
+    <form onSubmit={handleSubmit} className="semiont-form">
       <p className="semiont-form__helper-text">{t.intro}</p>
 
       <div className="semiont-form__checkbox-field">
@@ -89,14 +88,7 @@ export function ConfigureGatherStep({ defaults, onGather, onCancel, translations
       {/* Exclusion multi-select slot (Phase 4) */}
       {children}
 
-      <div className="semiont-modal__actions" style={{ paddingTop: '0.5rem' }}>
-        <button type="button" onClick={onCancel} className="semiont-button--secondary semiont-button--flex">
-          ✕ {t.cancel}
-        </button>
-        <button type="submit" className="semiont-button--primary semiont-button--flex">
-          ✨ {t.gather}
-        </button>
-      </div>
+      <WizardFooter primary={{ label: t.gather, type: 'submit' }} />
     </form>
   );
 }