@wordpress/block-editor/build-module/components/block-navigation/tree.js

Generic block editor.

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

/**
 * WordPress dependencies
 */
import { __experimentalTreeGrid as TreeGrid } from '@wordpress/components';
import { useEffect, useMemo, useRef } from '@wordpress/element';
import { __ } from '@wordpress/i18n';
/**
 * Internal dependencies
 */

import BlockNavigationBranch from './branch';
import { BlockNavigationContext } from './context';
import useBlockNavigationDropZone from './use-block-navigation-drop-zone';
/**
 * Wrap `BlockNavigationRows` with `TreeGrid`. BlockNavigationRows is a
 * recursive component (it renders itself), so this ensures TreeGrid is only
 * present at the very top of the navigation grid.
 *
 * @param {Object}  props                                          Components props.
 * @param {boolean} props.__experimentalFeatures                   Flag to enable experimental features.
 * @param {boolean} props.__experimentalPersistentListViewFeatures Flag to enable features for the Persistent List View experiment.
 */

export default function BlockNavigationTree({
  __experimentalFeatures,
  __experimentalPersistentListViewFeatures,
  ...props
}) {
  let {
    ref: treeGridRef,
    target: blockDropTarget
  } = useBlockNavigationDropZone();
  const isMounted = useRef(false);
  useEffect(() => {
    isMounted.current = true;
  }, []);

  if (!__experimentalFeatures) {
    blockDropTarget = undefined;
  }

  const contextValue = useMemo(() => ({
    __experimentalFeatures,
    __experimentalPersistentListViewFeatures,
    blockDropTarget,
    isTreeGridMounted: isMounted.current
  }), [__experimentalFeatures, __experimentalPersistentListViewFeatures, blockDropTarget, isMounted.current]);
  return createElement(TreeGrid, {
    className: "block-editor-block-navigation-tree",
    "aria-label": __('Block navigation structure'),
    ref: treeGridRef
  }, createElement(BlockNavigationContext.Provider, {
    value: contextValue
  }, createElement(BlockNavigationBranch, props)));
}
//# sourceMappingURL=tree.js.map