@ruya.sa/ui 3.71.3

package/dist/elements/DocumentControls/index.js

@@ -0,0 +1,310 @@
+'use client';
+
+import { c as _c } from "react/compiler-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { getTranslation } from '@ruya.sa/translations';
+import { formatAdminURL, hasAutosaveEnabled, hasDraftsEnabled } from '@ruya.sa/payload/shared';
+import React, { Fragment, useEffect } from 'react';
+import { useFormInitializing, useFormProcessing } from '../../forms/Form/context.js';
+import { useConfig } from '../../providers/Config/index.js';
+import { useEditDepth } from '../../providers/EditDepth/index.js';
+import { useLivePreviewContext } from '../../providers/LivePreview/context.js';
+import { useTranslation } from '../../providers/Translation/index.js';
+import { formatDate } from '../../utilities/formatDocTitle/formatDateTitle.js';
+import { Autosave } from '../Autosave/index.js';
+import { Button } from '../Button/index.js';
+import { CopyLocaleData } from '../CopyLocaleData/index.js';
+import { DeleteDocument } from '../DeleteDocument/index.js';
+import { DuplicateDocument } from '../DuplicateDocument/index.js';
+import { MoveDocToFolder } from '../FolderView/MoveDocToFolder/index.js';
+import { Gutter } from '../Gutter/index.js';
+import { LivePreviewToggler } from '../LivePreview/Toggler/index.js';
+import { Locked } from '../Locked/index.js';
+import { PermanentlyDeleteButton } from '../PermanentlyDeleteButton/index.js';
+import { Popup, PopupList } from '../Popup/index.js';
+import { PreviewButton } from '../PreviewButton/index.js';
+import { PublishButton } from '../PublishButton/index.js';
+import { RenderCustomComponent } from '../RenderCustomComponent/index.js';
+import { RestoreButton } from '../RestoreButton/index.js';
+import { SaveButton } from '../SaveButton/index.js';
+import './index.scss';
+import { SaveDraftButton } from '../SaveDraftButton/index.js';
+import { Status } from '../Status/index.js';
+const baseClass = 'doc-controls';
+export const DocumentControls = props => {
+  const $ = _c(5);
+  const {
+    id,
+    slug,
+    BeforeDocumentControls,
+    customComponents: t0,
+    data,
+    disableActions,
+    disableCreate,
+    EditMenuItems,
+    hasSavePermission,
+    isAccountView,
+    isEditing,
+    isInDrawer,
+    isTrashed,
+    onDelete,
+    onDrawerCreateNew,
+    onDuplicate,
+    onRestore,
+    onTakeOver,
+    permissions,
+    readOnlyForIncomingUser,
+    redirectAfterDelete,
+    redirectAfterDuplicate,
+    redirectAfterRestore,
+    user
+  } = props;
+  const {
+    PreviewButton: CustomPreviewButton,
+    PublishButton: CustomPublishButton,
+    SaveButton: CustomSaveButton,
+    SaveDraftButton: CustomSaveDraftButton,
+    Status: CustomStatus
+  } = t0 === undefined ? {} : t0;
+  const {
+    i18n,
+    t
+  } = useTranslation();
+  const editDepth = useEditDepth();
+  const {
+    config,
+    getEntityConfig
+  } = useConfig();
+  const collectionConfig = getEntityConfig({
+    collectionSlug: slug
+  });
+  const globalConfig = getEntityConfig({
+    globalSlug: slug
+  });
+  const {
+    isLivePreviewEnabled
+  } = useLivePreviewContext();
+  const {
+    admin: t1,
+    localization,
+    routes: t2
+  } = config;
+  const {
+    dateFormat
+  } = t1;
+  const {
+    admin: adminRoute
+  } = t2;
+  const [updatedAt, setUpdatedAt] = React.useState("");
+  const [createdAt, setCreatedAt] = React.useState("");
+  const processing = useFormProcessing();
+  const initializing = useFormInitializing();
+  let t3;
+  let t4;
+  if ($[0] !== data || $[1] !== dateFormat || $[2] !== i18n) {
+    t3 = () => {
+      if (data?.updatedAt) {
+        setUpdatedAt(formatDate({
+          date: data.updatedAt,
+          i18n,
+          pattern: dateFormat
+        }));
+      }
+      if (data?.createdAt) {
+        setCreatedAt(formatDate({
+          date: data.createdAt,
+          i18n,
+          pattern: dateFormat
+        }));
+      }
+    };
+    t4 = [data, i18n, dateFormat];
+    $[0] = data;
+    $[1] = dateFormat;
+    $[2] = i18n;
+    $[3] = t3;
+    $[4] = t4;
+  } else {
+    t3 = $[3];
+    t4 = $[4];
+  }
+  useEffect(t3, t4);
+  const hasCreatePermission = permissions && "create" in permissions && permissions.create;
+  const hasDeletePermission = permissions && "delete" in permissions && permissions.delete;
+  const showDotMenu = Boolean(collectionConfig && id && !disableActions && (hasCreatePermission || hasDeletePermission));
+  const unsavedDraftWithValidations = !id && collectionConfig?.versions?.drafts && collectionConfig.versions?.drafts.validate;
+  const globalHasDraftsEnabled = hasDraftsEnabled(globalConfig);
+  const collectionHasDraftsEnabled = hasDraftsEnabled(collectionConfig);
+  const collectionAutosaveEnabled = hasAutosaveEnabled(collectionConfig);
+  const globalAutosaveEnabled = hasAutosaveEnabled(globalConfig);
+  const autosaveEnabled = collectionAutosaveEnabled || globalAutosaveEnabled;
+  const showSaveDraftButton = collectionAutosaveEnabled && collectionConfig.versions.drafts.autosave !== false && collectionConfig.versions.drafts.autosave.showSaveDraftButton === true || globalAutosaveEnabled && globalConfig.versions.drafts.autosave !== false && globalConfig.versions.drafts.autosave.showSaveDraftButton === true;
+  const showCopyToLocale = localization && !collectionConfig?.admin?.disableCopyToLocale;
+  const showFolderMetaIcon = collectionConfig && collectionConfig.folders;
+  const showLockedMetaIcon = user && readOnlyForIncomingUser;
+  return _jsxs(Gutter, {
+    className: baseClass,
+    children: [_jsxs("div", {
+      className: `${baseClass}__wrapper`,
+      children: [_jsxs("div", {
+        className: `${baseClass}__content`,
+        children: [showLockedMetaIcon || showFolderMetaIcon ? _jsxs("div", {
+          className: `${baseClass}__meta-icons`,
+          children: [showLockedMetaIcon && _jsx(Locked, {
+            className: `${baseClass}__locked-controls`,
+            user
+          }), showFolderMetaIcon && config.folders && !isTrashed && _jsx(MoveDocToFolder, {
+            folderCollectionSlug: config.folders.slug,
+            folderFieldName: config.folders.fieldName
+          })]
+        }) : null, _jsxs("ul", {
+          className: `${baseClass}__meta`,
+          children: [collectionConfig && !isEditing && !isAccountView && _jsx("li", {
+            className: `${baseClass}__list-item`,
+            children: _jsx("p", {
+              className: `${baseClass}__value`,
+              children: i18n.t("general:creatingNewLabel", {
+                label: getTranslation(collectionConfig?.labels?.singular ?? i18n.t("general:document"), i18n)
+              })
+            })
+          }), (collectionHasDraftsEnabled || globalHasDraftsEnabled) && _jsxs(Fragment, {
+            children: [(globalConfig || collectionConfig && isEditing) && _jsx("li", {
+              className: [`${baseClass}__status`, `${baseClass}__list-item`].filter(Boolean).join(" "),
+              children: _jsx(RenderCustomComponent, {
+                CustomComponent: CustomStatus,
+                Fallback: _jsx(Status, {})
+              })
+            }), hasSavePermission && autosaveEnabled && !unsavedDraftWithValidations && !isTrashed && _jsx("li", {
+              className: `${baseClass}__list-item`,
+              children: _jsx(Autosave, {
+                collection: collectionConfig,
+                global: globalConfig,
+                id,
+                publishedDocUpdatedAt: data?.createdAt
+              })
+            })]
+          }), collectionConfig?.timestamps && (isEditing || isAccountView) && _jsxs(Fragment, {
+            children: [_jsxs("li", {
+              className: [`${baseClass}__list-item`, `${baseClass}__value-wrap`].filter(Boolean).join(" "),
+              title: data?.updatedAt ? updatedAt : "",
+              children: [_jsxs("p", {
+                className: `${baseClass}__label`,
+                children: [i18n.t(isTrashed ? "general:deleted" : "general:lastModified"), ":\xA0"]
+              }), data?.updatedAt && _jsx("p", {
+                className: `${baseClass}__value`,
+                children: updatedAt
+              })]
+            }), _jsxs("li", {
+              className: [`${baseClass}__list-item`, `${baseClass}__value-wrap`].filter(Boolean).join(" "),
+              title: data?.createdAt ? createdAt : "",
+              children: [_jsxs("p", {
+                className: `${baseClass}__label`,
+                children: [i18n.t("general:created"), ":\xA0"]
+              }), data?.createdAt && _jsx("p", {
+                className: `${baseClass}__value`,
+                children: createdAt
+              })]
+            })]
+          })]
+        })]
+      }), _jsxs("div", {
+        className: `${baseClass}__controls-wrapper`,
+        children: [_jsxs("div", {
+          className: `${baseClass}__controls`,
+          children: [BeforeDocumentControls, isLivePreviewEnabled && !isInDrawer && _jsx(LivePreviewToggler, {}), (collectionConfig?.admin.preview || globalConfig?.admin.preview) && _jsx(RenderCustomComponent, {
+            CustomComponent: CustomPreviewButton,
+            Fallback: _jsx(PreviewButton, {})
+          }), hasSavePermission && !isTrashed && _jsx(Fragment, {
+            children: collectionHasDraftsEnabled || globalHasDraftsEnabled ? _jsxs(Fragment, {
+              children: [(unsavedDraftWithValidations || !autosaveEnabled || autosaveEnabled && showSaveDraftButton) && _jsx(RenderCustomComponent, {
+                CustomComponent: CustomSaveDraftButton,
+                Fallback: _jsx(SaveDraftButton, {})
+              }), _jsx(RenderCustomComponent, {
+                CustomComponent: CustomPublishButton,
+                Fallback: _jsx(PublishButton, {})
+              })]
+            }) : _jsx(RenderCustomComponent, {
+              CustomComponent: CustomSaveButton,
+              Fallback: _jsx(SaveButton, {})
+            })
+          }), hasDeletePermission && isTrashed && _jsx(PermanentlyDeleteButton, {
+            buttonId: "action-permanently-delete",
+            collectionSlug: collectionConfig?.slug,
+            id: id.toString(),
+            onDelete,
+            redirectAfterDelete,
+            singularLabel: collectionConfig?.labels?.singular
+          }), hasSavePermission && isTrashed && _jsx(RestoreButton, {
+            buttonId: "action-restore",
+            collectionSlug: collectionConfig?.slug,
+            id: id.toString(),
+            onRestore,
+            redirectAfterRestore,
+            singularLabel: collectionConfig?.labels?.singular
+          }), user && readOnlyForIncomingUser && _jsx(Button, {
+            buttonStyle: "secondary",
+            id: "take-over",
+            onClick: onTakeOver,
+            size: "medium",
+            type: "button",
+            children: t("general:takeOver")
+          })]
+        }), showDotMenu && !readOnlyForIncomingUser && _jsx(Popup, {
+          button: _jsxs("div", {
+            className: `${baseClass}__dots`,
+            children: [_jsx("div", {}), _jsx("div", {}), _jsx("div", {})]
+          }),
+          className: `${baseClass}__popup`,
+          disabled: initializing || processing,
+          horizontalAlign: "right",
+          size: "large",
+          verticalAlign: "bottom",
+          children: _jsxs(PopupList.ButtonGroup, {
+            children: [showCopyToLocale && _jsx(CopyLocaleData, {}), hasCreatePermission && _jsxs(React.Fragment, {
+              children: [!disableCreate && _jsx(Fragment, {
+                children: editDepth > 1 ? _jsx(PopupList.Button, {
+                  id: "action-create",
+                  onClick: onDrawerCreateNew,
+                  children: i18n.t("general:createNew")
+                }) : _jsx(PopupList.Button, {
+                  href: formatAdminURL({
+                    adminRoute,
+                    path: `/collections/${collectionConfig?.slug}/create`
+                  }),
+                  id: "action-create",
+                  children: i18n.t("general:createNew")
+                })
+              }), collectionConfig.disableDuplicate !== true && isEditing && _jsxs(_Fragment, {
+                children: [_jsx(DuplicateDocument, {
+                  id,
+                  onDuplicate,
+                  redirectAfterDuplicate,
+                  singularLabel: collectionConfig?.labels?.singular,
+                  slug: collectionConfig?.slug
+                }), localization && _jsx(DuplicateDocument, {
+                  id,
+                  onDuplicate,
+                  redirectAfterDuplicate,
+                  selectLocales: true,
+                  singularLabel: collectionConfig?.labels?.singular,
+                  slug: collectionConfig?.slug
+                })]
+              })]
+            }), hasDeletePermission && _jsx(DeleteDocument, {
+              buttonId: "action-delete",
+              collectionSlug: collectionConfig?.slug,
+              id: id.toString(),
+              onDelete,
+              redirectAfterDelete,
+              singularLabel: collectionConfig?.labels?.singular,
+              useAsTitle: collectionConfig?.admin?.useAsTitle
+            }), EditMenuItems]
+          })
+        })]
+      })]
+    }), _jsx("div", {
+      className: `${baseClass}__divider`
+    })]
+  });
+};
+//# sourceMappingURL=index.js.map

