@wordpress/block-editor/build/components/block-navigation/branch.js

Generic block editor.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = BlockNavigationBranch;

var _element = require("@wordpress/element");

var _lodash = require("lodash");

var _block = _interopRequireDefault(require("./block"));

var _appender = _interopRequireDefault(require("./appender"));

var _utils = require("./utils");

/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */
function BlockNavigationBranch(props) {
  const {
    blocks,
    selectBlock,
    selectedBlockClientIds,
    showAppender,
    showBlockMovers,
    showNestedBlocks,
    parentBlockClientId,
    level = 1,
    terminatedLevels = [],
    path = [],
    isBranchSelected = false,
    isLastOfBranch = false
  } = props;
  const isTreeRoot = !parentBlockClientId;
  const filteredBlocks = (0, _lodash.compact)(blocks);

  const itemHasAppender = parentClientId => showAppender && !isTreeRoot && (0, _utils.isClientIdSelected)(parentClientId, selectedBlockClientIds);

  const hasAppender = itemHasAppender(parentBlockClientId); // Add +1 to the rowCount to take the block appender into account.

  const blockCount = filteredBlocks.length;
  const rowCount = hasAppender ? blockCount + 1 : blockCount;
  const appenderPosition = rowCount;
  return (0, _element.createElement)(_element.Fragment, null, (0, _lodash.map)(filteredBlocks, (block, index) => {
    const {
      clientId,
      innerBlocks
    } = block;
    const position = index + 1;
    const isLastRowAtLevel = rowCount === position;
    const updatedTerminatedLevels = isLastRowAtLevel ? [...terminatedLevels, level] : terminatedLevels;
    const updatedPath = [...path, position];
    const hasNestedBlocks = showNestedBlocks && !!innerBlocks && !!innerBlocks.length;
    const hasNestedAppender = itemHasAppender(clientId);
    const hasNestedBranch = hasNestedBlocks || hasNestedAppender;
    const isSelected = (0, _utils.isClientIdSelected)(clientId, selectedBlockClientIds);
    const isSelectedBranch = isBranchSelected || isSelected && hasNestedBranch; // Logic needed to target the last item of a selected branch which might be deeply nested.
    // This is currently only needed for styling purposes. See: `.is-last-of-selected-branch`.

    const isLastBlock = index === blockCount - 1;
    const isLast = isSelected || isLastOfBranch && isLastBlock;
    const isLastOfSelectedBranch = isLastOfBranch && !hasNestedBranch && isLastBlock;
    return (0, _element.createElement)(_element.Fragment, {
      key: clientId
    }, (0, _element.createElement)(_block.default, {
      block: block,
      onClick: selectBlock,
      isSelected: isSelected,
      isBranchSelected: isSelectedBranch,
      isLastOfSelectedBranch: isLastOfSelectedBranch,
      level: level,
      position: position,
      rowCount: rowCount,
      siblingBlockCount: blockCount,
      showBlockMovers: showBlockMovers,
      terminatedLevels: terminatedLevels,
      path: updatedPath
    }), hasNestedBranch && (0, _element.createElement)(BlockNavigationBranch, {
      blocks: innerBlocks,
      selectedBlockClientIds: selectedBlockClientIds,
      selectBlock: selectBlock,
      isBranchSelected: isSelectedBranch,
      isLastOfBranch: isLast,
      showAppender: showAppender,
      showBlockMovers: showBlockMovers,
      showNestedBlocks: showNestedBlocks,
      parentBlockClientId: clientId,
      level: level + 1,
      terminatedLevels: updatedTerminatedLevels,
      path: updatedPath
    }));
  }), hasAppender && (0, _element.createElement)(_appender.default, {
    parentBlockClientId: parentBlockClientId,
    position: rowCount,
    rowCount: appenderPosition,
    level: level,
    terminatedLevels: terminatedLevels,
    path: [...path, appenderPosition]
  }));
}

BlockNavigationBranch.defaultProps = {
  selectBlock: () => {}
};
//# sourceMappingURL=branch.js.map