@byline/admin 3.0.1 → 3.1.0

package/dist/fields/array/array-field.d.ts

@@ -6,9 +6,15 @@
  * Copyright (c) Infonomic Company Limited
  */
 import type { ArrayField as ArrayFieldType } from '@byline/core';
-export declare const ArrayField: ({ field, defaultValue, path, disableSorting, }: {
+export declare const ArrayField: ({ field, defaultValue, path, disableSorting, contentLocale, }: {
     field: ArrayFieldType;
     defaultValue: any;
     path: string;
     disableSorting?: boolean;
+    /**
+     * Active content locale, forwarded to each array item's fields so
+     * localized widgets nested inside an array (e.g. a `localized` richText)
+     * can render their locale badge.
+     */
+    contentLocale?: string;
 }) => import("react").JSX.Element;

package/dist/fields/array/array-field.js

@@ -8,7 +8,7 @@ import { FieldRenderer } from "../field-renderer.js";
 import { SortableItem } from "../sortable-item.js";
 import { useFormContext } from "../../forms/form-context.js";
 import array_field_module from "./array-field.module.js";
-const ArrayField = ({ field, defaultValue, path, disableSorting = false })=>{
+const ArrayField = ({ field, defaultValue, path, disableSorting = false, contentLocale })=>{
     const { appendPatch, getFieldValue, getFieldValues, setFieldStore } = useFormContext();
     const { t } = useTranslation('byline-admin');
     const [items, setItems] = useState([]);
@@ -113,7 +113,8 @@ const ArrayField = ({ field, defaultValue, path, disableSorting = false })=>{
                                 field: innerField,
                                 defaultValue: groupData[innerField.name],
                                 basePath: `${arrayElementPath}.${childField.name}`,
-                                disableSorting: true
+                                disableSorting: true,
+                                contentLocale: contentLocale
                             }, innerField.name))
                     ]
                 }, childField.name);
@@ -122,7 +123,8 @@ const ArrayField = ({ field, defaultValue, path, disableSorting = false })=>{
                 field: childField,
                 defaultValue: initial,
                 basePath: arrayElementPath,
-                disableSorting: true
+                disableSorting: true,
+                contentLocale: contentLocale
             }, childField.name);
         });
         const label = field.label ?? field.name;

package/dist/fields/blocks/blocks-field.d.ts

@@ -6,8 +6,14 @@
  * Copyright (c) Infonomic Company Limited
  */
 import type { BlocksField as BlocksFieldType } from '@byline/core';
