@wordpress/editor/build-module/components/post-publish-panel/index.mjs

Enhanced block editor for WordPress posts.

// packages/editor/src/components/post-publish-panel/index.js
import { __ } from "@wordpress/i18n";
import { useEffect, useRef } from "@wordpress/element";
import { Button, Spinner, CheckboxControl } from "@wordpress/components";
import { useSelect, useDispatch } from "@wordpress/data";
import {
  useConstrainedTabbing,
  useEvent,
  useFocusReturn,
  useMergeRefs
} from "@wordpress/compose";
import { closeSmall } from "@wordpress/icons";
import { store as coreStore } from "@wordpress/core-data";
import PostPublishButton from "../post-publish-button/index.mjs";
import PostPublishPanelPrepublish from "./prepublish.mjs";
import PostPublishPanelPostpublish from "./postpublish.mjs";
import { store as editorStore } from "../../store/index.mjs";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
function PostPublishPanel({
  forceIsDirty,
  onClose,
  PostPublishExtension,
  PrePublishExtension,
  ...propsForPanel
}) {
  const {
    hasPublishAction,
    isPostTypeViewable,
    isBeingScheduled,
    isDirty,
    isPublished,
    isPublishSidebarEnabled,
    isSaving,
    isSavingNonPostEntityChanges,
    isScheduled,
    currentPostId
  } = useSelect((select) => {
    const { getPostType } = select(coreStore);
    const {
      getCurrentPost,
      getCurrentPostId,
      getEditedPostAttribute,
      isCurrentPostPublished,
      isCurrentPostScheduled,
      isEditedPostBeingScheduled,
      isEditedPostDirty,
      isAutosavingPost,
      isSavingPost,
      isSavingNonPostEntityChanges: _isSavingNonPostEntityChanges,
      isPublishSidebarEnabled: _isPublishSidebarEnabled
    } = select(editorStore);
    const postType = getPostType(getEditedPostAttribute("type"));
    return {
      hasPublishAction: getCurrentPost()._links?.["wp:action-publish"] ?? false,
      isPostTypeViewable: postType?.viewable,
      isBeingScheduled: isEditedPostBeingScheduled(),
      isDirty: isEditedPostDirty(),
      isPublished: isCurrentPostPublished(),
      isPublishSidebarEnabled: _isPublishSidebarEnabled(),
      isSaving: isSavingPost() && !isAutosavingPost(),
      isSavingNonPostEntityChanges: _isSavingNonPostEntityChanges(),
      isScheduled: isCurrentPostScheduled(),
      currentPostId: getCurrentPostId()
    };
  }, []);
  const { disablePublishSidebar, enablePublishSidebar } = useDispatch(editorStore);
  const cancelButtonRef = useRef(null);
  const wrapperRef = useMergeRefs([
    useFocusReturn(),
    useConstrainedTabbing()
  ]);
  useEffect(() => {
    cancelButtonRef.current?.focus();
  }, []);
  const prevPostIdRef = useRef(currentPostId);
  const stableOnClose = useEvent(onClose);
  useEffect(() => {
    const postChanged = currentPostId !== prevPostIdRef.current;
    prevPostIdRef.current = currentPostId;
    if (postChanged || isPublished && !isSaving && isDirty) {
      stableOnClose();
    }
  }, [isPublished, isSaving, isDirty, currentPostId, stableOnClose]);
  function onTogglePublishSidebar() {
    if (isPublishSidebarEnabled) {
      disablePublishSidebar();
    } else {
      enablePublishSidebar();
    }
  }
  function onSubmit() {
    if (!hasPublishAction || !isPostTypeViewable) {
      onClose();
    }
  }
  const isPublishedOrScheduled = isPublished || isScheduled && isBeingScheduled;
  const isPrePublish = !isPublishedOrScheduled && !isSaving;
  const isPostPublish = isPublishedOrScheduled && !isSaving;
  return /* @__PURE__ */ jsxs(
    "div",
    {
      ref: wrapperRef,
      tabIndex: -1,
      className: "editor-post-publish-panel",
      ...propsForPanel,
      children: [
        /* @__PURE__ */ jsx("div", { className: "editor-post-publish-panel__header", children: isPostPublish ? /* @__PURE__ */ jsx(
          Button,
          {
            size: "compact",
            onClick: onClose,
            icon: closeSmall,
            label: __("Close panel")
          }
        ) : /* @__PURE__ */ jsxs(Fragment, { children: [
          /* @__PURE__ */ jsx("div", { className: "editor-post-publish-panel__header-cancel-button", children: /* @__PURE__ */ jsx(
            Button,
            {
              ref: cancelButtonRef,
              accessibleWhenDisabled: true,
              disabled: isSavingNonPostEntityChanges,
              onClick: onClose,
              variant: "secondary",
              size: "compact",
              children: __("Cancel")
            }
          ) }),
          /* @__PURE__ */ jsx("div", { className: "editor-post-publish-panel__header-publish-button", children: /* @__PURE__ */ jsx(
            PostPublishButton,
            {
              onSubmit,
              forceIsDirty
            }
          ) })
        ] }) }),
        /* @__PURE__ */ jsxs("div", { className: "editor-post-publish-panel__content", children: [
          isPrePublish && /* @__PURE__ */ jsx(PostPublishPanelPrepublish, { children: PrePublishExtension && /* @__PURE__ */ jsx(PrePublishExtension, {}) }),
          isPostPublish && /* @__PURE__ */ jsx(PostPublishPanelPostpublish, { focusOnMount: true, children: PostPublishExtension && /* @__PURE__ */ jsx(PostPublishExtension, {}) }),
          isSaving && /* @__PURE__ */ jsx(Spinner, {})
        ] }),
        /* @__PURE__ */ jsx("div", { className: "editor-post-publish-panel__footer", children: /* @__PURE__ */ jsx(
          CheckboxControl,
          {
            label: __("Always show pre-publish checks."),
            checked: isPublishSidebarEnabled,
            onChange: onTogglePublishSidebar
          }
        ) })
      ]
    }
  );
}
export {
  PostPublishPanel as default
};
//# sourceMappingURL=index.mjs.map