@byline/ui 1.10.1 → 1.10.2

package/dist/forms/form-renderer.js

@@ -107,16 +107,19 @@ const FormStatusDisplay = ({ initialData, workflowStatuses, publishedVersion, on
 function computeStatusTransitions(currentStatus, workflowStatuses, nextStatus) {
     if (!workflowStatuses || 0 === workflowStatuses.length || !currentStatus) return {
         primaryStatus: nextStatus,
-        secondaryStatuses: []
+        secondaryStatuses: [],
+        isTerminal: false
     };
     if (workflowStatuses.length <= 1) return {
         primaryStatus: void 0,
-        secondaryStatuses: []
+        secondaryStatuses: [],
+        isTerminal: false
     };
     const currentIndex = workflowStatuses.findIndex((s)=>s.name === currentStatus);
     if (-1 === currentIndex) return {
         primaryStatus: nextStatus,
-        secondaryStatuses: []
+        secondaryStatuses: [],
+        isTerminal: false
     };
     const isAtEnd = currentIndex === workflowStatuses.length - 1;
     const isAtStart = 0 === currentIndex;
@@ -124,19 +127,15 @@ function computeStatusTransitions(currentStatus, workflowStatuses, nextStatus) {
     if (!isAtStart && workflowStatuses[0]) availableTargets.push(workflowStatuses[0]);
     if (currentIndex > 1 && workflowStatuses[currentIndex - 1]) availableTargets.push(workflowStatuses[currentIndex - 1]);
     if (!isAtEnd && workflowStatuses[currentIndex + 1]) availableTargets.push(workflowStatuses[currentIndex + 1]);
-    let primaryStatus;
-    let secondaryStatuses;
-    if (isAtEnd) {
-        const prevStatus = workflowStatuses[currentIndex - 1];
-        primaryStatus = prevStatus;
-        secondaryStatuses = availableTargets.filter((s)=>s.name !== prevStatus?.name);
-    } else {
-        primaryStatus = nextStatus;
-        secondaryStatuses = availableTargets.filter((s)=>s.name !== nextStatus?.name);
-    }
+    if (isAtEnd) return {
+        primaryStatus: workflowStatuses[currentIndex],
+        secondaryStatuses: availableTargets,
+        isTerminal: true
+    };
     return {
-        primaryStatus,
-        secondaryStatuses
+        primaryStatus: nextStatus,
+        secondaryStatuses: availableTargets.filter((s)=>s.name !== nextStatus?.name),
+        isTerminal: false
     };
 }
 const FormContent = ({ mode, fields, onSubmit, onCancel, onStatusChange, onUnpublish, onDelete, onDuplicate, onCopyToLocale, contentLocales, nextStatus, workflowStatuses, publishedVersion, initialData, adminConfig, useAsTitle, useAsPath, headingLabel, headerSlot, collectionPath, initialLocale, onLocaleChange, defaultLocale = 'en', useNavigationGuard: useNavigationGuardProp, restoreWarnings, _activeTabBySet, _onTabChange })=>{
@@ -245,7 +244,7 @@ const FormContent = ({ mode, fields, onSubmit, onCancel, onStatusChange, onUnpub
     const useGuard = useNavigationGuardProp ?? guardFromContext;
     const guard = useGuard(hasChanges);
     const currentStatus = initialData?.status;
-    const { primaryStatus, secondaryStatuses } = computeStatusTransitions(currentStatus, workflowStatuses, nextStatus);
+    const { primaryStatus, secondaryStatuses, isTerminal } = computeStatusTransitions(currentStatus, workflowStatuses, nextStatus);
     useEffect(()=>subscribeErrors((newErrors)=>setErrors(newErrors)), [
         subscribeErrors
     ]);
@@ -415,13 +414,13 @@ const FormContent = ({ mode, fields, onSubmit, onCancel, onStatusChange, onUnpub
                                     buttonClassName: classnames('byline-form-actions-combo-button', form_renderer_module["actions-combo-button"]),
                                     triggerClassName: classnames('byline-form-actions-combo-trigger', form_renderer_module["actions-combo-trigger"]),
                                     options: secondaryStatuses.map((s)=>({
-                                            label: s.verb ?? s.label ?? s.name,
+                                            label: isTerminal ? `Revert to ${s.label ?? s.name}` : s.verb ?? s.label ?? s.name,
                                             value: s.name
                                         })),
                                     sideOffset: 5,
                                     size: "sm",
                                     type: "button",
-                                    intent: "success",
+                                    intent: isTerminal ? 'info' : 'success',
                                     disabled: statusBusy,
                                     onOptionSelect: async (value)=>{
                                         setStatusBusy(true);
@@ -431,7 +430,7 @@ const FormContent = ({ mode, fields, onSubmit, onCancel, onStatusChange, onUnpub
                                             setStatusBusy(false);
                                         }
                                     },
-                                    onButtonClick: async ()=>{
+                                    onButtonClick: isTerminal ? void 0 : async ()=>{
                                         setStatusBusy(true);
                                         try {
                                             await onStatusChange(primaryStatus.name);
@@ -439,7 +438,7 @@ const FormContent = ({ mode, fields, onSubmit, onCancel, onStatusChange, onUnpub
                                             setStatusBusy(false);
                                         }
                                     },
-                                    children: statusBusy ? '...' : primaryStatus.verb ?? primaryStatus.label ?? primaryStatus.name
+                                    children: statusBusy ? '...' : isTerminal ? primaryStatus.label ?? primaryStatus.name : primaryStatus.verb ?? primaryStatus.label ?? primaryStatus.name
                                 })
                             }),
                             /*#__PURE__*/ jsx(DocumentActions, {

package/package.json

@@ -3,7 +3,7 @@
   "private": false,
   "type": "module",
   "license": "MPL-2.0",
-  "version": "1.10.1",
+  "version": "1.10.2",
   "engines": {
     "node": ">=20.9.0"
   },
@@ -50,48 +50,48 @@
     }
   },
   "dependencies": {
-    "@base-ui/react": "^1.4.0",
+    "@base-ui/react": "^1.4.1",
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/modifiers": "^9.0.0",
     "@dnd-kit/sortable": "^10.0.0",
     "@dnd-kit/utilities": "^3.2.2",
-    "@tanstack/react-form-start": "^1.29.1",
+    "@tanstack/react-form-start": "^1.32.0",
     "classnames": "^2.5.1",
     "date-fns": "^4.1.0",
     "lodash-es": "^4.18.1",
     "motion": "^12.38.0",
     "npm-run-all": "^4.1.5",
-    "react-day-picker": "^9.14.0",
+    "react-day-picker": "^10.0.0",
     "react-diff-viewer-continued": "^4.2.2",
-    "zod": "^4.4.2",
+    "zod": "^4.4.3",
     "zod-form-data": "^3.0.1",
-    "@byline/client": "1.10.1",
-    "@byline/core": "1.10.1",
-    "@byline/admin": "1.10.1"
+    "@byline/admin": "1.10.2",
+    "@byline/client": "1.10.2",
+    "@byline/core": "1.10.2"
   },
   "peerDependencies": {
     "react": "^19.0.0",
     "react-dom": "^19.0.0"
   },
   "devDependencies": {
-    "@biomejs/biome": "2.4.14",
+    "@biomejs/biome": "2.4.15",
     "@rsbuild/plugin-react": "^2.0.0",
-    "@rslib/core": "^0.21.3",
+    "@rslib/core": "^0.21.4",
     "@types/lodash": "^4.17.24",
     "@types/lodash-es": "^4.17.12",
-    "@types/node": "^25.6.0",
+    "@types/node": "^25.6.2",
     "@types/react": "19.2.14",
     "@types/react-dom": "19.2.3",
     "@vitejs/plugin-react": "^6.0.1",
     "chokidar": "^5.0.0",
     "lightningcss": "^1.32.0",
     "lightningcss-cli": "^1.32.0",
-    "react": "19.2.5",
-    "react-dom": "19.2.5",
+    "react": "^19.2.6",
+    "react-dom": "^19.2.6",
     "rimraf": "^6.1.3",
     "typescript": "6.0.3",
     "typescript-plugin-css-modules": "^5.2.0",
-    "vite": "^8.0.10",
+    "vite": "^8.0.12",
     "vitest": "^4.1.5"
   },
   "publishConfig": {

package/src/forms/form-renderer.tsx

@@ -202,8 +202,12 @@ const FormStatusDisplay = ({
 
 /**
  * Compute the primary and secondary status transitions for the ComboButton.
- * - Primary: the main action (forward step, or back step if at the end)
- * - Secondary: other available transitions to show as dropdown options
+ * - Primary: the main action (forward step), or the current status itself
+ *   when the document has reached the final workflow step (terminal state).
+ * - Secondary: other available transitions to show as dropdown options.
+ * - isTerminal: true when the document is at the final workflow status —
+ *   the primary button renders as a non-actionable indicator and all
+ *   back-steps move into the dropdown.
  */
 function computeStatusTransitions(
   currentStatus: string | undefined,
@@ -212,20 +216,21 @@ function computeStatusTransitions(
 ): {
   primaryStatus: WorkflowStatus | undefined
   secondaryStatuses: WorkflowStatus[]
+  isTerminal: boolean
 } {
   if (!workflowStatuses || workflowStatuses.length === 0 || !currentStatus) {
-    return { primaryStatus: nextStatus, secondaryStatuses: [] }
+    return { primaryStatus: nextStatus, secondaryStatuses: [], isTerminal: false }
   }
 
   // Single-status workflows (e.g. SINGLE_STATUS_WORKFLOW for lookups) have
   // no transitions — short-circuit so the form shows only Close / Save.
   if (workflowStatuses.length <= 1) {
-    return { primaryStatus: undefined, secondaryStatuses: [] }
+    return { primaryStatus: undefined, secondaryStatuses: [], isTerminal: false }
   }
 
   const currentIndex = workflowStatuses.findIndex((s) => s.name === currentStatus)
   if (currentIndex === -1) {
-    return { primaryStatus: nextStatus, secondaryStatuses: [] }
+    return { primaryStatus: nextStatus, secondaryStatuses: [], isTerminal: false }
   }
 
   const isAtEnd = currentIndex === workflowStatuses.length - 1
@@ -249,22 +254,23 @@ function computeStatusTransitions(
     availableTargets.push(workflowStatuses[currentIndex + 1])
   }
 
-  // Determine primary and secondary
-  let primaryStatus: WorkflowStatus | undefined
-  let secondaryStatuses: WorkflowStatus[]
-
   if (isAtEnd) {
-    // At the last status: primary is the back step (previous status)
-    const prevStatus = workflowStatuses[currentIndex - 1]
-    primaryStatus = prevStatus
-    secondaryStatuses = availableTargets.filter((s) => s.name !== prevStatus?.name)
-  } else {
-    // Not at end: primary is the forward step (nextStatus)
-    primaryStatus = nextStatus
-    secondaryStatuses = availableTargets.filter((s) => s.name !== nextStatus?.name)
+    // Terminal state: the primary button is a non-actionable indicator of the
+    // current status; both back-steps (revert to previous / reset to first)
+    // are surfaced in the dropdown.
+    return {
+      primaryStatus: workflowStatuses[currentIndex],
+      secondaryStatuses: availableTargets,
+      isTerminal: true,
+    }
   }
 
-  return { primaryStatus, secondaryStatuses }
+  // Not at end: primary is the forward step (nextStatus)
+  return {
+    primaryStatus: nextStatus,
+    secondaryStatuses: availableTargets.filter((s) => s.name !== nextStatus?.name),
+    isTerminal: false,
+  }
 }
 
 const FormContent = ({
@@ -461,7 +467,7 @@ const FormContent = ({
 
   // Compute available status transitions
   const currentStatus = initialData?.status
-  const { primaryStatus, secondaryStatuses } = computeStatusTransitions(
+  const { primaryStatus, secondaryStatuses, isTerminal } = computeStatusTransitions(
     currentStatus,
     workflowStatuses,
     nextStatus
@@ -673,13 +679,15 @@ const FormContent = ({
                   styles['actions-combo-trigger']
                 )}
                 options={secondaryStatuses.map((s) => ({
-                  label: s.verb ?? s.label ?? s.name,
+                  label: isTerminal
+                    ? `Revert to ${s.label ?? s.name}`
+                    : (s.verb ?? s.label ?? s.name),
                   value: s.name,
                 }))}
                 sideOffset={5}
                 size="sm"
                 type="button"
-                intent="success"
+                intent={isTerminal ? 'info' : 'success'}
                 disabled={statusBusy}
                 onOptionSelect={async (value: string) => {
                   setStatusBusy(true)
@@ -689,18 +697,24 @@ const FormContent = ({
                     setStatusBusy(false)
                   }
                 }}
-                onButtonClick={async () => {
-                  setStatusBusy(true)
-                  try {
-                    await onStatusChange(primaryStatus.name)
-                  } finally {
-                    setStatusBusy(false)
-                  }
-                }}
+                onButtonClick={
+                  isTerminal
+                    ? undefined
+                    : async () => {
+                        setStatusBusy(true)
+                        try {
+                          await onStatusChange(primaryStatus.name)
+                        } finally {
+                          setStatusBusy(false)
+                        }
+                      }
+                }
               >
                 {statusBusy
                   ? '...'
-                  : (primaryStatus.verb ?? primaryStatus.label ?? primaryStatus.name)}
+                  : isTerminal
+                    ? (primaryStatus.label ?? primaryStatus.name)
+                    : (primaryStatus.verb ?? primaryStatus.label ?? primaryStatus.name)}
               </ComboButton>
             </div>
           )}