@wordpress/block-editor/build-module/components/block-tools/zoom-out-mode-inserters.js

Generic block editor.

import { createElement } from "@wordpress/element";

/**
 * WordPress dependencies
 */
import { useSelect } from '@wordpress/data';
import { useEffect, useState } from '@wordpress/element';
/**
 * Internal dependencies
 */

import BlockPopoverInbetween from '../block-popover/inbetween';
import { store as blockEditorStore } from '../../store';
import Inserter from '../inserter';

function ZoomOutModeInserters({
  __unstableContentRef
}) {
  const [isReady, setIsReady] = useState(false);
  const blockOrder = useSelect(select => {
    return select(blockEditorStore).getBlockOrder();
  }, []); // Defer the initial rendering to avoid the jumps due to the animation.

  useEffect(() => {
    const timeout = setTimeout(() => {
      setIsReady(true);
    }, 500);
    return () => {
      clearTimeout(timeout);
    };
  }, []);

  if (!isReady) {
    return null;
  }

  return blockOrder.map((clientId, index) => {
    if (index === blockOrder.length - 1) {
      return null;
    }

    return createElement(BlockPopoverInbetween, {
      key: clientId,
      previousClientId: clientId,
      nextClientId: blockOrder[index + 1],
      __unstableContentRef: __unstableContentRef
    }, createElement("div", {
      className: "block-editor-block-list__insertion-point-inserter is-with-inserter"
    }, createElement(Inserter, {
      position: "bottom center",
      clientId: blockOrder[index + 1],
      __experimentalIsQuick: true
    })));
  });
}

export default ZoomOutModeInserters;
//# sourceMappingURL=zoom-out-mode-inserters.js.map