-
Notifications
You must be signed in to change notification settings - Fork 4.2k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Add/block icon component readme (#24947)
* Draft block icon component readme * Update block icon component readme * Update block icon component readme * Update BlockIcon component code sample * Update BlockIcon component code sample * Update JSX code sample
- Loading branch information
1 parent
25e6ae3
commit 0397f87
Showing
1 changed file
with
29 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,29 @@ | ||
# Block Icon | ||
|
||
The BlockIcon component provides an icon for blocks in different places in the editor: the toolbar of a selected block, the placeholders of certain blocks (gallery, image), the block insertion panel of the editor or the left sidebar. | ||
|
||
The rendered an [Icon](https://github.com/WordPress/gutenberg/tree/master/packages/components/src/icon) component with default styles. | ||
|
||
![Image block icons in various places](https://make.wordpress.org/core/files/2020/08/image-block-icons-in-various-places.png) | ||
|
||
## Table of contents | ||
|
||
1. [Development guidelines](#development-guidelines) | ||
2. [Related components](#related-components) | ||
|
||
|
||
## Development guidelines | ||
|
||
### Usage | ||
|
||
Renders a block icon with default style. | ||
|
||
```jsx | ||
import { BlockIcon } from '@wordpress/block-editor'; | ||
|
||
const MyBlockIcon = () => <BlockIcon icon={ icon } /> | ||
``` | ||
|
||
## Related components | ||
|
||
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`](https://github.com/WordPress/gutenberg/blob/master/packages/block-editor/src/components/provider/README.md) in the components tree. |