package/dist/elements/DocumentControls/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["c","_c","getTranslation","formatAdminURL","hasAutosaveEnabled","hasDraftsEnabled","React","Fragment","useEffect","useFormInitializing","useFormProcessing","useConfig","useEditDepth","useLivePreviewContext","useTranslation","formatDate","Autosave","Button","CopyLocaleData","DeleteDocument","DuplicateDocument","MoveDocToFolder","Gutter","LivePreviewToggler","Locked","PermanentlyDeleteButton","Popup","PopupList","PreviewButton","PublishButton","RenderCustomComponent","RestoreButton","SaveButton","SaveDraftButton","Status","baseClass","DocumentControls","props","$","id","slug","BeforeDocumentControls","customComponents","t0","data","disableActions","disableCreate","EditMenuItems","hasSavePermission","isAccountView","isEditing","isInDrawer","isTrashed","onDelete","onDrawerCreateNew","onDuplicate","onRestore","onTakeOver","permissions","readOnlyForIncomingUser","redirectAfterDelete","redirectAfterDuplicate","redirectAfterRestore","user","CustomPreviewButton","CustomPublishButton","CustomSaveButton","CustomSaveDraftButton","CustomStatus","undefined","i18n","t","editDepth","config","getEntityConfig","collectionConfig","collectionSlug","globalConfig","globalSlug","isLivePreviewEnabled","admin","t1","localization","routes","t2","dateFormat","adminRoute","updatedAt","setUpdatedAt","useState","createdAt","setCreatedAt","processing","initializing","t3","t4","date","pattern","hasCreatePermission","create","hasDeletePermission","delete","showDotMenu","Boolean","unsavedDraftWithValidations","versions","drafts","validate","globalHasDraftsEnabled","collectionHasDraftsEnabled","collectionAutosaveEnabled","globalAutosaveEnabled","autosaveEnabled","showSaveDraftButton","autosave","showCopyToLocale","disableCopyToLocale","showFolderMetaIcon","folders","showLockedMetaIcon","_jsxs","className","children","_jsx","folderCollectionSlug","folderFieldName","fieldName","label","labels","singular","filter","join","CustomComponent","Fallback","collection","global","publishedDocUpdatedAt","timestamps","title","preview","buttonId","toString","singularLabel","buttonStyle","onClick","size","type","button","disabled","horizontalAlign","verticalAlign","ButtonGroup","href","path","disableDuplicate","_Fragment","selectLocales","useAsTitle"],"sources":["../../../src/elements/DocumentControls/index.tsx"],"sourcesContent":["'use client'\nimport type {\n  ClientUser,\n  Data,\n  SanitizedCollectionConfig,\n  SanitizedCollectionPermission,\n  SanitizedGlobalPermission,\n} from '@ruya.sa/payload'\n\nimport { getTranslation } from '@ruya.sa/translations'\nimport { formatAdminURL, hasAutosaveEnabled, hasDraftsEnabled } from '@ruya.sa/payload/shared'\nimport React, { Fragment, useEffect } from 'react'\n\nimport type { DocumentDrawerContextType } from '../DocumentDrawer/Provider.js'\n\nimport { useFormInitializing, useFormProcessing } from '../../forms/Form/context.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useEditDepth } from '../../providers/EditDepth/index.js'\nimport { useLivePreviewContext } from '../../providers/LivePreview/context.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { formatDate } from '../../utilities/formatDocTitle/formatDateTitle.js'\nimport { Autosave } from '../Autosave/index.js'\nimport { Button } from '../Button/index.js'\nimport { CopyLocaleData } from '../CopyLocaleData/index.js'\nimport { DeleteDocument } from '../DeleteDocument/index.js'\nimport { DuplicateDocument } from '../DuplicateDocument/index.js'\nimport { MoveDocToFolder } from '../FolderView/MoveDocToFolder/index.js'\nimport { Gutter } from '../Gutter/index.js'\nimport { LivePreviewToggler } from '../LivePreview/Toggler/index.js'\nimport { Locked } from '../Locked/index.js'\nimport { PermanentlyDeleteButton } from '../PermanentlyDeleteButton/index.js'\nimport { Popup, PopupList } from '../Popup/index.js'\nimport { PreviewButton } from '../PreviewButton/index.js'\nimport { PublishButton } from '../PublishButton/index.js'\nimport { RenderCustomComponent } from '../RenderCustomComponent/index.js'\nimport { RestoreButton } from '../RestoreButton/index.js'\nimport { SaveButton } from '../SaveButton/index.js'\nimport './index.scss'\nimport { SaveDraftButton } from '../SaveDraftButton/index.js'\nimport { Status } from '../Status/index.js'\n\nconst baseClass = 'doc-controls'\n\nexport const DocumentControls: React.FC<{\n  readonly apiURL: string\n  readonly BeforeDocumentControls?: React.ReactNode\n  readonly customComponents?: {\n    readonly PreviewButton?: React.ReactNode\n    readonly PublishButton?: React.ReactNode\n    readonly SaveButton?: React.ReactNode\n    readonly SaveDraftButton?: React.ReactNode\n    readonly Status?: React.ReactNode\n  }\n  readonly data?: Data\n  readonly disableActions?: boolean\n  readonly disableCreate?: boolean\n  readonly EditMenuItems?: React.ReactNode\n  readonly hasPublishPermission?: boolean\n  readonly hasSavePermission?: boolean\n  readonly id?: number | string\n  readonly isAccountView?: boolean\n  readonly isEditing?: boolean\n  readonly isInDrawer?: boolean\n  readonly isTrashed?: boolean\n  readonly onDelete?: DocumentDrawerContextType['onDelete']\n  readonly onDrawerCreateNew?: () => void\n  /* Only available if `redirectAfterDuplicate` is `false` */\n  readonly onDuplicate?: DocumentDrawerContextType['onDuplicate']\n  readonly onRestore?: DocumentDrawerContextType['onRestore']\n  readonly onSave?: DocumentDrawerContextType['onSave']\n  readonly onTakeOver?: () => void\n  readonly permissions: null | SanitizedCollectionPermission | SanitizedGlobalPermission\n  readonly readOnlyForIncomingUser?: boolean\n  readonly redirectAfterDelete?: boolean\n  readonly redirectAfterDuplicate?: boolean\n  readonly redirectAfterRestore?: boolean\n  readonly slug: SanitizedCollectionConfig['slug']\n  readonly user?: ClientUser\n}> = (props) => {\n  const {\n    id,\n    slug,\n    BeforeDocumentControls,\n    customComponents: {\n      PreviewButton: CustomPreviewButton,\n      PublishButton: CustomPublishButton,\n      SaveButton: CustomSaveButton,\n      SaveDraftButton: CustomSaveDraftButton,\n      Status: CustomStatus,\n    } = {},\n    data,\n    disableActions,\n    disableCreate,\n    EditMenuItems,\n    hasSavePermission,\n    isAccountView,\n    isEditing,\n    isInDrawer,\n    isTrashed,\n    onDelete,\n    onDrawerCreateNew,\n    onDuplicate,\n    onRestore,\n    onTakeOver,\n    permissions,\n    readOnlyForIncomingUser,\n    redirectAfterDelete,\n    redirectAfterDuplicate,\n    redirectAfterRestore,\n    user,\n  } = props\n\n  const { i18n, t } = useTranslation()\n\n  const editDepth = useEditDepth()\n\n  const { config, getEntityConfig } = useConfig()\n\n  const collectionConfig = getEntityConfig({ collectionSlug: slug })\n\n  const globalConfig = getEntityConfig({ globalSlug: slug })\n\n  const { isLivePreviewEnabled } = useLivePreviewContext()\n\n  const {\n    admin: { dateFormat },\n    localization,\n    routes: { admin: adminRoute },\n    serverURL,\n  } = config\n\n  // Settings these in state to avoid hydration issues if there is a mismatch between the server and client\n  const [updatedAt, setUpdatedAt] = React.useState<string>('')\n  const [createdAt, setCreatedAt] = React.useState<string>('')\n\n  const processing = useFormProcessing()\n  const initializing = useFormInitializing()\n\n  useEffect(() => {\n    if (data?.updatedAt) {\n      setUpdatedAt(formatDate({ date: data.updatedAt, i18n, pattern: dateFormat }))\n    }\n    if (data?.createdAt) {\n      setCreatedAt(formatDate({ date: data.createdAt, i18n, pattern: dateFormat }))\n    }\n  }, [data, i18n, dateFormat])\n\n  const hasCreatePermission = permissions && 'create' in permissions && permissions.create\n\n  const hasDeletePermission = permissions && 'delete' in permissions && permissions.delete\n\n  const showDotMenu = Boolean(\n    collectionConfig && id && !disableActions && (hasCreatePermission || hasDeletePermission),\n  )\n\n  const unsavedDraftWithValidations =\n    !id && collectionConfig?.versions?.drafts && collectionConfig.versions?.drafts.validate\n\n  const globalHasDraftsEnabled = hasDraftsEnabled(globalConfig)\n  const collectionHasDraftsEnabled = hasDraftsEnabled(collectionConfig)\n  const collectionAutosaveEnabled = hasAutosaveEnabled(collectionConfig)\n  const globalAutosaveEnabled = hasAutosaveEnabled(globalConfig)\n  const autosaveEnabled = collectionAutosaveEnabled || globalAutosaveEnabled\n\n  const showSaveDraftButton =\n    (collectionAutosaveEnabled &&\n      collectionConfig.versions.drafts.autosave !== false &&\n      collectionConfig.versions.drafts.autosave.showSaveDraftButton === true) ||\n    (globalAutosaveEnabled &&\n      globalConfig.versions.drafts.autosave !== false &&\n      globalConfig.versions.drafts.autosave.showSaveDraftButton === true)\n  const showCopyToLocale = localization && !collectionConfig?.admin?.disableCopyToLocale\n\n  const showFolderMetaIcon = collectionConfig && collectionConfig.folders\n  const showLockedMetaIcon = user && readOnlyForIncomingUser\n\n  return (\n    <Gutter className={baseClass}>\n      <div className={`${baseClass}__wrapper`}>\n        <div className={`${baseClass}__content`}>\n          {showLockedMetaIcon || showFolderMetaIcon ? (\n            <div className={`${baseClass}__meta-icons`}>\n              {showLockedMetaIcon && (\n                <Locked className={`${baseClass}__locked-controls`} user={user} />\n              )}\n              {showFolderMetaIcon && config.folders && !isTrashed && (\n                <MoveDocToFolder\n                  folderCollectionSlug={config.folders.slug}\n                  folderFieldName={config.folders.fieldName}\n                />\n              )}\n            </div>\n          ) : null}\n          <ul className={`${baseClass}__meta`}>\n            {collectionConfig && !isEditing && !isAccountView && (\n              <li className={`${baseClass}__list-item`}>\n                <p className={`${baseClass}__value`}>\n                  {i18n.t('general:creatingNewLabel', {\n                    label: getTranslation(\n                      collectionConfig?.labels?.singular ?? i18n.t('general:document'),\n                      i18n,\n                    ),\n                  })}\n                </p>\n              </li>\n            )}\n            {(collectionHasDraftsEnabled || globalHasDraftsEnabled) && (\n              <Fragment>\n                {(globalConfig || (collectionConfig && isEditing)) && (\n                  <li\n                    className={[`${baseClass}__status`, `${baseClass}__list-item`]\n                      .filter(Boolean)\n                      .join(' ')}\n                  >\n                    <RenderCustomComponent CustomComponent={CustomStatus} Fallback={<Status />} />\n                  </li>\n                )}\n                {hasSavePermission &&\n                  autosaveEnabled &&\n                  !unsavedDraftWithValidations &&\n                  !isTrashed && (\n                    <li className={`${baseClass}__list-item`}>\n                      <Autosave\n                        collection={collectionConfig}\n                        global={globalConfig}\n                        id={id}\n                        publishedDocUpdatedAt={data?.createdAt}\n                      />\n                    </li>\n                  )}\n              </Fragment>\n            )}\n            {collectionConfig?.timestamps && (isEditing || isAccountView) && (\n              <Fragment>\n                <li\n                  className={[`${baseClass}__list-item`, `${baseClass}__value-wrap`]\n                    .filter(Boolean)\n                    .join(' ')}\n                  title={data?.updatedAt ? updatedAt : ''}\n                >\n                  <p className={`${baseClass}__label`}>\n                    {i18n.t(isTrashed ? 'general:deleted' : 'general:lastModified')}:&nbsp;\n                  </p>\n\n                  {data?.updatedAt && <p className={`${baseClass}__value`}>{updatedAt}</p>}\n                </li>\n                <li\n                  className={[`${baseClass}__list-item`, `${baseClass}__value-wrap`]\n                    .filter(Boolean)\n                    .join(' ')}\n                  title={data?.createdAt ? createdAt : ''}\n                >\n                  <p className={`${baseClass}__label`}>{i18n.t('general:created')}:&nbsp;</p>\n                  {data?.createdAt && <p className={`${baseClass}__value`}>{createdAt}</p>}\n                </li>\n              </Fragment>\n            )}\n          </ul>\n        </div>\n        <div className={`${baseClass}__controls-wrapper`}>\n          <div className={`${baseClass}__controls`}>\n            {BeforeDocumentControls}\n            {isLivePreviewEnabled && !isInDrawer && <LivePreviewToggler />}\n            {(collectionConfig?.admin.preview || globalConfig?.admin.preview) && (\n              <RenderCustomComponent\n                CustomComponent={CustomPreviewButton}\n                Fallback={<PreviewButton />}\n              />\n            )}\n            {hasSavePermission && !isTrashed && (\n              <Fragment>\n                {collectionHasDraftsEnabled || globalHasDraftsEnabled ? (\n                  <Fragment>\n                    {(unsavedDraftWithValidations ||\n                      !autosaveEnabled ||\n                      (autosaveEnabled && showSaveDraftButton)) && (\n                      <RenderCustomComponent\n                        CustomComponent={CustomSaveDraftButton}\n                        Fallback={<SaveDraftButton />}\n                      />\n                    )}\n                    <RenderCustomComponent\n                      CustomComponent={CustomPublishButton}\n                      Fallback={<PublishButton />}\n                    />\n                  </Fragment>\n                ) : (\n                  <RenderCustomComponent\n                    CustomComponent={CustomSaveButton}\n                    Fallback={<SaveButton />}\n                  />\n                )}\n              </Fragment>\n            )}\n            {hasDeletePermission && isTrashed && (\n              <PermanentlyDeleteButton\n                buttonId=\"action-permanently-delete\"\n                collectionSlug={collectionConfig?.slug}\n                id={id.toString()}\n                onDelete={onDelete}\n                redirectAfterDelete={redirectAfterDelete}\n                singularLabel={collectionConfig?.labels?.singular}\n              />\n            )}\n            {hasSavePermission && isTrashed && (\n              <RestoreButton\n                buttonId=\"action-restore\"\n                collectionSlug={collectionConfig?.slug}\n                id={id.toString()}\n                onRestore={onRestore}\n                redirectAfterRestore={redirectAfterRestore}\n                singularLabel={collectionConfig?.labels?.singular}\n              />\n            )}\n            {user && readOnlyForIncomingUser && (\n              <Button\n                buttonStyle=\"secondary\"\n                id=\"take-over\"\n                onClick={onTakeOver}\n                size=\"medium\"\n                type=\"button\"\n              >\n                {t('general:takeOver')}\n              </Button>\n            )}\n          </div>\n          {showDotMenu && !readOnlyForIncomingUser && (\n            <Popup\n              button={\n                <div className={`${baseClass}__dots`}>\n                  <div />\n                  <div />\n                  <div />\n                </div>\n              }\n              className={`${baseClass}__popup`}\n              disabled={initializing || processing}\n              horizontalAlign=\"right\"\n              size=\"large\"\n              verticalAlign=\"bottom\"\n            >\n              <PopupList.ButtonGroup>\n                {showCopyToLocale && <CopyLocaleData />}\n                {hasCreatePermission && (\n                  <React.Fragment>\n                    {!disableCreate && (\n                      <Fragment>\n                        {editDepth > 1 ? (\n                          <PopupList.Button id=\"action-create\" onClick={onDrawerCreateNew}>\n                            {i18n.t('general:createNew')}\n                          </PopupList.Button>\n                        ) : (\n                          <PopupList.Button\n                            href={formatAdminURL({\n                              adminRoute,\n                              path: `/collections/${collectionConfig?.slug}/create`,\n                            })}\n                            id=\"action-create\"\n                          >\n                            {i18n.t('general:createNew')}\n                          </PopupList.Button>\n                        )}\n                      </Fragment>\n                    )}\n                    {collectionConfig.disableDuplicate !== true && isEditing && (\n                      <>\n                        <DuplicateDocument\n                          id={id}\n                          onDuplicate={onDuplicate}\n                          redirectAfterDuplicate={redirectAfterDuplicate}\n                          singularLabel={collectionConfig?.labels?.singular}\n                          slug={collectionConfig?.slug}\n                        />\n                        {localization && (\n                          <DuplicateDocument\n                            id={id}\n                            onDuplicate={onDuplicate}\n                            redirectAfterDuplicate={redirectAfterDuplicate}\n                            selectLocales={true}\n                            singularLabel={collectionConfig?.labels?.singular}\n                            slug={collectionConfig?.slug}\n                          />\n                        )}\n                      </>\n                    )}\n                  </React.Fragment>\n                )}\n                {hasDeletePermission && (\n                  <DeleteDocument\n                    buttonId=\"action-delete\"\n                    collectionSlug={collectionConfig?.slug}\n                    id={id.toString()}\n                    onDelete={onDelete}\n                    redirectAfterDelete={redirectAfterDelete}\n                    singularLabel={collectionConfig?.labels?.singular}\n                    useAsTitle={collectionConfig?.admin?.useAsTitle}\n                  />\n                )}\n                {EditMenuItems}\n              </PopupList.ButtonGroup>\n            </Popup>\n          )}\n        </div>\n      </div>\n      <div className={`${baseClass}__divider`} />\n    </Gutter>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/DocumentControls/index.scss

@@ -0,0 +1,257 @@
+@import '../../scss/styles.scss';
+
+@layer payload-default {
+  .doc-controls {
+    @include blur-bg-light;
+    position: sticky;
+    top: 0;
+    width: 100%;
+    z-index: 5;
+    display: flex;
+    align-items: center;
+
+    &__divider {
+      content: '';
+      display: block;
+      position: absolute;
+      height: 1px;
+      background: var(--theme-elevation-100);
+      width: 100%;
+      left: 0;
+      top: 100%;
+    }
+
+    &__wrapper {
+      position: relative;
+      width: 100%;
+      display: flex;
+      align-items: space-between;
+      gap: var(--base);
+      padding-bottom: 1px;
+      z-index: 4;
+      height: var(--doc-controls-height);
+    }
+
+    &__content {
+      display: flex;
+      align-items: center;
+      flex-grow: 1;
+      overflow: hidden;
+      padding: base(0.8) 0;
+      gap: calc(var(--base) * 0.5);
+    }
+
+    &__meta-icons {
+      display: flex;
+      align-items: center;
+      gap: calc(var(--base) * 0.2);
+      flex-shrink: 0;
+    }
+
+    &__meta {
+      flex-grow: 1;
+      display: flex;
+      list-style: none;
+      padding: 0;
+      gap: var(--base);
+      margin: 0;
+      width: 100%;
+
+      & button {
+        margin: 0;
+      }
+    }
+
+    &__locked-controls.locked {
+      position: unset;
+
+      .tooltip {
+        top: calc(var(--base) * -0.5);
+      }
+    }
+
+    &__list-item {
+      display: flex;
+      align-items: center;
+      margin: 0;
+    }
+
+    &__value-wrap {
+      overflow: hidden;
+    }
+
+    &__value {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      margin: 0;
+      font-weight: 600;
+      line-height: base(1.2);
+    }
+
+    &__label {
+      color: var(--theme-elevation-500);
+      white-space: nowrap;
+      margin: 0;
+    }
+
+    &__controls-wrapper {
+      --controls-gap: calc(var(--base) / 2);
+      --dot-button-width: calc(var(--base) * 2);
+      display: flex;
+      align-items: center;
+      margin: 0;
+      gap: var(--controls-gap);
+      position: relative;
+    }
+
+    &__controls {
+      display: flex;
+      align-items: center;
+      margin: 0;
+      gap: calc(var(--base) / 2);
+
+      button {
+        margin: 0;
+        white-space: nowrap;
+      }
+    }
+
+    &__dots {
+      margin: 0;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      flex-direction: column;
+      gap: 2px;
+      border: 1px solid var(--theme-elevation-100);
+      border-radius: $style-radius-m;
+      height: calc(var(--base) * 1.6);
+      width: calc(var(--base) * 1.6);
+
+      &:hover {
+        border: 1px solid var(--theme-elevation-500);
+        background-color: var(--theme-elevation-100);
+      }
+
+      > div {
+        width: 3px;
+        height: 3px;
+        border-radius: 100%;
+        background-color: currentColor;
+      }
+    }
+
+    &__popup {
+      position: relative;
+    }
+
+    .popup--active {
+      .doc-controls {
+        &__dots {
+          border: 1px solid var(--theme-elevation-500);
+          background-color: var(--theme-elevation-100);
+        }
+      }
+    }
+
+    .popup__trigger-wrap {
+      display: flex;
+    }
+
+    @include mid-break {
+      // On mobile, only stick the controls to the top
+      // The timestamps and meta can scroll past
+      // The same container needs to the sticky, though
+      // So we use a static height with a negative top equal to the meta height plus top padding
+      &.gutter {
+        top: base(-2.8);
+        padding-right: 0;
+        padding-left: 0;
+      }
+
+      &__wrapper {
+        flex-direction: column;
+        gap: 0;
+        height: unset;
+      }
+
+      &__content {
+        width: 100%;
+        overflow: auto;
+        padding-inline: base(2);
+        // this container has a fixed height
+        // this means the scrollbar (when present) overlaps the content
+        &::-webkit-scrollbar {
+          display: none;
+        }
+      }
+
+      &__popup {
+        [dir='rtl'] & {
+          padding-left: var(--gutter-h);
+        }
+      }
+
+      &__meta {
+        width: auto;
+        gap: calc(var(--base) / 2);
+
+        &::after {
+          content: '';
+          display: block;
+          position: absolute;
+          right: 0;
+          width: base(0.8);
+          height: var(--base);
+          background: linear-gradient(to right, transparent, var(--theme-bg));
+          flex-shrink: 0;
+          z-index: 1111;
+          pointer-events: none;
+        }
+      }
+
+      &__controls-wrapper {
+        background-color: var(--theme-bg);
+        width: 100%;
+        transform: translate3d(0, 0, 0);
+        padding-right: var(--gutter-h);
+        justify-content: space-between;
+        height: var(--doc-controls-height);
+        border-top: 1px solid var(--theme-elevation-100);
+      }
+
+      &__controls {
+        [dir='ltr'] & {
+          padding-left: var(--gutter-h);
+        }
+        overflow: auto;
+
+        // do not show scrollbar because the parent container has a static height
+        // this container has a gradient overlay as visual indication of `overflow: scroll`
+        &::-webkit-scrollbar {
+          display: none;
+        }
+
+        &::after {
+          content: '';
+          display: block;
+          position: sticky;
+          right: 0;
+          width: calc(var(--base) * 2);
+          height: calc(var(--base) * 1.5);
+          background: linear-gradient(to right, transparent, var(--theme-bg));
+          flex-shrink: 0;
+          z-index: 1111;
+          pointer-events: none;
+        }
+      }
+    }
+
+    @include small-break {
+      &__content {
+        padding-inline: base(0.8);
+      }
+    }
+  }
+}

package/dist/elements/DocumentDrawer/DrawerContent.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import type { DocumentDrawerProps } from './types.js';
+export declare const DocumentDrawerContent: React.FC<DocumentDrawerProps>;
+//# sourceMappingURL=DrawerContent.d.ts.map

package/dist/elements/DocumentDrawer/DrawerContent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DrawerContent.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentDrawer/DrawerContent.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAmD,MAAM,OAAO,CAAA;AAGvE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAA;AAUrD,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAwK/D,CAAA"}