@byline/admin 6.0.3 → 6.1.0

package/dist/forms/form-modals.jsx

@@ -0,0 +1,128 @@
+'use client';
+/**
+ * This Source Code is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ *
+ * Copyright (c) Infonomic Company Limited
+ */
+import { useTranslation } from '@byline/i18n/react';
+import { Button, CloseIcon, IconButton, Modal } from '@byline/ui/react';
+import cx from 'clsx';
+import styles from './form-renderer.module.css';
+/**
+ * Shown 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 the editor must save first.
+ */
+export const UnsavedChangesModal = ({ onClose }) => {
+    const { t } = useTranslation('byline-admin');
+    return (<Modal isOpen={true} closeOnOverlayClick={true} onDismiss={onClose}>
+      <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={onClose}>
+            {t('forms.unsavedChanges.okButton')}
+          </Button>
+        </Modal.Actions>
+      </Modal.Container>
+    </Modal>);
+};
+/**
+ * Confirms an immediate, non-versioned write of the document-grain system
+ * fields (path / advertised locales) — which does NOT reset workflow status.
+ * When content is also dirty, the copy reassures that content edits still
+ * follow the normal revision + publish workflow. See docs/08-internationalization/index.md.
+ */
+export const SystemFieldsConfirmModal = ({ contentDirty, pathDirty, availableLocalesDirty, onCancel, onConfirm, }) => {
+    const { t } = useTranslation('byline-admin');
+    return (<Modal isOpen={true} closeOnOverlayClick={true} onDismiss={onCancel}>
+      <Modal.Container style={{ maxWidth: '520px' }}>
+        <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'])}>
+            {contentDirty
+            ? t('forms.systemFieldsConfirm.bothTitle')
+            : t('forms.systemFieldsConfirm.title')}
+          </h3>
+          <IconButton aria-label={t('common.actions.close')} size="xs" onClick={onCancel}>
+            <CloseIcon width="16px" height="16px" svgClassName="white-icon"/>
+          </IconButton>
+        </Modal.Header>
+        <Modal.Content className="prose">
+          {/* Lead with reassurance: content edits follow the normal
+            revision + publish workflow. The immediate, document-level
+            system-field write is explained below the divider. */}
+          {contentDirty && (<p className={cx('byline-form-system-fields-content-note', 'm-0 mt-2')}>
+              {t('forms.systemFieldsConfirm.contentNote')}
+            </p>)}
+          <p className="m-0 mt-2" style={contentDirty
+            ? {
+                marginTop: 'var(--spacing-8)',
+                paddingTop: 'var(--spacing-12)',
+                borderTop: '1px solid var(--border-color)',
+            }
+            : undefined}>
+            {t('forms.systemFieldsConfirm.intro')}
+          </p>
+          <ul className={cx('byline-form-system-fields-list', styles['guard-modal-text'], 'm-0')}>
+            {pathDirty && <li>{t('forms.systemFieldsConfirm.bulletPath')}</li>}
+            {availableLocalesDirty && <li>{t('forms.systemFieldsConfirm.bulletLocales')}</li>}
+          </ul>
+          <p className={cx('byline-form-system-fields-effect', styles['guard-modal-text'])} style={{
+            marginTop: 'var(--spacing-4)',
+            marginBottom: 0,
+            color: 'var(--text-subtle)',
+        }}>
+            {t('forms.systemFieldsConfirm.effectLine')}
+          </p>
+        </Modal.Content>
+        <Modal.Actions>
+          <Button size="sm" style={{ minWidth: '80px' }} intent="noeffect" type="button" onClick={onCancel}>
+            {t('common.actions.cancel')}
+          </Button>
+          <Button size="sm" style={{ minWidth: '80px' }} intent="primary" type="button" onClick={onConfirm}>
+            {t('forms.systemFieldsConfirm.confirmButton')}
+          </Button>
+        </Modal.Actions>
+      </Modal.Container>
+    </Modal>);
+};
+/**
+ * Blocks router navigation / browser unload while the form is dirty. Driven by
+ * the navigation-guard adapter's `isBlocked` state; `onStay` keeps the editor
+ * on the page, `onProceed` discards and continues.
+ */
+export const NavigationGuardModal = ({ onStay, onProceed, }) => {
+    const { t } = useTranslation('byline-admin');
+    return (<Modal isOpen={true} closeOnOverlayClick={false} onDismiss={onStay}>
+      <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.navigationGuard.title')}
+          </h3>
+        </Modal.Header>
+        <Modal.Content>
+          <p className={cx('byline-form-guard-modal-text', styles['guard-modal-text'])}>
+            {t('forms.navigationGuard.message')}
+          </p>
+        </Modal.Content>
+        <Modal.Actions>
+          <Button size="sm" intent="noeffect" type="button" onClick={onStay}>
+            {t('forms.navigationGuard.stayButton')}
+          </Button>
+          <Button size="sm" intent="danger" type="button" onClick={onProceed}>
+            {t('forms.navigationGuard.leaveButton')}
+          </Button>
+        </Modal.Actions>
+      </Modal.Container>
+    </Modal>);
+};

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