-export declare const BlocksField: ({ field, defaultValue, path, }: {
+export declare const BlocksField: ({ field, defaultValue, path, contentLocale, }: {
     field: BlocksFieldType;
     defaultValue: any;
     path: string;
+    /**
+     * Active content locale, forwarded to each block item's fields so
+     * localized widgets nested inside a block (e.g. a `localized` richText)
+     * can render their locale badge.
+     */
+    contentLocale?: string;
 }) => import("react").JSX.Element;

package/dist/fields/blocks/blocks-field.js

@@ -8,7 +8,7 @@ import { GroupField } from "../group/group-field.js";
 import { SortableItem } from "../sortable-item.js";
 import { useFormContext } from "../../forms/form-context.js";
 import blocks_field_module from "./blocks-field.module.js";
-const BlocksField = ({ field, defaultValue, path })=>{
+const BlocksField = ({ field, defaultValue, path, contentLocale })=>{
     const { appendPatch, getFieldValue, getFieldValues, setFieldStore } = useFormContext();
     const { t } = useTranslation('byline-admin');
     const [items, setItems] = useState([]);
@@ -125,7 +125,8 @@ const BlocksField = ({ field, defaultValue, path })=>{
                 label: void 0
             },
             defaultValue: fieldData,
-            path: arrayElementPath
+            path: arrayElementPath,
+            contentLocale: contentLocale
         }, subField.blockType);
         return /*#__PURE__*/ jsx(SortableItem, {
             id: itemWrapper.id,

package/dist/fields/field-renderer.js

@@ -169,14 +169,16 @@ const FieldRenderer = ({ field, defaultValue, basePath, disableSorting, hideLabe
                         label: void 0
                     } : field,
                     defaultValue: defaultValue,
-                    path: path
+                    path: path,
+                    contentLocale: contentLocale
                 });
             case 'blocks':
                 if (!field.blocks) return null;
                 return /*#__PURE__*/ jsx(BlocksField, {
                     field: field,
                     defaultValue: defaultValue,
-                    path: path
+                    path: path,
+                    contentLocale: contentLocale
                 });
             case 'array':
                 if (!field.fields) return null;
@@ -184,7 +186,8 @@ const FieldRenderer = ({ field, defaultValue, basePath, disableSorting, hideLabe
                     field: field,
                     defaultValue: defaultValue,
                     path: path,
-                    disableSorting: disableSorting
+                    disableSorting: disableSorting,
+                    contentLocale: contentLocale
                 });
             default:
                 return null;

package/dist/fields/group/group-field.d.ts

@@ -10,6 +10,12 @@ interface GroupFieldProps {
     field: GroupFieldType;
     defaultValue: any;
     path: string;
+    /**
+     * Active content locale, forwarded to child fields so localized widgets
+     * nested inside the group (e.g. a `localized` richText) can render their
+     * locale badge.
+     */
+    contentLocale?: string;
 }
-export declare const GroupField: ({ field, defaultValue, path }: GroupFieldProps) => import("react").JSX.Element;
+export declare const GroupField: ({ field, defaultValue, path, contentLocale }: GroupFieldProps) => import("react").JSX.Element;
 export {};

package/dist/fields/group/group-field.js

@@ -6,7 +6,7 @@ import { placeholderForField } from "../field-helpers.js";
 import { FieldRenderer } from "../field-renderer.js";
 import { useFieldError } from "../../forms/form-context.js";
 import group_field_module from "./group-field.module.js";
-const GroupField = ({ field, defaultValue, path })=>{
+const GroupField = ({ field, defaultValue, path, contentLocale })=>{
     const fieldError = useFieldError(field.name);
     const groupData = useMemo(()=>{
         if (defaultValue && 'object' == typeof defaultValue && !Array.isArray(defaultValue)) return defaultValue;
@@ -46,7 +46,8 @@ const GroupField = ({ field, defaultValue, path })=>{
                         field: innerField,
                         defaultValue: groupData[innerField.name],
                         basePath: path,
-                        disableSorting: true
+                        disableSorting: true,
+                        contentLocale: contentLocale
                     }, innerField.name))
             }),
             fieldError && /*#__PURE__*/ jsx(ErrorText, {

package/dist/forms/document-actions.d.ts

@@ -8,7 +8,7 @@ export interface DocumentActionsLocaleOption {
     code: string;
     label: string;
 }
-export declare function DocumentActions({ publishedVersion, onUnpublish, onDelete, onDuplicate, sourceTitle, onCopyToLocale, sourceLocale, contentLocales, }: {
+export declare function DocumentActions({ publishedVersion, onUnpublish, onDelete, onDuplicate, sourceTitle, onCopyToLocale, sourceLocale, contentLocales, hasUnsavedChanges, onUnsavedChanges, onDeleteLocale, defaultLocale, availableLocales, }: {
     publishedVersion?: PublishedVersionInfo | null;
     onUnpublish?: () => Promise<void>;
     onDelete?: () => Promise<void>;
@@ -45,4 +45,37 @@ export declare function DocumentActions({ publishedVersion, onUnpublish, onDelet
      * Copy-to-Locale Select lists every locale except `sourceLocale`.
      */
     contentLocales?: ReadonlyArray<DocumentActionsLocaleOption>;
+    /**
+     * Whether the form currently has unsaved changes. Duplicate and
+     * Copy-to-Locale operate on the *saved* version, so when this is true
+     * the action is blocked and `onUnsavedChanges` fires instead of opening
+     * the action's modal. Delete is intentionally not gated.
+     */
+    hasUnsavedChanges?: boolean;
+    /**
+     * Called when a save-gated action (duplicate / copy-to-locale /
+     * delete-locale) is triggered while `hasUnsavedChanges` is true. The parent
+     * surfaces a "save first" prompt.
+     */
+    onUnsavedChanges?: () => void;
+    /**
+     * Called when the editor confirms the Delete-Locale modal. The parent runs
+     * the server fn, surfaces a toast, and navigates to a surviving locale.
+     * Menu item is hidden when omitted, or when the document has no non-default
+     * locale to delete.
+     */
+    onDeleteLocale?: (args: {
+        targetLocale: string;
+    }) => Promise<void>;
+    /**
+     * The default content locale (the document's anchor). Excluded from the
+     * Delete-Locale list — it can never be removed.
+     */
+    defaultLocale?: string;
+    /**
+     * The locales the document currently has content in (the derived
+     * `_availableVersionLocales` ledger). The Delete-Locale list is this set
+     * minus the default locale and the `'all'` sentinel.
+     */
+    availableLocales?: string[];
 }): import("react").JSX.Element;

package/dist/forms/document-actions.js

@@ -6,7 +6,7 @@ import { Button, Checkbox, CloseIcon, DeleteIcon, Dropdown, EllipsisIcon, IconBu
 import classnames from "classnames";
 import document_actions_module from "./document-actions.module.js";
 const DUPLICATE_TITLE_SUFFIX = ' (copy)';
-function DocumentActions({ publishedVersion, onUnpublish, onDelete, onDuplicate, sourceTitle, onCopyToLocale, sourceLocale, contentLocales }) {
+function DocumentActions({ publishedVersion, onUnpublish, onDelete, onDuplicate, sourceTitle, onCopyToLocale, sourceLocale, contentLocales, hasUnsavedChanges, onUnsavedChanges, onDeleteLocale, defaultLocale, availableLocales }) {
     const { t } = useTranslation('byline-admin');
     const [showDeleteConfirm, setShowDeleteConfirm] = useState(false);
     const [showDuplicateConfirm, setShowDuplicateConfirm] = useState(false);
@@ -17,6 +17,14 @@ function DocumentActions({ publishedVersion, onUnpublish, onDelete, onDuplicate,
     const [copyToLocaleBusy, setCopyToLocaleBusy] = useState(false);
     const [copyTargetLocale, setCopyTargetLocale] = useState(availableTargetLocales[0]?.code ?? '');
     const [copyOverwrite, setCopyOverwrite] = useState(false);
+    const deletableLocales = (availableLocales ?? []).filter((code)=>code !== defaultLocale && 'all' !== code).map((code)=>({
+            code,
+            label: contentLocales?.find((loc)=>loc.code === code)?.label ?? code
+        }));
+    const deleteLocaleAvailable = null != onDeleteLocale && deletableLocales.length > 0;
+    const [showDeleteLocaleConfirm, setShowDeleteLocaleConfirm] = useState(false);
+    const [deleteLocaleBusy, setDeleteLocaleBusy] = useState(false);
+    const [deleteTargetLocale, setDeleteTargetLocale] = useState('');
     const handleOnDelete = ()=>{
         setShowDeleteConfirm(false);
         if (onDelete) onDelete();
@@ -31,7 +39,12 @@ function DocumentActions({ publishedVersion, onUnpublish, onDelete, onDuplicate,
             setDuplicateBusy(false);
         }
     };
+    const handleOpenDuplicate = ()=>{
+        if (hasUnsavedChanges) return void onUnsavedChanges?.();
+        setShowDuplicateConfirm(true);
+    };
     const handleOpenCopyToLocale = ()=>{
+        if (hasUnsavedChanges) return void onUnsavedChanges?.();
         setCopyTargetLocale(availableTargetLocales[0]?.code ?? '');
         setCopyOverwrite(false);
         setShowCopyToLocaleConfirm(true);
@@ -49,6 +62,24 @@ function DocumentActions({ publishedVersion, onUnpublish, onDelete, onDuplicate,
             setCopyToLocaleBusy(false);
         }
     };
+    const handleOpenDeleteLocale = ()=>{
+        if (hasUnsavedChanges) return void onUnsavedChanges?.();
+        const preferred = deletableLocales.find((loc)=>loc.code === sourceLocale)?.code;
+        setDeleteTargetLocale(preferred ?? deletableLocales[0]?.code ?? '');
+        setShowDeleteLocaleConfirm(true);
+    };
+    const handleOnDeleteLocale = async ()=>{
+        if (!onDeleteLocale || !deleteTargetLocale) return;
+        setDeleteLocaleBusy(true);
+        try {
+            await onDeleteLocale({
+                targetLocale: deleteTargetLocale
+            });
+            setShowDeleteLocaleConfirm(false);
+        } finally{
+            setDeleteLocaleBusy(false);
+        }
+    };
     const duplicatePreviewBefore = sourceTitle ?? '';
     const duplicatePreviewAfter = (sourceTitle ?? '') + DUPLICATE_TITLE_SUFFIX;
     const sourceLocaleLabel = contentLocales?.find((loc)=>loc.code === sourceLocale)?.label ?? sourceLocale ?? '';
@@ -88,10 +119,21 @@ function DocumentActions({ publishedVersion, onUnpublish, onDelete, onDuplicate,
                                         })
                                     })
                                 }),
+                                deleteLocaleAvailable && /*#__PURE__*/ jsx(Dropdown.Item, {
+                                    onClick: handleOpenDeleteLocale,
+                                    children: /*#__PURE__*/ jsx("div", {
+                                        className: classnames('byline-form-actions-item', document_actions_module.item),
+                                        children: /*#__PURE__*/ jsx("span", {
+                                            className: classnames('byline-form-actions-item-text', document_actions_module["item-text"]),
+                                            children: /*#__PURE__*/ jsx("button", {
+                                                type: "button",
+                                                children: t('documentActions.deleteLocale.menuItem')
+                                            })
+                                        })
+                                    })
+                                }),
                                 onDuplicate && /*#__PURE__*/ jsx(Dropdown.Item, {
-                                    onClick: ()=>{
-                                        setShowDuplicateConfirm(true);
-                                    },
+                                    onClick: handleOpenDuplicate,
                                     children: /*#__PURE__*/ jsx("div", {
                                         className: classnames('byline-form-actions-item', document_actions_module.item),
                                         children: /*#__PURE__*/ jsx("span", {
@@ -468,6 +510,116 @@ function DocumentActions({ publishedVersion, onUnpublish, onDelete, onDuplicate,
                         })
                     ]
                 })
+            }),
+            /*#__PURE__*/ jsx(Modal, {
+                isOpen: showDeleteLocaleConfirm,
+                closeOnOverlayClick: !deleteLocaleBusy,
+                onDismiss: ()=>{
+                    if (!deleteLocaleBusy) setShowDeleteLocaleConfirm(false);
+                },
+                children: /*#__PURE__*/ jsxs(Modal.Container, {
+                    style: {
+                        maxWidth: '560px'
+                    },
+                    children: [
+                        /*#__PURE__*/ jsxs(Modal.Header, {
+                            className: classnames('byline-form-actions-modal-head', document_actions_module["modal-head"]),
+                            children: [
+                                /*#__PURE__*/ jsx("h3", {
+                                    className: classnames('byline-form-actions-modal-title', document_actions_module["modal-title"]),
+                                    children: t('documentActions.deleteLocale.title')
+                                }),
+                                /*#__PURE__*/ jsx(IconButton, {
+                                    "arial-label": t('common.actions.close'),
+                                    size: "xs",
+                                    onClick: ()=>{
+                                        if (!deleteLocaleBusy) setShowDeleteLocaleConfirm(false);
+                                    },
+                                    children: /*#__PURE__*/ jsx(CloseIcon, {
+                                        width: "16px",
+                                        height: "16px",
+                                        svgClassName: "white-icon"
+                                    })
+                                })
+                            ]
+                        }),
+                        /*#__PURE__*/ jsxs(Modal.Content, {
+                            children: [
+                                /*#__PURE__*/ jsx("p", {
+                                    children: t('documentActions.deleteLocale.intro')
+                                }),
+                                /*#__PURE__*/ jsxs("div", {
+                                    className: classnames('byline-form-actions-copy-row', document_actions_module["copy-row"]),
+                                    style: {
+                                        marginTop: 'var(--spacing-12)'
+                                    },
+                                    children: [
+                                        /*#__PURE__*/ jsx("span", {
+                                            className: classnames('byline-form-actions-copy-label', document_actions_module["copy-label"]),
+                                            style: {
+                                                fontWeight: 500,
+                                                marginRight: 'var(--spacing-8)'
+                                            },
+                                            children: t('documentActions.deleteLocale.localeLabel')
+                                        }),
+                                        /*#__PURE__*/ jsx(Select, {
+                                            size: "sm",
+                                            ariaLabel: t('documentActions.deleteLocale.targetAriaLabel'),
+                                            value: deleteTargetLocale,
+                                            items: deletableLocales.map((loc)=>({
+                                                    value: loc.code,
+                                                    label: loc.label
+                                                })),
+                                            onValueChange: (value)=>{
+                                                if (null != value) setDeleteTargetLocale(value);
+                                            },
+                                            disabled: deleteLocaleBusy
+                                        })
+                                    ]
+                                }),
+                                /*#__PURE__*/ jsx("p", {
+                                    style: {
+                                        marginTop: 'var(--spacing-12)'
+                                    },
+                                    children: t('documentActions.deleteLocale.warning')
+                                })
+                            ]
+                        }),
+                        /*#__PURE__*/ jsxs(Modal.Actions, {
+                            children: [
+                                /*#__PURE__*/ jsx("button", {
+                                    "data-autofocus": true,
+                                    type: "button",
+                                    tabIndex: 0,
+                                    className: classnames('byline-form-actions-sr-only', document_actions_module["sr-only"]),
+                                    children: "no action"
+                                }),
+                                /*#__PURE__*/ jsx(Button, {
+                                    size: "sm",
+                                    style: {
+                                        minWidth: '80px'
+                                    },
+                                    intent: "noeffect",
+                                    onClick: ()=>{
+                                        if (!deleteLocaleBusy) setShowDeleteLocaleConfirm(false);
+                                    },
+                                    disabled: deleteLocaleBusy,
+                                    children: t('common.actions.cancel')
+                                }),
+                                /*#__PURE__*/ jsx(Button, {
+                                    size: "sm",
+                                    style: {
+                                        minWidth: '80px'
+                                    },
+                                    intent: "danger",
+                                    onClick: handleOnDeleteLocale,
+                                    disabled: deleteLocaleBusy || !deleteTargetLocale,
+                                    children: deleteLocaleBusy ? t('documentActions.deleteLocale.busyButton') : t('documentActions.deleteLocale.confirmButton')
+                                })
+                            ]
+                        })
+                    ]
+                })
             })
         ]
     });

package/dist/forms/form-renderer.d.ts

@@ -44,6 +44,16 @@ export interface FormRendererProps {
         targetLocale: string;
         overwrite: boolean;
     }) => Promise<void>;
+    /**
+     * Called when the editor confirms the Delete-Locale modal in
+     * `DocumentActions`. Edit views provide a handler that invokes the
+     * `deleteDocumentLocale` server fn and navigates to a surviving locale.
+     * When omitted (or when the document has no non-default locale with
+     * content), the Delete-Locale menu item is hidden.
+     */
+    onDeleteLocale?: (args: {
+        targetLocale: string;
+    }) => Promise<void>;
     /**
      * All configured content locales (code + display label) — required for
      * the Copy-to-Locale modal's target Select. Threaded as an opaque list
@@ -102,4 +112,4 @@ export interface FormRendererProps {
      */
     useNavigationGuard?: UseNavigationGuard;
 }
-export declare const FormRenderer: ({ mode, fields, onSubmit, onCancel, onStatusChange, onUnpublish, onDelete, onDuplicate, onCopyToLocale, contentLocales, nextStatus, workflowStatuses, publishedVersion, initialData, adminConfig, useAsTitle, useAsPath, advertiseLocales, headingLabel, headerSlot, collectionPath, initialLocale, onLocaleChange, defaultLocale, useNavigationGuard, restoreWarnings, }: FormRendererProps) => import("react").JSX.Element;
+export declare const FormRenderer: ({ mode, fields, onSubmit, onCancel, onStatusChange, onUnpublish, onDelete, onDuplicate, onCopyToLocale, onDeleteLocale, contentLocales, nextStatus, workflowStatuses, publishedVersion, initialData, adminConfig, useAsTitle, useAsPath, advertiseLocales, headingLabel, headerSlot, collectionPath, initialLocale, onLocaleChange, defaultLocale, useNavigationGuard, restoreWarnings, }: FormRendererProps) => import("react").JSX.Element;

package/dist/forms/form-renderer.js

@@ -140,13 +140,14 @@ function computeStatusTransitions(currentStatus, workflowStatuses, nextStatus) {
         isTerminal: false
     };
 }
-const FormContent = ({ mode, fields, onSubmit, onCancel, onStatusChange, onUnpublish, onDelete, onDuplicate, onCopyToLocale, contentLocales, nextStatus, workflowStatuses, publishedVersion, initialData, adminConfig, useAsTitle, useAsPath, advertiseLocales, headingLabel, headerSlot, collectionPath, initialLocale, onLocaleChange, defaultLocale = 'en', useNavigationGuard: useNavigationGuardProp, restoreWarnings, _activeTabBySet, _onTabChange })=>{
+const FormContent = ({ mode, fields, onSubmit, onCancel, onStatusChange, onUnpublish, onDelete, onDuplicate, onCopyToLocale, onDeleteLocale, contentLocales, nextStatus, workflowStatuses, publishedVersion, initialData, adminConfig, useAsTitle, useAsPath, advertiseLocales, headingLabel, headerSlot, collectionPath, initialLocale, onLocaleChange, defaultLocale = 'en', useNavigationGuard: useNavigationGuardProp, restoreWarnings, _activeTabBySet, _onTabChange })=>{
     const { getFieldValues, runFieldHooks, validateForm, errors: initialErrors, hasChanges: hasChangesFn, resetHasChanges, getPatches, getSystemPath, getSystemAvailableLocales, subscribeErrors, subscribeMeta, setFieldValue, setFieldError, getPendingUploads, clearPendingUploads, setFieldUploading } = useFormContext();
     const { t } = useTranslation('byline-admin');
     const [errors, setErrors] = useState(initialErrors);
     const [hasChanges, setHasChanges] = useState(hasChangesFn());
     const [statusBusy, setStatusBusy] = useState(false);
     const [isUploading, setIsUploading] = useState(false);
+    const [showUnsavedModal, setShowUnsavedModal] = useState(false);
     const [contentLocale, setContentLocale] = useState(initialLocale ?? defaultLocale);
     const { uploadField } = useBylineFieldServices();
     useEffect(()=>{
@@ -438,6 +439,7 @@ const FormContent = ({ mode, fields, onSubmit, onCancel, onStatusChange, onUnpub
                                     intent: isTerminal ? 'info' : 'success',
                                     disabled: statusBusy,
                                     onOptionSelect: async (value)=>{
+                                        if (hasChanges) return void setShowUnsavedModal(true);
                                         setStatusBusy(true);
                                         try {
                                             await onStatusChange(value);
@@ -446,6 +448,7 @@ const FormContent = ({ mode, fields, onSubmit, onCancel, onStatusChange, onUnpub
                                         }
                                     },
                                     onButtonClick: isTerminal ? void 0 : async ()=>{
+                                        if (hasChanges) return void setShowUnsavedModal(true);
                                         setStatusBusy(true);
                                         try {
                                             await onStatusChange(primaryStatus.name);
@@ -464,7 +467,12 @@ const FormContent = ({ mode, fields, onSubmit, onCancel, onStatusChange, onUnpub
                                 sourceTitle: null != useAsTitle && null != initialData ? initialData[useAsTitle] : null,
                                 onCopyToLocale: onCopyToLocale,
                                 sourceLocale: contentLocale,
-                                contentLocales: contentLocales
+                                contentLocales: contentLocales,
+                                hasUnsavedChanges: hasChanges,
+                                onUnsavedChanges: ()=>setShowUnsavedModal(true),
+                                onDeleteLocale: onDeleteLocale,
+                                defaultLocale: defaultLocale,
+                                availableLocales: initialData?._availableVersionLocales
                             })
                         ]
                     })
@@ -515,6 +523,43 @@ const FormContent = ({ mode, fields, onSubmit, onCancel, onStatusChange, onUnpub
                     })
                 ]
             }),
+            showUnsavedModal && /*#__PURE__*/ jsx(Modal, {
+                isOpen: true,
+                closeOnOverlayClick: true,
+                onDismiss: ()=>setShowUnsavedModal(false),
+                children: /*#__PURE__*/ jsxs(Modal.Container, {
+                    style: {
+                        maxWidth: '460px'
+                    },
+                    children: [
+                        /*#__PURE__*/ jsx(Modal.Header, {
+                            className: classnames('byline-form-guard-modal-head', form_renderer_module["guard-modal-head"]),
+                            children: /*#__PURE__*/ jsx("h3", {
+                                className: classnames('byline-form-guard-modal-title', form_renderer_module["guard-modal-title"]),
+                                children: t('forms.unsavedChanges.title')
+                            })
+                        }),
+                        /*#__PURE__*/ jsx(Modal.Content, {
+                            children: /*#__PURE__*/ jsx("p", {
+                                className: classnames('byline-form-guard-modal-text', form_renderer_module["guard-modal-text"]),
+                                children: t('forms.unsavedChanges.message')
+                            })
+                        }),
+                        /*#__PURE__*/ jsx(Modal.Actions, {
+                            children: /*#__PURE__*/ jsx(Button, {
+                                size: "sm",
+                                style: {
+                                    minWidth: '60px'
+                                },
+                                intent: "primary",
+                                type: "button",
+                                onClick: ()=>setShowUnsavedModal(false),
+                                children: t('forms.unsavedChanges.okButton')
+                            })
+                        })
+                    ]
+                })
+            }),
             guard.isBlocked && /*#__PURE__*/ jsx(Modal, {
                 isOpen: true,
                 closeOnOverlayClick: false,
@@ -561,7 +606,7 @@ const FormContent = ({ mode, fields, onSubmit, onCancel, onStatusChange, onUnpub
         ]
     });
 };
-const FormRenderer = ({ mode, fields, onSubmit, onCancel, onStatusChange, onUnpublish, onDelete, onDuplicate, onCopyToLocale, contentLocales, nextStatus, workflowStatuses, publishedVersion, initialData, adminConfig, useAsTitle, useAsPath, advertiseLocales, headingLabel, headerSlot, collectionPath, initialLocale, onLocaleChange, defaultLocale, useNavigationGuard, restoreWarnings })=>{
+const FormRenderer = ({ mode, fields, onSubmit, onCancel, onStatusChange, onUnpublish, onDelete, onDuplicate, onCopyToLocale, onDeleteLocale, contentLocales, nextStatus, workflowStatuses, publishedVersion, initialData, adminConfig, useAsTitle, useAsPath, advertiseLocales, headingLabel, headerSlot, collectionPath, initialLocale, onLocaleChange, defaultLocale, useNavigationGuard, restoreWarnings })=>{
     const savedTabsRef = useRef({});
     return /*#__PURE__*/ jsx(FormProvider, {
         initialData: initialData,
@@ -575,6 +620,7 @@ const FormRenderer = ({ mode, fields, onSubmit, onCancel, onStatusChange, onUnpu
             onDelete: onDelete,
             onDuplicate: onDuplicate,
             onCopyToLocale: onCopyToLocale,
+            onDeleteLocale: onDeleteLocale,
             contentLocales: contentLocales,
             nextStatus: nextStatus,
             workflowStatuses: workflowStatuses,

package/package.json

@@ -2,7 +2,7 @@
   "name": "@byline/admin",
   "private": false,
   "license": "MPL-2.0",
-  "version": "3.0.1",
+  "version": "3.1.0",
   "engines": {
     "node": ">=20.9.0"
   },
@@ -147,10 +147,10 @@
     "uuid": "^14.0.0",
     "zod": "^4.4.3",
     "zod-form-data": "^3.0.1",
-    "@byline/auth": "3.0.1",
-    "@byline/core": "3.0.1",
-    "@byline/i18n": "3.0.1",
-    "@byline/ui": "3.0.1"
+    "@byline/auth": "3.1.0",
+    "@byline/core": "3.1.0",
+    "@byline/ui": "3.1.0",
+    "@byline/i18n": "3.1.0"
   },
   "peerDependencies": {
     "react": "^19.0.0",

package/src/fields/array/array-field.tsx

@@ -29,11 +29,18 @@ export const ArrayField = ({
   defaultValue,
   path,
   disableSorting = false,
+  contentLocale,
 }: {
   field: ArrayFieldType
   defaultValue: any
   path: string
   disableSorting?: boolean
+  /**
+   * Active content locale, forwarded to each array item's fields so
+   * localized widgets nested inside an array (e.g. a `localized` richText)
+   * can render their locale badge.
+   */
+  contentLocale?: string
 }) => {
   const { appendPatch, getFieldValue, getFieldValues, setFieldStore } = useFormContext()
   const { t } = useTranslation('byline-admin')
@@ -190,6 +197,7 @@ export const ArrayField = ({
                 defaultValue={groupData[innerField.name]}
                 basePath={`${arrayElementPath}.${childField.name}`}
                 disableSorting={true}
+                contentLocale={contentLocale}
               />
             ))}
           </div>
@@ -203,6 +211,7 @@ export const ArrayField = ({
           defaultValue={initial}
           basePath={arrayElementPath}
           disableSorting={true}
+          contentLocale={contentLocale}
         />
       )
     })

package/src/fields/blocks/blocks-field.tsx

@@ -40,10 +40,17 @@ export const BlocksField = ({
   field,
   defaultValue,
   path,
+  contentLocale,
 }: {
   field: BlocksFieldType
   defaultValue: any
   path: string
+  /**
+   * Active content locale, forwarded to each block item's fields so
+   * localized widgets nested inside a block (e.g. a `localized` richText)
+   * can render their locale badge.
+   */
+  contentLocale?: string
 }) => {
   const { appendPatch, getFieldValue, getFieldValues, setFieldStore } = useFormContext()
   const { t } = useTranslation('byline-admin')
@@ -219,6 +226,7 @@ export const BlocksField = ({
         }
         defaultValue={fieldData}
         path={arrayElementPath}
+        contentLocale={contentLocale}
       />
     )
 

package/src/fields/field-renderer.tsx

@@ -243,6 +243,7 @@ export const FieldRenderer = ({
             }
             defaultValue={defaultValue}
             path={path}
+            contentLocale={contentLocale}
           />
         )
       case 'blocks':
@@ -252,6 +253,7 @@ export const FieldRenderer = ({
             field={field as unknown as BlocksFieldType}
             defaultValue={defaultValue}
             path={path}
+            contentLocale={contentLocale}
           />
         )
       case 'array':
@@ -262,6 +264,7 @@ export const FieldRenderer = ({
             defaultValue={defaultValue}
             path={path}
             disableSorting={disableSorting}
+            contentLocale={contentLocale}
           />
         )
       default:

package/src/fields/group/group-field.tsx

@@ -32,9 +32,15 @@ interface GroupFieldProps {
   field: GroupFieldType
   defaultValue: any
   path: string
+  /**
+   * Active content locale, forwarded to child fields so localized widgets
+   * nested inside the group (e.g. a `localized` richText) can render their
+   * locale badge.
+   */
+  contentLocale?: string
 }
 
-export const GroupField = ({ field, defaultValue, path }: GroupFieldProps) => {
+export const GroupField = ({ field, defaultValue, path, contentLocale }: GroupFieldProps) => {
   const fieldError = useFieldError(field.name)
   // Default value for a group field is a plain object: { rating: 5, comment: '...' }
   // Normalize to a plain object if not already one.
@@ -74,6 +80,7 @@ export const GroupField = ({ field, defaultValue, path }: GroupFieldProps) => {
               defaultValue={groupData[innerField.name]}
               basePath={path}
               disableSorting={true}
+              contentLocale={contentLocale}
             />
           )
         })}

package/src/forms/document-actions.tsx

@@ -48,6 +48,11 @@ export function DocumentActions({
   onCopyToLocale,
   sourceLocale,
   contentLocales,
+  hasUnsavedChanges,
+  onUnsavedChanges,
+  onDeleteLocale,
+  defaultLocale,
+  availableLocales,
 }: {
   publishedVersion?: PublishedVersionInfo | null
   onUnpublish?: () => Promise<void>
@@ -82,6 +87,37 @@ export function DocumentActions({
    * Copy-to-Locale Select lists every locale except `sourceLocale`.
    */
   contentLocales?: ReadonlyArray<DocumentActionsLocaleOption>
+  /**
+   * Whether the form currently has unsaved changes. Duplicate and
+   * Copy-to-Locale operate on the *saved* version, so when this is true
+   * the action is blocked and `onUnsavedChanges` fires instead of opening
+   * the action's modal. Delete is intentionally not gated.
+   */
+  hasUnsavedChanges?: boolean
+  /**
+   * Called when a save-gated action (duplicate / copy-to-locale /
+   * delete-locale) is triggered while `hasUnsavedChanges` is true. The parent
+   * surfaces a "save first" prompt.
+   */
+  onUnsavedChanges?: () => void
+  /**
+   * Called when the editor confirms the Delete-Locale modal. The parent runs
+   * the server fn, surfaces a toast, and navigates to a surviving locale.
+   * Menu item is hidden when omitted, or when the document has no non-default
+   * locale to delete.
+   */
+  onDeleteLocale?: (args: { targetLocale: string }) => Promise<void>
+  /**
+   * The default content locale (the document's anchor). Excluded from the
+   * Delete-Locale list — it can never be removed.
+   */
+  defaultLocale?: string
+  /**
+   * The locales the document currently has content in (the derived
+   * `_availableVersionLocales` ledger). The Delete-Locale list is this set
+   * minus the default locale and the `'all'` sentinel.
+   */
+  availableLocales?: string[]
 }) {
   const { t } = useTranslation('byline-admin')
   const [showDeleteConfirm, setShowDeleteConfirm] = useState(false)
@@ -100,6 +136,21 @@ export function DocumentActions({
   )
   const [copyOverwrite, setCopyOverwrite] = useState(false)
 
+  // Delete-Locale modal state. The menu item is hidden unless the host
+  // supplied a handler AND the document has at least one non-default locale
+  // with content. The default locale is the document's anchor and is never
+  // listed (it cannot be removed).
+  const deletableLocales = (availableLocales ?? [])
+    .filter((code) => code !== defaultLocale && code !== 'all')
+    .map((code) => ({
+      code,
+      label: contentLocales?.find((loc) => loc.code === code)?.label ?? code,
+    }))
+  const deleteLocaleAvailable = onDeleteLocale != null && deletableLocales.length > 0
+  const [showDeleteLocaleConfirm, setShowDeleteLocaleConfirm] = useState(false)
+  const [deleteLocaleBusy, setDeleteLocaleBusy] = useState(false)
+  const [deleteTargetLocale, setDeleteTargetLocale] = useState<string>('')
+
   const handleOnDelete = () => {
     setShowDeleteConfirm(false)
     if (onDelete) {
@@ -118,7 +169,22 @@ export function DocumentActions({
     }
   }
 
+  const handleOpenDuplicate = () => {
+    // Duplicate copies the saved version — block when the form is dirty so
+    // unsaved edits are not silently dropped from the copy.
+    if (hasUnsavedChanges) {
+      onUnsavedChanges?.()
+      return
+    }
+    setShowDuplicateConfirm(true)
+  }
+
   const handleOpenCopyToLocale = () => {
+    // Copy-to-Locale reads the saved version — block when the form is dirty.
+    if (hasUnsavedChanges) {
+      onUnsavedChanges?.()
+      return
+    }
     // Reset on open: pick the first available target and clear the
     // overwrite checkbox so a previous-session "overwrite=true" choice
     // is not silently sticky.
@@ -138,6 +204,31 @@ export function DocumentActions({
     }
   }
 
+  const handleOpenDeleteLocale = () => {
+    // Delete-Locale removes the saved version's locale content — block when
+    // the form is dirty so the editor saves (or discards) first.
+    if (hasUnsavedChanges) {
+      onUnsavedChanges?.()
+      return
+    }
+    // Default to the currently-viewed locale when it is deletable, otherwise
+    // the first available target.
+    const preferred = deletableLocales.find((loc) => loc.code === sourceLocale)?.code
+    setDeleteTargetLocale(preferred ?? deletableLocales[0]?.code ?? '')
+    setShowDeleteLocaleConfirm(true)
+  }
+
+  const handleOnDeleteLocale = async () => {
+    if (!onDeleteLocale || !deleteTargetLocale) return
+    setDeleteLocaleBusy(true)
+    try {
+      await onDeleteLocale({ targetLocale: deleteTargetLocale })
+      setShowDeleteLocaleConfirm(false)
+    } finally {
+      setDeleteLocaleBusy(false)
+    }
+  }
+
   // Preview text shown inside the modal. Falls back to the literal suffix
   // when no source title is supplied (collections without `useAsTitle`).
   const duplicatePreviewBefore = sourceTitle ?? ''
@@ -188,12 +279,17 @@ export function DocumentActions({
                 </div>
               </DropdownComponent.Item>
             )}
+            {deleteLocaleAvailable && (
+              <DropdownComponent.Item onClick={handleOpenDeleteLocale}>
+                <div className={cx('byline-form-actions-item', styles.item)}>
+                  <span className={cx('byline-form-actions-item-text', styles['item-text'])}>
+                    <button type="button">{t('documentActions.deleteLocale.menuItem')}</button>
+                  </span>
+                </div>
+              </DropdownComponent.Item>
+            )}
             {onDuplicate && (
-              <DropdownComponent.Item
-                onClick={() => {
-                  setShowDuplicateConfirm(true)
-                }}
-              >
+              <DropdownComponent.Item onClick={handleOpenDuplicate}>
                 <div className={cx('byline-form-actions-item', styles.item)}>
                   <span className={cx('byline-form-actions-item-text', styles['item-text'])}>
                     <button type="button">{t('common.actions.duplicate')}</button>
@@ -477,6 +573,93 @@ export function DocumentActions({
           </Modal.Actions>
         </Modal.Container>
       </Modal>
+
+      <Modal
+        isOpen={showDeleteLocaleConfirm}
+        closeOnOverlayClick={!deleteLocaleBusy}
+        onDismiss={() => {
+          if (!deleteLocaleBusy) setShowDeleteLocaleConfirm(false)
+        }}
+      >
+        <Modal.Container style={{ maxWidth: '560px' }}>
+          <Modal.Header className={cx('byline-form-actions-modal-head', styles['modal-head'])}>
+            <h3 className={cx('byline-form-actions-modal-title', styles['modal-title'])}>
+              {t('documentActions.deleteLocale.title')}
+            </h3>
+            <IconButton
+              arial-label={t('common.actions.close')}
+              size="xs"
+              onClick={() => {
+                if (!deleteLocaleBusy) setShowDeleteLocaleConfirm(false)
+              }}
+            >
+              <CloseIcon width="16px" height="16px" svgClassName="white-icon" />
+            </IconButton>
+          </Modal.Header>
+          <Modal.Content>
+            <p>{t('documentActions.deleteLocale.intro')}</p>
+            <div
+              className={cx('byline-form-actions-copy-row', styles['copy-row'])}
+              style={{ marginTop: 'var(--spacing-12)' }}
+            >
+              <span
+                className={cx('byline-form-actions-copy-label', styles['copy-label'])}
+                style={{ fontWeight: 500, marginRight: 'var(--spacing-8)' }}
+              >
+                {t('documentActions.deleteLocale.localeLabel')}
+              </span>
+              <Select<string>
+                size="sm"
+                ariaLabel={t('documentActions.deleteLocale.targetAriaLabel')}
+                value={deleteTargetLocale}
+                items={deletableLocales.map((loc) => ({
+                  value: loc.code,
+                  label: loc.label,
+                }))}
+                onValueChange={(value) => {
+                  if (value != null) setDeleteTargetLocale(value)
+                }}
+                disabled={deleteLocaleBusy}
+              />
+            </div>
+            <p style={{ marginTop: 'var(--spacing-12)' }}>
+              {t('documentActions.deleteLocale.warning')}
+            </p>
+          </Modal.Content>
+          <Modal.Actions>
+            <button
+              data-autofocus
+              type="button"
+              tabIndex={0}
+              className={cx('byline-form-actions-sr-only', styles['sr-only'])}
+            >
+              no action
+            </button>
+            <Button
+              size="sm"
+              style={{ minWidth: '80px' }}
+              intent="noeffect"
+              onClick={() => {
+                if (!deleteLocaleBusy) setShowDeleteLocaleConfirm(false)
+              }}
+              disabled={deleteLocaleBusy}
+            >
+              {t('common.actions.cancel')}
+            </Button>
+            <Button
+              size="sm"
+              style={{ minWidth: '80px' }}
+              intent="danger"
+              onClick={handleOnDeleteLocale}
+              disabled={deleteLocaleBusy || !deleteTargetLocale}
+            >
+              {deleteLocaleBusy
+                ? t('documentActions.deleteLocale.busyButton')
+                : t('documentActions.deleteLocale.confirmButton')}
+            </Button>
+          </Modal.Actions>
+        </Modal.Container>
+      </Modal>
     </>
   )
 }

package/src/forms/form-renderer.tsx

@@ -70,6 +70,14 @@ export interface FormRendererProps {
    * configured), the Copy-to-Locale menu item is hidden.
    */
   onCopyToLocale?: (args: { targetLocale: string; overwrite: boolean }) => Promise<void>
+  /**
+   * Called when the editor confirms the Delete-Locale modal in
+   * `DocumentActions`. Edit views provide a handler that invokes the
+   * `deleteDocumentLocale` server fn and navigates to a surviving locale.
+   * When omitted (or when the document has no non-default locale with
+   * content), the Delete-Locale menu item is hidden.
+   */
+  onDeleteLocale?: (args: { targetLocale: string }) => Promise<void>
   /**
    * All configured content locales (code + display label) — required for
    * the Copy-to-Locale modal's target Select. Threaded as an opaque list
@@ -299,6 +307,7 @@ const FormContent = ({
   onDelete,
   onDuplicate,
   onCopyToLocale,
+  onDeleteLocale,
   contentLocales,
   nextStatus,
   workflowStatuses,
@@ -347,6 +356,11 @@ const FormContent = ({
   const [hasChanges, setHasChanges] = useState(hasChangesFn())
   const [statusBusy, setStatusBusy] = useState(false)
   const [isUploading, setIsUploading] = useState(false)
+  // Block-only "save first" guard. Set true when the editor triggers a
+  // guarded action (status change, duplicate, copy-to-locale) while the form
+  // is dirty — those actions operate on the saved version, so unsaved edits
+  // would be silently excluded.
+  const [showUnsavedModal, setShowUnsavedModal] = useState(false)
   const [contentLocale, setContentLocale] = useState(initialLocale ?? defaultLocale)
   const { uploadField } = useBylineFieldServices()
 
@@ -726,6 +740,10 @@ const FormContent = ({
                 intent={isTerminal ? 'info' : 'success'}
                 disabled={statusBusy}
                 onOptionSelect={async (value: string) => {
+                  if (hasChanges) {
+                    setShowUnsavedModal(true)
+                    return
+                  }
                   setStatusBusy(true)
                   try {
                     await onStatusChange(value)
@@ -737,6 +755,10 @@ const FormContent = ({
                   isTerminal
                     ? undefined
                     : async () => {
+                        if (hasChanges) {
+                          setShowUnsavedModal(true)
+                          return
+                        }
                         setStatusBusy(true)
                         try {
                           await onStatusChange(primaryStatus.name)
@@ -770,6 +792,11 @@ const FormContent = ({
             onCopyToLocale={onCopyToLocale}
             sourceLocale={contentLocale}
             contentLocales={contentLocales}
+            hasUnsavedChanges={hasChanges}
+            onUnsavedChanges={() => setShowUnsavedModal(true)}
+            onDeleteLocale={onDeleteLocale}
+            defaultLocale={defaultLocale}
+            availableLocales={initialData?._availableVersionLocales as string[] | undefined}
           />
         </div>
       </div>
@@ -815,6 +842,39 @@ const FormContent = ({
           {(layout.sidebar ?? []).map((name) => renderItem(name))}
         </div>
       </div>
+      {showUnsavedModal && (
+        <Modal
+          isOpen={true}
+          closeOnOverlayClick={true}
+          onDismiss={() => setShowUnsavedModal(false)}
+        >
+          <Modal.Container style={{ maxWidth: '460px' }}>
+            <Modal.Header
+              className={cx('byline-form-guard-modal-head', styles['guard-modal-head'])}
+            >
+              <h3 className={cx('byline-form-guard-modal-title', styles['guard-modal-title'])}>
+                {t('forms.unsavedChanges.title')}
+              </h3>
+            </Modal.Header>
+            <Modal.Content>
+              <p className={cx('byline-form-guard-modal-text', styles['guard-modal-text'])}>
+                {t('forms.unsavedChanges.message')}
+              </p>
+            </Modal.Content>
+            <Modal.Actions>
+              <Button
+                size="sm"
+                style={{ minWidth: '60px' }}
+                intent="primary"
+                type="button"
+                onClick={() => setShowUnsavedModal(false)}
+              >
+                {t('forms.unsavedChanges.okButton')}
+              </Button>
+            </Modal.Actions>
+          </Modal.Container>
+        </Modal>
+      )}
       {guard.isBlocked && (
         <Modal isOpen={true} closeOnOverlayClick={false} onDismiss={guard.stay}>
           <Modal.Container style={{ maxWidth: '460px' }}>
@@ -855,6 +915,7 @@ export const FormRenderer = ({
   onDelete,
   onDuplicate,
   onCopyToLocale,
+  onDeleteLocale,
   contentLocales,
   nextStatus,
   workflowStatuses,
@@ -892,6 +953,7 @@ export const FormRenderer = ({
         onDelete={onDelete}
         onDuplicate={onDuplicate}
         onCopyToLocale={onCopyToLocale}
+        onDeleteLocale={onDeleteLocale}
         contentLocales={contentLocales}
         nextStatus={nextStatus}
         workflowStatuses={workflowStatuses}