@wordpress/block-library/build-module/navigation/edit/menu-inspector-controls.js

Block library for the WordPress editor.

// packages/block-library/src/navigation/edit/menu-inspector-controls.js
import {
  privateApis as blockEditorPrivateApis,
  InspectorControls,
  store as blockEditorStore
} from "@wordpress/block-editor";
import {
  PanelBody,
  __experimentalHStack as HStack,
  __experimentalHeading as Heading,
  Spinner
} from "@wordpress/components";
import { useSelect, useDispatch } from "@wordpress/data";
import { __, sprintf } from "@wordpress/i18n";
import NavigationMenuSelector from "./navigation-menu-selector";
import { unlock } from "../../lock-unlock";
import DeletedNavigationWarning from "./deleted-navigation-warning";
import useNavigationMenu from "../use-navigation-menu";
import LeafMoreMenu from "./leaf-more-menu";
import {
  LinkUI,
  updateAttributes,
  useEntityBinding
} from "../../navigation-link/shared";
import { jsx, jsxs } from "react/jsx-runtime";
var actionLabel = (
  /* translators: %s: The name of a menu. */
  __("Switch to '%s'")
);
var BLOCKS_WITH_LINK_UI_SUPPORT = [
  "core/navigation-link",
  "core/navigation-submenu"
];
var { PrivateListView } = unlock(blockEditorPrivateApis);
function AdditionalBlockContent({ block, insertedBlock, setInsertedBlock }) {
  const { updateBlockAttributes, removeBlock } = useDispatch(blockEditorStore);
  const supportsLinkControls = BLOCKS_WITH_LINK_UI_SUPPORT?.includes(
    insertedBlock?.name
  );
  const blockWasJustInserted = insertedBlock?.clientId === block.clientId;
  const showLinkControls = supportsLinkControls && blockWasJustInserted;
  const { createBinding, clearBinding } = useEntityBinding({
    clientId: insertedBlock?.clientId,
    attributes: insertedBlock?.attributes || {}
  });
  if (!showLinkControls) {
    return null;
  }
  const cleanupInsertedBlock = () => {
    const shouldAutoSelectBlock = false;
    if (!insertedBlock?.attributes?.url && insertedBlock?.clientId) {
      removeBlock(insertedBlock.clientId, shouldAutoSelectBlock);
    }
    setInsertedBlock(null);
  };
  const setInsertedBlockAttributes = (_insertedBlockClientId) => (_updatedAttributes) => {
    if (!_insertedBlockClientId) {
      return;
    }
    updateBlockAttributes(_insertedBlockClientId, _updatedAttributes);
  };
  const handleSetInsertedBlock = (newBlock) => {
    const shouldAutoSelectBlock = false;
    if (insertedBlock?.clientId && newBlock) {
      removeBlock(insertedBlock.clientId, shouldAutoSelectBlock);
    }
    setInsertedBlock(newBlock);
  };
  return /* @__PURE__ */ jsx(
    LinkUI,
    {
      clientId: insertedBlock?.clientId,
      link: insertedBlock?.attributes,
      onBlockInsert: handleSetInsertedBlock,
      onClose: () => {
        cleanupInsertedBlock();
      },
      onChange: (updatedValue) => {
        const { isEntityLink, attributes: updatedAttributes } = updateAttributes(
          updatedValue,
          setInsertedBlockAttributes(insertedBlock?.clientId),
          insertedBlock?.attributes
        );
        if (isEntityLink) {
          createBinding(updatedAttributes);
        } else {
          clearBinding();
        }
        setInsertedBlock(null);
      }
    }
  );
}
var MainContent = ({
  clientId,
  currentMenuId,
  isLoading,
  isNavigationMenuMissing,
  onCreateNew
}) => {
  const hasChildren = useSelect(
    (select) => {
      return !!select(blockEditorStore).getBlockCount(clientId);
    },
    [clientId]
  );
  const { navigationMenu } = useNavigationMenu(currentMenuId);
  if (currentMenuId && isNavigationMenuMissing) {
    return /* @__PURE__ */ jsx(DeletedNavigationWarning, { onCreateNew, isNotice: true });
  }
  if (isLoading) {
    return /* @__PURE__ */ jsx(Spinner, {});
  }
  const description = navigationMenu ? sprintf(
    /* translators: %s: The name of a menu. */
    __("Structure for Navigation Menu: %s"),
    navigationMenu?.title || __("Untitled menu")
  ) : __(
    "You have not yet created any menus. Displaying a list of your Pages"
  );
  return /* @__PURE__ */ jsxs("div", { className: "wp-block-navigation__menu-inspector-controls", children: [
    !hasChildren && /* @__PURE__ */ jsx("p", { className: "wp-block-navigation__menu-inspector-controls__empty-message", children: __("This Navigation Menu is empty.") }),
    /* @__PURE__ */ jsx(
      PrivateListView,
      {
        rootClientId: clientId,
        isExpanded: true,
        description,
        showAppender: true,
        blockSettingsMenu: LeafMoreMenu,
        additionalBlockContent: AdditionalBlockContent
      }
    )
  ] });
};
var MenuInspectorControls = (props) => {
  const {
    createNavigationMenuIsSuccess,
    createNavigationMenuIsError,
    currentMenuId = null,
    onCreateNew,
    onSelectClassicMenu,
    onSelectNavigationMenu,
    isManageMenusButtonDisabled,
    blockEditingMode
  } = props;
  return /* @__PURE__ */ jsx(InspectorControls, { group: "list", children: /* @__PURE__ */ jsxs(PanelBody, { title: null, children: [
    /* @__PURE__ */ jsxs(HStack, { className: "wp-block-navigation-off-canvas-editor__header", children: [
      /* @__PURE__ */ jsx(
        Heading,
        {
          className: "wp-block-navigation-off-canvas-editor__title",
          level: 2,
          children: __("Menu")
        }
      ),
      blockEditingMode === "default" && /* @__PURE__ */ jsx(
        NavigationMenuSelector,
        {
          currentMenuId,
          onSelectClassicMenu,
          onSelectNavigationMenu,
          onCreateNew,
          createNavigationMenuIsSuccess,
          createNavigationMenuIsError,
          actionLabel,
          isManageMenusButtonDisabled
        }
      )
    ] }),
    /* @__PURE__ */ jsx(MainContent, { ...props })
  ] }) });
};
var menu_inspector_controls_default = MenuInspectorControls;
export {
  menu_inspector_controls_default as default
};
//# sourceMappingURL=menu-inspector-controls.js.map