@@ -6,7 +6,7 @@
  * Copyright (c) Infonomic Company Limited
  */
 import { type ReactNode } from 'react';
-import type { Field, FormAdminConfig, WorkflowStatus } from '@byline/core';
+import type { AdminResourceConfig, Field, WorkflowStatus } from '@byline/core';
 import type { DocumentPatch } from '@byline/core/patches';
 import { type DocumentActionsLocaleOption } from './document-actions.js';
 import { type ScheduledPublicationInfo, type SchedulePublicationInput } from './scheduled-publication-control.js';
@@ -95,7 +95,13 @@ export interface FormRendererProps {
     workflowStatuses?: WorkflowStatus[];
     publishedVersion?: PublishedVersionInfo | null;
     initialData?: Record<string, any>;
-    adminConfig?: FormAdminConfig;
+    /**
+     * Presentation configuration for the resource being edited — a collection
+     * or a singleton. Typed as the union rather than the shared
+     * `FormAdminConfig` base so the renderer can read collection-only members
+     * such as `lockPath`.
+     */
+    adminConfig?: AdminResourceConfig;
     /**
      * Name of the schema field to render as the live form heading.
      * Sourced from `CollectionDefinition.useAsTitle` by the caller.

package/dist/forms/form-renderer.js

@@ -533,7 +533,7 @@ const FormContent = ({ mode, mutationIssue, mutationsBlocked = false, observedRe
                                 /*#__PURE__*/ jsxs("div", {
                                     className: clsx('byline-form-sidebar', form_renderer_module.sidebar),
                                     children: [
-                                        showPath && (useAsPath || 'string' == typeof initialData?.path && initialData.path.length > 0) && /*#__PURE__*/ jsx(PathWidget, {
+                                        showPath && (useAsPath || adminConfig?.lockPath === true || 'string' == typeof initialData?.path && initialData.path.length > 0) && /*#__PURE__*/ jsx(PathWidget, {
                                             disabled: mutationsBlocked || discarding,
                                             useAsPath: useAsPath,
                                             collectionPath: collectionPath ?? '',
@@ -541,7 +541,8 @@ const FormContent = ({ mode, mutationIssue, mutationsBlocked = false, observedRe
                                             activeLocale: contentLocale,
                                             mode: mode,
                                             slugifier: pathSlugifier,
-                                            sourceLocked: pathSourceLocked
+                                            sourceLocked: pathSourceLocked,
+                                            lockPath: adminConfig?.lockPath
                                         }),
                                         tree && 'edit' === mode && 'string' == typeof initialData?.id && /*#__PURE__*/ jsx(TreePlacementWidget, {
                                             disabled: mutationsBlocked || discarding,