Skip to content

Commit

Permalink
added README for the "caption" component (#52033)
Browse files Browse the repository at this point in the history
* added README for the caption component

* Minor adjustments

* removed unnecesary space
  • Loading branch information
juanmaguitar authored Jul 10, 2023
1 parent 9baa061 commit 7318f11
Showing 1 changed file with 49 additions and 0 deletions.
49 changes: 49 additions & 0 deletions packages/block-editor/src/components/caption/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,49 @@
## Caption

The `Caption` component renders the [caption part](https://wordpress.org/documentation/article/gallery-block/#caption) of some blocks (image, gallery...).

This component encapsulates the "caption" behaviour and styles over a `<RichText>` so it can be used in other components such as the `BlockCaption` component.

## Table of contents

1. [Development guidelines](#development-guidelines)
2. [Related components](#related-components)

## Development guidelines

### Usage

Renders a Caption area:

```jsx
import { Caption } from '@wordpress/block-editor';
const BlockCaption = ( {
onBlur,
onChange,
onFocus,
isSelected,
shouldDisplay,
text,
insertBlocksAfter,
} ) => (
<View >
<Caption
isSelected={ isSelected }
onBlur={ onBlur }
onChange={ onChange }
onFocus={ onFocus }
shouldDisplay={ shouldDisplay }
value={ text }
insertBlocksAfter={ insertBlocksAfter }
/>
</View>
);
```

### Props

The properties `isSelected`, `onBlur`, `onChange`, `onFocus`, `shouldDisplay`, `value`, `insertBlocksAfter` of this component are passed directly to their related props of its inner `<RichText>` component ([see detailed info about the RichText component's props](https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/rich-text/README.md)).

## Related components

Caption components is mostly used by the [`BlockCaption`](https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-caption) component.

1 comment on commit 7318f11

@github-actions
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Flaky tests detected in 7318f11.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/5510440036
📝 Reported issues:

Please sign in to comment.