Add/block breadcrumb component readme

[JustinyAhin]

Description

Added documentation for the block breadcrumb component (see #22891)

How has this been tested?

N/A, documentation only

Types of changes

Documentation

Checklist:

• [n/a] My code is tested.
• [n/a] My code follows the WordPress code style.
• [n/a] My code follows the accessibility standards.
• [n/a] My code has proper inline documentation.
• I've included developer documentation if appropriate.
• I've updated all React Native files affected by any refactorings/renamings in this PR.

[youknowriad]

I think most components in the block-editor package including this one need to be embedded in the React tree under BlockEditorProvider. I wonder if it's worth mentioning in the READMEs of the different components or not.

[mkaz]

Yes, I think we should include in each example, because a developer may approach any page without seeing others, the more we can do to make the examples "just work" when copy-and-paste the better.

The example could be just updated to, if you want to include the <div> it'd be fine too, but probably not necessary.

import { 
  BlockBreadcrumb,
  BlockEditorProvider  } from '@wordpress/block-editor';

<BlockEditorProvider>
    <BlockBreadcrumb/>
</BlockEditorProvider>

[youknowriad]

That's not sufficient though because using BlockEditorProvider is more complex than that. Maybe we can link to its README?

[JustinyAhin]

Ok, just updated the example with BlockEditorProvider.
Is there anything thing else that should be added?

[JustinyAhin]

Maybe add something in a "Related components" section?

[youknowriad]

I personally think we should revert to your original code example but add a sentence like that somewhere:

Block Editor components are components that can be used to compose the UI of your block editor. Thus, they can only be used under a `BlockEditorProvider` in the components tree. 

and link the word BlockEditorProvider to its README.

[JustinyAhin]

✅

[mkaz]

Works for me. The BlockEditorProvider readme has a complete example 👍

[youknowriad]

This is bad code, it needs to be wrapper inside a function (component), we can't just use JSX top level like that.

[JustinyAhin]

something like
const MyBreadcrumb = () => <BlockBreadcrumb />; I guess.

I think I can also remove the div.

[youknowriad]

LGTM 👍