From 7e9e53d0581e8f21ad029fb3ffd03f43680326b1 Mon Sep 17 00:00:00 2001 From: Manzoor Wani Date: Mon, 25 Nov 2024 02:11:31 -0800 Subject: [PATCH 01/23] Fix TS types for the editor package (#67196) * Replace the wrong Component type with React Node/Element * Replace the wrong Component type with React Node/Element * Fix the optional params for store actions * Replace the deprecated JSX.Element with React.ReactNode * Update docs * Fix children prop for multiple components --- .../reference-guides/data/data-core-editor.md | 11 +- packages/editor/README.md | 192 +++++++++--------- .../plugin-block-settings-menu-item.js | 2 +- .../components/collab-sidebar/add-comment.js | 2 +- .../collab-sidebar/comment-author-info.js | 2 +- .../components/collab-sidebar/comment-form.js | 2 +- .../src/components/collab-sidebar/comments.js | 4 +- .../src/components/document-bar/index.js | 2 +- .../src/components/document-outline/check.js | 6 +- .../src/components/document-outline/index.js | 2 +- .../src/components/editor-history/redo.js | 2 +- .../src/components/editor-history/undo.js | 2 +- .../src/components/editor-notices/index.js | 2 +- .../src/components/editor-snackbars/index.js | 2 +- .../components/entities-saved-states/index.js | 4 +- .../src/components/page-attributes/check.js | 6 +- .../src/components/page-attributes/order.js | 2 +- .../src/components/page-attributes/panel.js | 2 +- .../src/components/page-attributes/parent.js | 2 +- .../plugin-document-setting-panel/index.js | 4 +- .../components/plugin-more-menu-item/index.js | 3 +- .../plugin-post-publish-panel/index.js | 4 +- .../plugin-post-status-info/index.js | 8 +- .../plugin-pre-publish-panel/index.js | 4 +- .../plugin-preview-menu-item/index.js | 3 +- .../plugin-sidebar-more-menu-item/index.js | 4 +- .../src/components/plugin-sidebar/index.js | 1 + .../src/components/post-author/check.js | 6 +- .../src/components/post-author/index.js | 2 +- .../src/components/post-author/panel.js | 2 +- .../src/components/post-comments/index.js | 2 +- .../src/components/post-discussion/panel.js | 2 +- .../src/components/post-excerpt/check.js | 6 +- .../src/components/post-excerpt/panel.js | 2 +- .../src/components/post-excerpt/plugin.js | 8 +- .../components/post-featured-image/check.js | 6 +- .../components/post-featured-image/panel.js | 2 +- .../src/components/post-format/check.js | 20 +- .../src/components/post-format/index.js | 2 +- .../src/components/post-format/panel.js | 2 +- .../components/post-last-revision/check.js | 6 +- .../components/post-last-revision/index.js | 2 +- .../components/post-last-revision/panel.js | 2 +- .../src/components/post-locked-modal/index.js | 2 +- .../components/post-pending-status/check.js | 6 +- .../components/post-pending-status/index.js | 2 +- .../components/post-preview-button/index.js | 2 +- .../src/components/post-schedule/check.js | 6 +- .../src/components/post-schedule/index.js | 2 +- .../src/components/post-schedule/label.js | 2 +- .../src/components/post-schedule/panel.js | 2 +- .../editor/src/components/post-slug/check.js | 6 +- .../editor/src/components/post-slug/index.js | 2 +- .../src/components/post-sticky/check.js | 6 +- .../src/components/post-sticky/index.js | 2 +- .../post-switch-to-draft-button/index.js | 2 +- .../src/components/post-sync-status/index.js | 2 +- .../src/components/post-taxonomies/check.js | 6 +- .../post-taxonomies/flat-term-selector.js | 2 +- .../src/components/post-taxonomies/panel.js | 27 +-- .../components/post-template/classic-theme.js | 4 +- .../src/components/post-template/panel.js | 2 +- .../src/components/post-text-editor/index.js | 2 +- .../editor/src/components/post-title/index.js | 2 +- .../components/post-title/post-title-raw.js | 2 +- .../editor/src/components/post-trash/check.js | 6 +- .../editor/src/components/post-trash/index.js | 2 +- .../post-type-support-check/index.js | 12 +- .../editor/src/components/post-url/check.js | 6 +- .../editor/src/components/post-url/index.js | 2 +- .../editor/src/components/post-url/label.js | 2 +- .../editor/src/components/post-url/panel.js | 2 +- .../src/components/post-visibility/check.js | 2 +- .../src/components/post-visibility/index.js | 2 +- .../editor/src/components/provider/index.js | 2 +- .../src/components/table-of-contents/index.js | 2 +- .../components/theme-support-check/index.js | 8 +- .../src/components/time-to-read/index.js | 2 +- .../unsaved-changes-warning/index.js | 2 +- .../editor/src/components/word-count/index.js | 2 +- packages/editor/src/store/actions.js | 19 +- 81 files changed, 260 insertions(+), 256 deletions(-) diff --git a/docs/reference-guides/data/data-core-editor.md b/docs/reference-guides/data/data-core-editor.md index 9567d8e4b954f..44078ab284e94 100644 --- a/docs/reference-guides/data/data-core-editor.md +++ b/docs/reference-guides/data/data-core-editor.md @@ -1148,7 +1148,8 @@ Action that autosaves the current post. This includes server-side autosaving (de _Parameters_ -- _options_ `Object?`: Extra flags to identify the autosave. +- _options_ `[Object]`: Extra flags to identify the autosave. +- _options.local_ `[boolean]`: Whether to perform a local autosave. ### clearSelectedBlock @@ -1204,7 +1205,7 @@ const getFeaturedMediaUrl = useSelect( ( select ) => { _Parameters_ - _edits_ `Object`: Post attributes to edit. -- _options_ `Object`: Options for the edit. +- _options_ `[Object]`: Options for the edit. _Returns_ @@ -1417,7 +1418,7 @@ Returns an action object used to signal that the blocks have been updated. _Parameters_ - _blocks_ `Array`: Block Array. -- _options_ `?Object`: Optional options. +- _options_ `[Object]`: Optional options. ### resetPost @@ -1431,7 +1432,7 @@ Action for saving the current post in the editor. _Parameters_ -- _options_ `Object`: +- _options_ `[Object]`: ### selectBlock @@ -1519,7 +1520,7 @@ _Parameters_ - _post_ `Object`: Post object. - _edits_ `Object`: Initial edited attributes object. -- _template_ `Array?`: Block Template. +- _template_ `[Array]`: Block Template. ### setupEditorState diff --git a/packages/editor/README.md b/packages/editor/README.md index bc00e15c8fb89..ac655bd1c99d8 100644 --- a/packages/editor/README.md +++ b/packages/editor/README.md @@ -270,7 +270,7 @@ _Parameters_ _Returns_ -- `JSX.Element`: The rendered DocumentBar component. +- `React.ReactNode`: The rendered DocumentBar component. ### DocumentOutline @@ -284,7 +284,7 @@ _Parameters_ _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### DocumentOutlineCheck @@ -293,11 +293,11 @@ Component check if there are any headings (core/heading blocks) present in the d _Parameters_ - _props_ `Object`: Props. -- _props.children_ `Element`: Children to be rendered. +- _props.children_ `React.ReactElement`: Children to be rendered. _Returns_ -- `Component|null`: The component to be rendered or null if there are headings. +- `React.ReactElement`: The component to be rendered or null if there are headings. ### EditorHistoryRedo @@ -310,7 +310,7 @@ _Parameters_ _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### EditorHistoryUndo @@ -323,7 +323,7 @@ _Parameters_ _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### EditorKeyboardShortcuts @@ -351,7 +351,7 @@ _Usage_ _Returns_ -- `JSX.Element`: The rendered EditorNotices component. +- `React.ReactNode`: The rendered EditorNotices component. ### EditorProvider @@ -383,7 +383,7 @@ _Parameters_ _Returns_ -- `JSX.Element`: The rendered EditorProvider component. +- `React.ReactNode`: The rendered EditorProvider component. ### EditorSnackbars @@ -391,7 +391,7 @@ Renders the editor snackbars component. _Returns_ -- `JSX.Element`: The rendered component. +- `React.ReactNode`: The rendered component. ### EntitiesSavedStates @@ -405,7 +405,7 @@ _Parameters_ _Returns_ -- `JSX.Element`: The rendered component. +- `React.ReactNode`: The rendered component. ### ErrorBoundary @@ -523,11 +523,11 @@ Wrapper component that renders its children only if the post type supports page _Parameters_ - _props_ `Object`: - The component props. -- _props.children_ `Element`: - The child components to render. +- _props.children_ `React.ReactElement`: - The child components to render. _Returns_ -- `Component|null`: The rendered child components or null if page attributes are not supported. +- `React.ReactElement`: The rendered child components or null if page attributes are not supported. ### PageAttributesOrder @@ -535,7 +535,7 @@ Renders the Page Attributes Order component. A number input in an editor interfa _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### PageAttributesPanel @@ -543,7 +543,7 @@ Renders the Page Attributes Panel component. _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### PageAttributesParent @@ -551,7 +551,7 @@ Renders the Page Attributes Parent component. A dropdown menu in an editor inter _Returns_ -- `Component|null`: The component to be rendered. Return null if post type is not hierarchical. +- `React.ReactNode`: The component to be rendered. Return null if post type is not hierarchical. ### PageTemplate @@ -561,7 +561,7 @@ The dropdown menu includes a button for toggling the menu, a list of available t _Returns_ -- `JSX.Element`: The rendered ClassicThemeControl component. +- `React.ReactNode`: The rendered ClassicThemeControl component. ### PanelColorSettings @@ -627,7 +627,7 @@ _Parameters_ _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### PluginDocumentSettingPanel @@ -684,11 +684,11 @@ _Parameters_ - _props.className_ `[string]`: An optional class name added to the row. - _props.title_ `[string]`: The title of the panel - _props.icon_ `[WPBlockTypeIconRender]`: The [Dashicon](https://developer.wordpress.org/resource/dashicons/) icon slug string, or an SVG WP element, to be rendered when the sidebar is pinned to toolbar. -- _props.children_ `Element`: Children to be rendered +- _props.children_ `React.ReactNode`: Children to be rendered _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The component to be rendered. ### PluginMoreMenuItem @@ -738,6 +738,7 @@ const MyButtonMoreMenuItem = () => ( _Parameters_ - _props_ `Object`: Component properties. +- _props.children_ `[React.ReactNode]`: Children to be rendered. - _props.href_ `[string]`: When `href` is provided then the menu item is represented as an anchor rather than button. It corresponds to the `href` attribute of the anchor. - _props.icon_ `[WPBlockTypeIconRender]`: The [Dashicon](https://developer.wordpress.org/resource/dashicons/) icon slug string, or an SVG WP element, to be rendered to the left of the menu item label. - _props.onClick_ `[Function]`: The callback function to be executed when the user clicks the menu item. @@ -745,7 +746,7 @@ _Parameters_ _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### PluginPostPublishPanel @@ -776,11 +777,11 @@ _Parameters_ - _props.title_ `[string]`: Title displayed at the top of the panel. - _props.initialOpen_ `[boolean]`: Whether to have the panel initially opened. When no title is provided it is always opened. - _props.icon_ `[WPBlockTypeIconRender]`: The [Dashicon](https://developer.wordpress.org/resource/dashicons/) icon slug string, or an SVG WP element, to be rendered when the sidebar is pinned to toolbar. -- _props.children_ `Element`: Children to be rendered +- _props.children_ `React.ReactNode`: Children to be rendered _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### PluginPostStatusInfo @@ -820,11 +821,11 @@ _Parameters_ - _props_ `Object`: Component properties. - _props.className_ `[string]`: An optional class name added to the row. -- _props.children_ `Element`: Children to be rendered. +- _props.children_ `React.ReactNode`: Children to be rendered. _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### PluginPrePublishPanel @@ -855,11 +856,11 @@ _Parameters_ - _props.title_ `[string]`: Title displayed at the top of the panel. - _props.initialOpen_ `[boolean]`: Whether to have the panel initially opened. When no title is provided it is always opened. - _props.icon_ `[WPBlockTypeIconRender]`: The [Dashicon](https://developer.wordpress.org/resource/dashicons/) icon slug string, or an SVG WP element, to be rendered when the sidebar is pinned to toolbar. -- _props.children_ `Element`: Children to be rendered +- _props.children_ `React.ReactNode`: Children to be rendered _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### PluginPreviewMenuItem @@ -889,6 +890,7 @@ registerPlugin( 'external-preview-menu-item', { _Parameters_ - _props_ `Object`: Component properties. +- _props.children_ `[React.ReactNode]`: Children to be rendered. - _props.href_ `[string]`: When `href` is provided, the menu item is rendered as an anchor instead of a button. It corresponds to the `href` attribute of the anchor. - _props.icon_ `[WPBlockTypeIconRender]`: The icon to be rendered to the left of the menu item label. Can be a Dashicon slug or an SVG WP element. - _props.onClick_ `[Function]`: The callback function to be executed when the user clicks the menu item. @@ -896,7 +898,7 @@ _Parameters_ _Returns_ -- `Component`: The rendered menu item component. +- `React.ReactNode`: The rendered menu item component. ### PluginSidebar @@ -953,6 +955,7 @@ _Parameters_ - _props_ `Object`: Element props. - _props.name_ `string`: A string identifying the sidebar. Must be unique for every sidebar registered within the scope of your plugin. +- _props.children_ `[React.ReactNode]`: Children to be rendered. - _props.className_ `[string]`: An optional class name added to the sidebar body. - _props.title_ `string`: Title displayed at the top of the sidebar. - _props.isPinnable_ `[boolean]`: Whether to allow to pin sidebar to the toolbar. When set to `true` it also automatically renders a corresponding menu item. @@ -999,11 +1002,12 @@ _Parameters_ - _props_ `Object`: Component props. - _props.target_ `string`: A string identifying the target sidebar you wish to be activated by this menu item. Must be the same as the `name` prop you have given to that sidebar. +- _props.children_ `[React.ReactNode]`: Children to be rendered. - _props.icon_ `[WPBlockTypeIconRender]`: The [Dashicon](https://developer.wordpress.org/resource/dashicons/) icon slug string, or an SVG WP element, to be rendered to the left of the menu item label. _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### PostAuthor @@ -1011,7 +1015,7 @@ Renders the component for selecting the post author. _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### PostAuthorCheck @@ -1020,11 +1024,11 @@ Wrapper component that renders its children only if the post type supports the a _Parameters_ - _props_ `Object`: The component props. -- _props.children_ `Element`: Children to be rendered. +- _props.children_ `React.ReactNode`: Children to be rendered. _Returns_ -- `Component|null`: The component to be rendered. Return `null` if the post type doesn't supports the author or if there are no authors available. +- `React.ReactNode`: The component to be rendered. Return `null` if the post type doesn't supports the author or if there are no authors available. ### PostAuthorPanel @@ -1032,7 +1036,7 @@ Renders the Post Author Panel component. _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### PostComments @@ -1040,7 +1044,7 @@ A form for managing comment status. _Returns_ -- `JSX.Element`: The rendered PostComments component. +- `React.ReactNode`: The rendered PostComments component. ### PostDiscussionPanel @@ -1048,7 +1052,7 @@ This component allows to update comment and pingback settings for the current po _Returns_ -- `JSX.Element|null`: The rendered PostDiscussionPanel component. +- `React.ReactNode`: The rendered PostDiscussionPanel component. ### PostExcerpt @@ -1067,11 +1071,11 @@ Component for checking if the post type supports the excerpt field. _Parameters_ - _props_ `Object`: Props. -- _props.children_ `Element`: Children to be rendered. +- _props.children_ `React.ReactNode`: Children to be rendered. _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### PostExcerptPanel @@ -1079,7 +1083,7 @@ Is rendered if the post type supports excerpts and allows editing the excerpt. _Returns_ -- `JSX.Element`: The rendered PostExcerptPanel component. +- `React.ReactNode`: The rendered PostExcerptPanel component. ### PostFeaturedImage @@ -1108,11 +1112,11 @@ Wrapper component that renders its children only if the post type supports a fea _Parameters_ - _props_ `Object`: Props. -- _props.children_ `Element`: Children to be rendered. +- _props.children_ `React.ReactNode`: Children to be rendered. _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### PostFeaturedImagePanel @@ -1125,7 +1129,7 @@ _Parameters_ _Returns_ -- `Component|null`: The component to be rendered. Return Null if the editor panel is disabled for featured image. +- `React.ReactNode`: The component to be rendered. Return Null if the editor panel is disabled for featured image. ### PostFormat @@ -1139,7 +1143,7 @@ _Usage_ _Returns_ -- `JSX.Element`: The rendered PostFormat component. +- `React.ReactNode`: The rendered PostFormat component. ### PostFormatCheck @@ -1148,11 +1152,11 @@ Component check if there are any post formats. _Parameters_ - _props_ `Object`: The component props. -- _props.children_ `Element`: The child elements to render. +- _props.children_ `React.ReactNode`: The child elements to render. _Returns_ -- `Component|null`: The rendered component or null if post formats are disabled. +- `React.ReactNode`: The rendered component or null if post formats are disabled. ### PostLastRevision @@ -1160,7 +1164,7 @@ Renders the component for displaying the last revision of a post. _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### PostLastRevisionCheck @@ -1169,11 +1173,11 @@ Wrapper component that renders its children if the post has more than one revisi _Parameters_ - _props_ `Object`: Props. -- _props.children_ `Element`: Children to be rendered. +- _props.children_ `React.ReactNode`: Children to be rendered. _Returns_ -- `Component|null`: Rendered child components if post has more than one revision, otherwise null. +- `React.ReactNode`: Rendered child components if post has more than one revision, otherwise null. ### PostLastRevisionPanel @@ -1181,7 +1185,7 @@ Renders the panel for displaying the last revision of a post. _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### PostLockedModal @@ -1189,7 +1193,7 @@ A modal component that is displayed when a post is locked for editing by another _Returns_ -- `JSX.Element|null`: The rendered PostLockedModal component. +- `React.ReactNode`: The rendered PostLockedModal component. ### PostPendingStatus @@ -1197,7 +1201,7 @@ A component for displaying and toggling the pending status of a post. _Returns_ -- `JSX.Element`: The rendered component. +- `React.ReactNode`: The rendered component. ### PostPendingStatusCheck @@ -1206,11 +1210,11 @@ This component checks the publishing status of the current post. If the post is _Parameters_ - _props_ `Object`: Component properties. -- _props.children_ `Element`: Children to be rendered. +- _props.children_ `React.ReactElement`: Children to be rendered. _Returns_ -- `JSX.Element|null`: The rendered child elements or null if the post is already published or the user doesn't have the capability to publish. +- `React.ReactElement`: The rendered child elements or null if the post is already published or the user doesn't have the capability to publish. ### PostPingbacks @@ -1231,7 +1235,7 @@ _Parameters_ _Returns_ -- `JSX.Element|null`: The rendered button component. +- `React.ReactNode`: The rendered button component. ### PostPublishButton @@ -1273,7 +1277,7 @@ _Parameters_ _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### PostScheduleCheck @@ -1282,11 +1286,11 @@ Wrapper component that renders its children only if post has a publish action. _Parameters_ - _props_ `Object`: Props. -- _props.children_ `Element`: Children to be rendered. +- _props.children_ `React.ReactElement`: Children to be rendered. _Returns_ -- `Component`: - The component to be rendered or null if there is no publish action. +- `React.ReactElement`: - The component to be rendered or null if there is no publish action. ### PostScheduleLabel @@ -1298,7 +1302,7 @@ _Parameters_ _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### PostSchedulePanel @@ -1306,7 +1310,7 @@ Renders the Post Schedule Panel component. _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### PostSlug @@ -1314,7 +1318,7 @@ Renders the PostSlug component. It provide a control for editing the post slug. _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### PostSlugCheck @@ -1323,11 +1327,11 @@ Wrapper component that renders its children only if the post type supports the s _Parameters_ - _props_ `Object`: Props. -- _props.children_ `Element`: Children to be rendered. +- _props.children_ `React.ReactNode`: Children to be rendered. _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### PostSticky @@ -1335,7 +1339,7 @@ Renders the PostSticky component. It provides a checkbox control for the sticky _Returns_ -- `Component`: The component to be rendered. +- `React.ReactNode`: The rendered component. ### PostStickyCheck @@ -1344,11 +1348,11 @@ Wrapper component that renders its children only if post has a sticky action. _Parameters_ - _props_ `Object`: Props. -- _props.children_ `Element`: Children to be rendered. +- _props.children_ `React.ReactElement`: Children to be rendered. _Returns_ -- `Component`: The component to be rendered or null if post type is not 'post' or hasStickyAction is false. +- `React.ReactElement`: The component to be rendered or null if post type is not 'post' or hasStickyAction is false. ### PostSwitchToDraftButton @@ -1356,7 +1360,7 @@ Renders a button component that allows the user to switch a post to draft status _Returns_ -- `JSX.Element`: The rendered component. +- `React.ReactNode`: The rendered component. ### PostSyncStatus @@ -1364,7 +1368,7 @@ Renders the sync status of a post. _Returns_ -- `JSX.Element|null`: The rendered sync status component. +- `React.ReactNode`: The rendered sync status component. ### PostTaxonomies @@ -1386,11 +1390,11 @@ Renders the children components only if the current post type has taxonomies. _Parameters_ - _props_ `Object`: The component props. -- _props.children_ `Element`: The children components to render. +- _props.children_ `React.ReactNode`: The children components to render. _Returns_ -- `Component|null`: The rendered children components or null if the current post type has no taxonomies. +- `React.ReactElement`: The rendered children components or null if the current post type has no taxonomies. ### PostTaxonomiesFlatTermSelector @@ -1404,7 +1408,7 @@ _Parameters_ _Returns_ -- `JSX.Element`: The rendered flat term selector component. +- `React.ReactNode`: The rendered flat term selector component. ### PostTaxonomiesHierarchicalTermSelector @@ -1421,17 +1425,11 @@ _Returns_ ### PostTaxonomiesPanel -Renders a panel for a specific taxonomy. - -_Parameters_ - -- _props_ `Object`: The component props. -- _props.taxonomy_ `Object`: The taxonomy object. -- _props.children_ `Element`: The child components. +Component that renders the post taxonomies panel. _Returns_ -- `Component`: The rendered taxonomy panel. +- `React.ReactNode`: The rendered component. ### PostTemplatePanel @@ -1439,7 +1437,7 @@ Displays the template controls based on the current editor settings and user per _Returns_ -- `JSX.Element|null`: The rendered PostTemplatePanel component. +- `React.ReactNode`: The rendered PostTemplatePanel component. ### PostTextEditor @@ -1447,7 +1445,7 @@ Displays the Post Text Editor along with content in Visual and Text mode. _Returns_ -- `JSX.Element|null`: The rendered PostTextEditor component. +- `React.ReactNode`: The rendered PostTextEditor component. ### PostTitle @@ -1460,7 +1458,7 @@ _Parameters_ _Returns_ -- `Component`: The rendered PostTitle component. +- `React.ReactNode`: The rendered PostTitle component. ### PostTitleRaw @@ -1476,7 +1474,7 @@ _Parameters_ _Returns_ -- `JSX.Element|null`: The rendered PostTrash component. +- `React.ReactNode`: The rendered PostTrash component. ### PostTrashCheck @@ -1485,11 +1483,11 @@ Wrapper component that renders its children only if the post can trashed. _Parameters_ - _props_ `Object`: - The component props. -- _props.children_ `Element`: - The child components to render. +- _props.children_ `React.ReactEl`: - The child components to render. _Returns_ -- `Component|null`: The rendered child components or null if the post can not trashed. +- `React.ReactElement`: The rendered child components or null if the post can not trashed. ### PostTypeSupportCheck @@ -1498,12 +1496,12 @@ A component which renders its own children only if the current editor post type _Parameters_ - _props_ `Object`: Props. -- _props.children_ `Element`: Children to be rendered if post type supports. +- _props.children_ `React.ReactElement`: Children to be rendered if post type supports. - _props.supportKeys_ `(string|string[])`: String or string array of keys to test. _Returns_ -- `Component`: The component to be rendered. +- `React.ReactElement`: The component to be rendered. ### PostURL @@ -1521,7 +1519,7 @@ _Parameters_ _Returns_ -- `Component`: The rendered PostURL component. +- `React.ReactNode`: The rendered PostURL component. ### PostURLCheck @@ -1530,11 +1528,11 @@ Check if the post URL is valid and visible. _Parameters_ - _props_ `Object`: The component props. -- _props.children_ `Element`: The child components. +- _props.children_ `React.ReactElement`: The child components. _Returns_ -- `Component|null`: The child components if the post URL is valid and visible, otherwise null. +- `React.ReactElement`: The child components if the post URL is valid and visible, otherwise null. ### PostURLLabel @@ -1542,7 +1540,7 @@ Represents a label component for a post URL. _Returns_ -- `Component`: The PostURLLabel component. +- `React.ReactNode`: The PostURLLabel component. ### PostURLPanel @@ -1550,7 +1548,7 @@ Renders the `PostURLPanel` component. _Returns_ -- `JSX.Element`: The rendered PostURLPanel component. +- `React.ReactNode`: The rendered PostURLPanel component. ### PostVisibility @@ -1563,7 +1561,7 @@ _Parameters_ _Returns_ -- `JSX.Element`: The rendered component. +- `React.ReactNode`: The rendered component. ### PostVisibilityCheck @@ -1576,7 +1574,7 @@ _Parameters_ _Returns_ -- `JSX.Element`: The rendered component. +- `React.ReactNode`: The rendered component. ### PostVisibilityLabel @@ -1663,7 +1661,7 @@ _Parameters_ _Returns_ -- `JSX.Element`: The rendered table of contents component. +- `React.ReactNode`: The rendered table of contents component. ### TextEditorGlobalKeyboardShortcuts @@ -1678,12 +1676,12 @@ Checks if the current theme supports specific features and renders the children _Parameters_ - _props_ `Object`: The component props. -- _props.children_ `Element`: The children to render if the theme supports the specified features. +- _props.children_ `React.ReactElement`: The children to render if the theme supports the specified features. - _props.supportKeys_ `string|string[]`: The key(s) of the theme support(s) to check. _Returns_ -- `JSX.Element|null`: The rendered children if the theme supports the specified features, otherwise null. +- `React.ReactElement`: The rendered children if the theme supports the specified features, otherwise null. ### TimeToRead @@ -1691,7 +1689,7 @@ Component for showing Time To Read in Content. _Returns_ -- `JSX.Element`: The rendered TimeToRead component. +- `React.ReactNode`: The rendered TimeToRead component. ### transformStyles @@ -1727,7 +1725,7 @@ Warns the user if there are unsaved changes before leaving the editor. Compatibl _Returns_ -- `Component`: The component. +- `React.ReactNode`: The component. ### URLInput @@ -1814,7 +1812,7 @@ Renders the word count of the post content. _Returns_ -- `JSX.Element|null`: The rendered WordCount component. +- `React.ReactNode`: The rendered WordCount component. ### WritingFlow diff --git a/packages/editor/src/components/block-settings-menu/plugin-block-settings-menu-item.js b/packages/editor/src/components/block-settings-menu/plugin-block-settings-menu-item.js index 59c9e9c32d4a4..df1e75d2d0e8b 100644 --- a/packages/editor/src/components/block-settings-menu/plugin-block-settings-menu-item.js +++ b/packages/editor/src/components/block-settings-menu/plugin-block-settings-menu-item.js @@ -76,7 +76,7 @@ const shouldRenderItem = ( selectedBlocks, allowedBlocks ) => * ); * ``` * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ const PluginBlockSettingsMenuItem = ( { allowedBlocks, diff --git a/packages/editor/src/components/collab-sidebar/add-comment.js b/packages/editor/src/components/collab-sidebar/add-comment.js index fce47e821e206..2330017ac5db5 100644 --- a/packages/editor/src/components/collab-sidebar/add-comment.js +++ b/packages/editor/src/components/collab-sidebar/add-comment.js @@ -22,7 +22,7 @@ import CommentForm from './comment-form'; * @param {Function} props.onSubmit - A callback function to be called when the user submits a comment. * @param {boolean} props.showCommentBoard - The function to edit the comment. * @param {Function} props.setShowCommentBoard - The function to delete the comment. - * @return {JSX.Element} The rendered comment input UI. + * @return {React.ReactNode} The rendered comment input UI. */ export function AddComment( { onSubmit, diff --git a/packages/editor/src/components/collab-sidebar/comment-author-info.js b/packages/editor/src/components/collab-sidebar/comment-author-info.js index 89d09a2b52261..d8b5f72a2fc25 100644 --- a/packages/editor/src/components/collab-sidebar/comment-author-info.js +++ b/packages/editor/src/components/collab-sidebar/comment-author-info.js @@ -16,7 +16,7 @@ import { store as blockEditorStore } from '@wordpress/block-editor'; * @param {string} props.name - Name of the author. * @param {string} props.date - Date of the comment. * - * @return {JSX.Element} The JSX element representing the author's information. + * @return {React.ReactNode} The JSX element representing the author's information. */ function CommentAuthorInfo( { avatar, name, date } ) { const dateSettings = getDateSettings(); diff --git a/packages/editor/src/components/collab-sidebar/comment-form.js b/packages/editor/src/components/collab-sidebar/comment-form.js index 28622f9f52a6f..052fd3cdd2656 100644 --- a/packages/editor/src/components/collab-sidebar/comment-form.js +++ b/packages/editor/src/components/collab-sidebar/comment-form.js @@ -22,7 +22,7 @@ import { sanitizeCommentString } from './utils'; * @param {Function} props.onCancel - The function to call when canceling the comment update. * @param {Object} props.thread - The comment thread object. * @param {string} props.submitButtonText - The text to display on the submit button. - * @return {JSX.Element} The CommentForm component. + * @return {React.ReactNode} The CommentForm component. */ function CommentForm( { onSubmit, onCancel, thread, submitButtonText } ) { const [ inputComment, setInputComment ] = useState( diff --git a/packages/editor/src/components/collab-sidebar/comments.js b/packages/editor/src/components/collab-sidebar/comments.js index 808ea0acf04b3..7a03068787c81 100644 --- a/packages/editor/src/components/collab-sidebar/comments.js +++ b/packages/editor/src/components/collab-sidebar/comments.js @@ -35,7 +35,7 @@ import CommentForm from './comment-form'; * @param {Function} props.onAddReply - The function to add a reply to a comment. * @param {Function} props.onCommentDelete - The function to delete a comment. * @param {Function} props.onCommentResolve - The function to mark a comment as resolved. - * @return {JSX.Element} The rendered Comments component. + * @return {React.ReactNode} The rendered Comments component. */ export function Comments( { threads, @@ -270,7 +270,7 @@ export function Comments( { * @param {Function} props.onDelete - The function to delete the comment. * @param {Function} props.onReply - The function to reply to the comment. * @param {string} props.status - The status of the comment. - * @return {JSX.Element} The rendered comment header. + * @return {React.ReactNode} The rendered comment header. */ function CommentHeader( { thread, diff --git a/packages/editor/src/components/document-bar/index.js b/packages/editor/src/components/document-bar/index.js index 30990379fe630..9fffba941a435 100644 --- a/packages/editor/src/components/document-bar/index.js +++ b/packages/editor/src/components/document-bar/index.js @@ -49,7 +49,7 @@ const MotionButton = motion( Button ); * @param {IconType} props.icon An icon for the document, no default. * (A default icon indicating the document post type is no longer used.) * - * @return {JSX.Element} The rendered DocumentBar component. + * @return {React.ReactNode} The rendered DocumentBar component. */ export default function DocumentBar( props ) { const { diff --git a/packages/editor/src/components/document-outline/check.js b/packages/editor/src/components/document-outline/check.js index d0676aa9037ff..87864cbb34a36 100644 --- a/packages/editor/src/components/document-outline/check.js +++ b/packages/editor/src/components/document-outline/check.js @@ -7,10 +7,10 @@ import { store as blockEditorStore } from '@wordpress/block-editor'; /** * Component check if there are any headings (core/heading blocks) present in the document. * - * @param {Object} props Props. - * @param {Element} props.children Children to be rendered. + * @param {Object} props Props. + * @param {React.ReactElement} props.children Children to be rendered. * - * @return {Component|null} The component to be rendered or null if there are headings. + * @return {React.ReactElement} The component to be rendered or null if there are headings. */ export default function DocumentOutlineCheck( { children } ) { const hasHeadings = useSelect( ( select ) => { diff --git a/packages/editor/src/components/document-outline/index.js b/packages/editor/src/components/document-outline/index.js index c5e5983736209..89f853798296a 100644 --- a/packages/editor/src/components/document-outline/index.js +++ b/packages/editor/src/components/document-outline/index.js @@ -106,7 +106,7 @@ const isEmptyHeading = ( heading ) => * @param {Function} props.onSelect Function to be called when an outline item is selected * @param {boolean} props.hasOutlineItemsDisabled Indicates whether the outline items are disabled. * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ export default function DocumentOutline( { onSelect, diff --git a/packages/editor/src/components/editor-history/redo.js b/packages/editor/src/components/editor-history/redo.js index 46a263bb89926..b2b20555f3054 100644 --- a/packages/editor/src/components/editor-history/redo.js +++ b/packages/editor/src/components/editor-history/redo.js @@ -50,6 +50,6 @@ function EditorHistoryRedo( props, ref ) { * @param {Object} props - Props. * @param {Ref} ref - Forwarded ref. * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ export default forwardRef( EditorHistoryRedo ); diff --git a/packages/editor/src/components/editor-history/undo.js b/packages/editor/src/components/editor-history/undo.js index 6ba6055706e99..fe8cce72c4197 100644 --- a/packages/editor/src/components/editor-history/undo.js +++ b/packages/editor/src/components/editor-history/undo.js @@ -46,6 +46,6 @@ function EditorHistoryUndo( props, ref ) { * @param {Object} props - Props. * @param {Ref} ref - Forwarded ref. * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ export default forwardRef( EditorHistoryUndo ); diff --git a/packages/editor/src/components/editor-notices/index.js b/packages/editor/src/components/editor-notices/index.js index 28341bfda3f23..5f095ef1a813c 100644 --- a/packages/editor/src/components/editor-notices/index.js +++ b/packages/editor/src/components/editor-notices/index.js @@ -18,7 +18,7 @@ import TemplateValidationNotice from '../template-validation-notice'; * * ``` * - * @return {JSX.Element} The rendered EditorNotices component. + * @return {React.ReactNode} The rendered EditorNotices component. */ export function EditorNotices() { const { notices } = useSelect( diff --git a/packages/editor/src/components/editor-snackbars/index.js b/packages/editor/src/components/editor-snackbars/index.js index 6530e1ec7ea90..9b781ee60dcaa 100644 --- a/packages/editor/src/components/editor-snackbars/index.js +++ b/packages/editor/src/components/editor-snackbars/index.js @@ -11,7 +11,7 @@ const MAX_VISIBLE_NOTICES = -3; /** * Renders the editor snackbars component. * - * @return {JSX.Element} The rendered component. + * @return {React.ReactNode} The rendered component. */ export default function EditorSnackbars() { const notices = useSelect( diff --git a/packages/editor/src/components/entities-saved-states/index.js b/packages/editor/src/components/entities-saved-states/index.js index 849bd2d0d71c8..ea05bca522941 100644 --- a/packages/editor/src/components/entities-saved-states/index.js +++ b/packages/editor/src/components/entities-saved-states/index.js @@ -33,7 +33,7 @@ function identity( values ) { * @param {Function} props.close The function to close the dialog. * @param {Function} props.renderDialog The function to render the dialog. * - * @return {JSX.Element} The rendered component. + * @return {React.ReactNode} The rendered component. */ export default function EntitiesSavedStates( { close, @@ -64,7 +64,7 @@ export default function EntitiesSavedStates( { * @param {Function} props.setUnselectedEntities Function to set unselected entities. * @param {Array} props.unselectedEntities Array of unselected entities. * - * @return {JSX.Element} The rendered component. + * @return {React.ReactNode} The rendered component. */ export function EntitiesSavedStatesExtensible( { additionalPrompt = undefined, diff --git a/packages/editor/src/components/page-attributes/check.js b/packages/editor/src/components/page-attributes/check.js index bed2b1a353842..3c08a3d8e5351 100644 --- a/packages/editor/src/components/page-attributes/check.js +++ b/packages/editor/src/components/page-attributes/check.js @@ -12,10 +12,10 @@ import { store as editorStore } from '../../store'; /** * Wrapper component that renders its children only if the post type supports page attributes. * - * @param {Object} props - The component props. - * @param {Element} props.children - The child components to render. + * @param {Object} props - The component props. + * @param {React.ReactElement} props.children - The child components to render. * - * @return {Component|null} The rendered child components or null if page attributes are not supported. + * @return {React.ReactElement} The rendered child components or null if page attributes are not supported. */ export function PageAttributesCheck( { children } ) { const supportsPageAttributes = useSelect( ( select ) => { diff --git a/packages/editor/src/components/page-attributes/order.js b/packages/editor/src/components/page-attributes/order.js index c5f02c71b613d..04c6ce186a970 100644 --- a/packages/editor/src/components/page-attributes/order.js +++ b/packages/editor/src/components/page-attributes/order.js @@ -59,7 +59,7 @@ function PageAttributesOrder() { * for setting the order of a given page. * The component is now not used in core but was kept for backward compatibility. * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ export default function PageAttributesOrderWithChecks() { return ( diff --git a/packages/editor/src/components/page-attributes/panel.js b/packages/editor/src/components/page-attributes/panel.js index 7fcaf4b90d9ff..8ecf7f1642f71 100644 --- a/packages/editor/src/components/page-attributes/panel.js +++ b/packages/editor/src/components/page-attributes/panel.js @@ -33,7 +33,7 @@ function AttributesPanel() { /** * Renders the Page Attributes Panel component. * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ export default function PageAttributesPanel() { return ( diff --git a/packages/editor/src/components/page-attributes/parent.js b/packages/editor/src/components/page-attributes/parent.js index 17395589cd313..bd2861766c334 100644 --- a/packages/editor/src/components/page-attributes/parent.js +++ b/packages/editor/src/components/page-attributes/parent.js @@ -56,7 +56,7 @@ export const getItemPriority = ( name, searchValue ) => { * Renders the Page Attributes Parent component. A dropdown menu in an editor interface * for selecting the parent page of a given page. * - * @return {Component|null} The component to be rendered. Return null if post type is not hierarchical. + * @return {React.ReactNode} The component to be rendered. Return null if post type is not hierarchical. */ export function PageAttributesParent() { const { editPost } = useDispatch( editorStore ); diff --git a/packages/editor/src/components/plugin-document-setting-panel/index.js b/packages/editor/src/components/plugin-document-setting-panel/index.js index 7466acffc0c4b..6408d82fe7e11 100644 --- a/packages/editor/src/components/plugin-document-setting-panel/index.js +++ b/packages/editor/src/components/plugin-document-setting-panel/index.js @@ -22,7 +22,7 @@ const { Fill, Slot } = createSlotFill( 'PluginDocumentSettingPanel' ); * @param {string} [props.className] An optional class name added to the row. * @param {string} [props.title] The title of the panel * @param {WPBlockTypeIconRender} [props.icon=inherits from the plugin] The [Dashicon](https://developer.wordpress.org/resource/dashicons/) icon slug string, or an SVG WP element, to be rendered when the sidebar is pinned to toolbar. - * @param {Element} props.children Children to be rendered + * @param {React.ReactNode} props.children Children to be rendered * * @example * ```js @@ -64,7 +64,7 @@ const { Fill, Slot } = createSlotFill( 'PluginDocumentSettingPanel' ); * registerPlugin( 'document-setting-test', { render: MyDocumentSettingTest } ); * ``` * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The component to be rendered. */ const PluginDocumentSettingPanel = ( { name, diff --git a/packages/editor/src/components/plugin-more-menu-item/index.js b/packages/editor/src/components/plugin-more-menu-item/index.js index 28173c24ebcef..1d8e124b03e60 100644 --- a/packages/editor/src/components/plugin-more-menu-item/index.js +++ b/packages/editor/src/components/plugin-more-menu-item/index.js @@ -10,6 +10,7 @@ import { ActionItem } from '@wordpress/interface'; * The text within the component appears as the menu item label. * * @param {Object} props Component properties. + * @param {React.ReactNode} [props.children] Children to be rendered. * @param {string} [props.href] When `href` is provided then the menu item is represented as an anchor rather than button. It corresponds to the `href` attribute of the anchor. * @param {WPBlockTypeIconRender} [props.icon=inherits from the plugin] The [Dashicon](https://developer.wordpress.org/resource/dashicons/) icon slug string, or an SVG WP element, to be rendered to the left of the menu item label. * @param {Function} [props.onClick=noop] The callback function to be executed when the user clicks the menu item. @@ -59,7 +60,7 @@ import { ActionItem } from '@wordpress/interface'; * ); * ``` * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ export default function PluginMoreMenuItem( props ) { const context = usePluginContext(); diff --git a/packages/editor/src/components/plugin-post-publish-panel/index.js b/packages/editor/src/components/plugin-post-publish-panel/index.js index 086045b1c1fee..b93f0a15c237f 100644 --- a/packages/editor/src/components/plugin-post-publish-panel/index.js +++ b/packages/editor/src/components/plugin-post-publish-panel/index.js @@ -15,7 +15,7 @@ const { Fill, Slot } = createSlotFill( 'PluginPostPublishPanel' ); * @param {string} [props.title] Title displayed at the top of the panel. * @param {boolean} [props.initialOpen=false] Whether to have the panel initially opened. When no title is provided it is always opened. * @param {WPBlockTypeIconRender} [props.icon=inherits from the plugin] The [Dashicon](https://developer.wordpress.org/resource/dashicons/) icon slug string, or an SVG WP element, to be rendered when the sidebar is pinned to toolbar. - * @param {Element} props.children Children to be rendered + * @param {React.ReactNode} props.children Children to be rendered * * @example * ```jsx @@ -34,7 +34,7 @@ const { Fill, Slot } = createSlotFill( 'PluginPostPublishPanel' ); * ); * ``` * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ const PluginPostPublishPanel = ( { children, diff --git a/packages/editor/src/components/plugin-post-status-info/index.js b/packages/editor/src/components/plugin-post-status-info/index.js index a4a216b78ae78..f9f3293047ddd 100644 --- a/packages/editor/src/components/plugin-post-status-info/index.js +++ b/packages/editor/src/components/plugin-post-status-info/index.js @@ -14,9 +14,9 @@ const { Fill, Slot } = createSlotFill( 'PluginPostStatusInfo' ); * It should be noted that this is named and implemented around the function it serves * and not its location, which may change in future iterations. * - * @param {Object} props Component properties. - * @param {string} [props.className] An optional class name added to the row. - * @param {Element} props.children Children to be rendered. + * @param {Object} props Component properties. + * @param {string} [props.className] An optional class name added to the row. + * @param {React.ReactNode} props.children Children to be rendered. * * @example * ```js @@ -50,7 +50,7 @@ const { Fill, Slot } = createSlotFill( 'PluginPostStatusInfo' ); * ); * ``` * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ const PluginPostStatusInfo = ( { children, className } ) => ( diff --git a/packages/editor/src/components/plugin-pre-publish-panel/index.js b/packages/editor/src/components/plugin-pre-publish-panel/index.js index c9f556dc534a8..412af36c5176e 100644 --- a/packages/editor/src/components/plugin-pre-publish-panel/index.js +++ b/packages/editor/src/components/plugin-pre-publish-panel/index.js @@ -18,7 +18,7 @@ const { Fill, Slot } = createSlotFill( 'PluginPrePublishPanel' ); * @param {WPBlockTypeIconRender} [props.icon=inherits from the plugin] The [Dashicon](https://developer.wordpress.org/resource/dashicons/) * icon slug string, or an SVG WP element, to be rendered when * the sidebar is pinned to toolbar. - * @param {Element} props.children Children to be rendered + * @param {React.ReactNode} props.children Children to be rendered * * @example * ```jsx @@ -37,7 +37,7 @@ const { Fill, Slot } = createSlotFill( 'PluginPrePublishPanel' ); * ); * ``` * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ const PluginPrePublishPanel = ( { children, diff --git a/packages/editor/src/components/plugin-preview-menu-item/index.js b/packages/editor/src/components/plugin-preview-menu-item/index.js index 8038da04595aa..949f02808a7b0 100644 --- a/packages/editor/src/components/plugin-preview-menu-item/index.js +++ b/packages/editor/src/components/plugin-preview-menu-item/index.js @@ -10,6 +10,7 @@ import { ActionItem } from '@wordpress/interface'; * The text within the component appears as the menu item label. * * @param {Object} props Component properties. + * @param {React.ReactNode} [props.children] Children to be rendered. * @param {string} [props.href] When `href` is provided, the menu item is rendered as an anchor instead of a button. It corresponds to the `href` attribute of the anchor. * @param {WPBlockTypeIconRender} [props.icon=inherits from the plugin] The icon to be rendered to the left of the menu item label. Can be a Dashicon slug or an SVG WP element. * @param {Function} [props.onClick] The callback function to be executed when the user clicks the menu item. @@ -38,7 +39,7 @@ import { ActionItem } from '@wordpress/interface'; * } ); * ``` * - * @return {Component} The rendered menu item component. + * @return {React.ReactNode} The rendered menu item component. */ export default function PluginPreviewMenuItem( props ) { const context = usePluginContext(); diff --git a/packages/editor/src/components/plugin-sidebar-more-menu-item/index.js b/packages/editor/src/components/plugin-sidebar-more-menu-item/index.js index 0d7695c9abfe1..379a0720dc8a9 100644 --- a/packages/editor/src/components/plugin-sidebar-more-menu-item/index.js +++ b/packages/editor/src/components/plugin-sidebar-more-menu-item/index.js @@ -10,6 +10,7 @@ import { ComplementaryAreaMoreMenuItem } from '@wordpress/interface'; * * @param {Object} props Component props. * @param {string} props.target A string identifying the target sidebar you wish to be activated by this menu item. Must be the same as the `name` prop you have given to that sidebar. + * @param {React.ReactNode} [props.children] Children to be rendered. * @param {WPBlockTypeIconRender} [props.icon=inherits from the plugin] The [Dashicon](https://developer.wordpress.org/resource/dashicons/) icon slug string, or an SVG WP element, to be rendered to the left of the menu item label. * * @example @@ -48,9 +49,8 @@ import { ComplementaryAreaMoreMenuItem } from '@wordpress/interface'; * ); * ``` * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ - export default function PluginSidebarMoreMenuItem( props ) { return ( { diff --git a/packages/editor/src/components/post-author/panel.js b/packages/editor/src/components/post-author/panel.js index 6c6a51918902d..5a413aedac09c 100644 --- a/packages/editor/src/components/post-author/panel.js +++ b/packages/editor/src/components/post-author/panel.js @@ -39,7 +39,7 @@ function PostAuthorToggle( { isOpen, onClick } ) { /** * Renders the Post Author Panel component. * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ export function PostAuthor() { // Use internal state instead of a ref to make sure that the component diff --git a/packages/editor/src/components/post-comments/index.js b/packages/editor/src/components/post-comments/index.js index 1d331811b46b2..6e69f9bce4f83 100644 --- a/packages/editor/src/components/post-comments/index.js +++ b/packages/editor/src/components/post-comments/index.js @@ -61,6 +61,6 @@ function PostComments() { /** * A form for managing comment status. * - * @return {JSX.Element} The rendered PostComments component. + * @return {React.ReactNode} The rendered PostComments component. */ export default PostComments; diff --git a/packages/editor/src/components/post-discussion/panel.js b/packages/editor/src/components/post-discussion/panel.js index c539791d404de..280ab11b0447e 100644 --- a/packages/editor/src/components/post-discussion/panel.js +++ b/packages/editor/src/components/post-discussion/panel.js @@ -93,7 +93,7 @@ function PostDiscussionToggle( { isOpen, onClick } ) { * checks whether the current post has support for the * above and if the `discussion-panel` panel is enabled. * - * @return {JSX.Element|null} The rendered PostDiscussionPanel component. + * @return {React.ReactNode} The rendered PostDiscussionPanel component. */ export default function PostDiscussionPanel() { const { isEnabled } = useSelect( ( select ) => { diff --git a/packages/editor/src/components/post-excerpt/check.js b/packages/editor/src/components/post-excerpt/check.js index 77436ecfed218..c518d90e424a9 100644 --- a/packages/editor/src/components/post-excerpt/check.js +++ b/packages/editor/src/components/post-excerpt/check.js @@ -6,10 +6,10 @@ import PostTypeSupportCheck from '../post-type-support-check'; /** * Component for checking if the post type supports the excerpt field. * - * @param {Object} props Props. - * @param {Element} props.children Children to be rendered. + * @param {Object} props Props. + * @param {React.ReactNode} props.children Children to be rendered. * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ function PostExcerptCheck( { children } ) { return ( diff --git a/packages/editor/src/components/post-excerpt/panel.js b/packages/editor/src/components/post-excerpt/panel.js index 9c09796f46704..d4f2b27126c7c 100644 --- a/packages/editor/src/components/post-excerpt/panel.js +++ b/packages/editor/src/components/post-excerpt/panel.js @@ -83,7 +83,7 @@ function ExcerptPanel() { /** * Is rendered if the post type supports excerpts and allows editing the excerpt. * - * @return {JSX.Element} The rendered PostExcerptPanel component. + * @return {React.ReactNode} The rendered PostExcerptPanel component. */ export default function PostExcerptPanel() { return ( diff --git a/packages/editor/src/components/post-excerpt/plugin.js b/packages/editor/src/components/post-excerpt/plugin.js index 64861162a0f63..50c494c01cb6d 100644 --- a/packages/editor/src/components/post-excerpt/plugin.js +++ b/packages/editor/src/components/post-excerpt/plugin.js @@ -12,9 +12,9 @@ const { Fill, Slot } = createSlotFill( 'PluginPostExcerpt' ); /** * Renders a post excerpt panel in the post sidebar. * - * @param {Object} props Component properties. - * @param {string} [props.className] An optional class name added to the row. - * @param {Element} props.children Children to be rendered. + * @param {Object} props Component properties. + * @param {string} [props.className] An optional class name added to the row. + * @param {React.ReactNode} props.children Children to be rendered. * * @example * ```js @@ -46,7 +46,7 @@ const { Fill, Slot } = createSlotFill( 'PluginPostExcerpt' ); * ); * ``` * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ const PluginPostExcerpt = ( { children, className } ) => { return ( diff --git a/packages/editor/src/components/post-featured-image/check.js b/packages/editor/src/components/post-featured-image/check.js index 823559f766bc3..700a3b8edfd03 100644 --- a/packages/editor/src/components/post-featured-image/check.js +++ b/packages/editor/src/components/post-featured-image/check.js @@ -8,10 +8,10 @@ import ThemeSupportCheck from '../theme-support-check'; * Wrapper component that renders its children only if the post type supports a featured image * and the theme supports post thumbnails. * - * @param {Object} props Props. - * @param {Element} props.children Children to be rendered. + * @param {Object} props Props. + * @param {React.ReactNode} props.children Children to be rendered. * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ function PostFeaturedImageCheck( { children } ) { return ( diff --git a/packages/editor/src/components/post-featured-image/panel.js b/packages/editor/src/components/post-featured-image/panel.js index dd2a1527152dd..8621b2eb88633 100644 --- a/packages/editor/src/components/post-featured-image/panel.js +++ b/packages/editor/src/components/post-featured-image/panel.js @@ -21,7 +21,7 @@ const PANEL_NAME = 'featured-image'; * @param {Object} props Props. * @param {boolean} props.withPanelBody Whether to include the panel body. Default true. * - * @return {Component|null} The component to be rendered. + * @return {React.ReactNode} The component to be rendered. * Return Null if the editor panel is disabled for featured image. */ export default function PostFeaturedImagePanel( { withPanelBody = true } ) { diff --git a/packages/editor/src/components/post-format/check.js b/packages/editor/src/components/post-format/check.js index 35729770b93c4..fe791862e1ceb 100644 --- a/packages/editor/src/components/post-format/check.js +++ b/packages/editor/src/components/post-format/check.js @@ -9,7 +9,15 @@ import { useSelect } from '@wordpress/data'; import PostTypeSupportCheck from '../post-type-support-check'; import { store as editorStore } from '../../store'; -function PostFormatCheck( { children } ) { +/** + * Component check if there are any post formats. + * + * @param {Object} props The component props. + * @param {React.ReactNode} props.children The child elements to render. + * + * @return {React.ReactNode} The rendered component or null if post formats are disabled. + */ +export default function PostFormatCheck( { children } ) { const disablePostFormats = useSelect( ( select ) => select( editorStore ).getEditorSettings().disablePostFormats, @@ -26,13 +34,3 @@ function PostFormatCheck( { children } ) { ); } - -/** - * Component check if there are any post formats. - * - * @param {Object} props The component props. - * @param {Element} props.children The child elements to render. - * - * @return {Component|null} The rendered component or null if post formats are disabled. - */ -export default PostFormatCheck; diff --git a/packages/editor/src/components/post-format/index.js b/packages/editor/src/components/post-format/index.js index 8f7423239600f..d98720cd6fa93 100644 --- a/packages/editor/src/components/post-format/index.js +++ b/packages/editor/src/components/post-format/index.js @@ -46,7 +46,7 @@ export const POST_FORMATS = [ * * ``` * - * @return {JSX.Element} The rendered PostFormat component. + * @return {React.ReactNode} The rendered PostFormat component. */ export default function PostFormat() { const instanceId = useInstanceId( PostFormat ); diff --git a/packages/editor/src/components/post-format/panel.js b/packages/editor/src/components/post-format/panel.js index faaf88b785a4b..18704eda6fc44 100644 --- a/packages/editor/src/components/post-format/panel.js +++ b/packages/editor/src/components/post-format/panel.js @@ -18,7 +18,7 @@ import { store as editorStore } from '../../store'; /** * Renders the Post Author Panel component. * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ function PostFormat() { const { postFormat } = useSelect( ( select ) => { diff --git a/packages/editor/src/components/post-last-revision/check.js b/packages/editor/src/components/post-last-revision/check.js index c570f5e42cdc3..cb3c655e1b7cc 100644 --- a/packages/editor/src/components/post-last-revision/check.js +++ b/packages/editor/src/components/post-last-revision/check.js @@ -12,10 +12,10 @@ import { store as editorStore } from '../../store'; /** * Wrapper component that renders its children if the post has more than one revision. * - * @param {Object} props Props. - * @param {Element} props.children Children to be rendered. + * @param {Object} props Props. + * @param {React.ReactNode} props.children Children to be rendered. * - * @return {Component|null} Rendered child components if post has more than one revision, otherwise null. + * @return {React.ReactNode} Rendered child components if post has more than one revision, otherwise null. */ function PostLastRevisionCheck( { children } ) { const { lastRevisionId, revisionsCount } = useSelect( ( select ) => { diff --git a/packages/editor/src/components/post-last-revision/index.js b/packages/editor/src/components/post-last-revision/index.js index fd68f9703cb4e..ac25e6cb8f30d 100644 --- a/packages/editor/src/components/post-last-revision/index.js +++ b/packages/editor/src/components/post-last-revision/index.js @@ -28,7 +28,7 @@ function usePostLastRevisionInfo() { /** * Renders the component for displaying the last revision of a post. * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ function PostLastRevision() { const { lastRevisionId, revisionsCount } = usePostLastRevisionInfo(); diff --git a/packages/editor/src/components/post-last-revision/panel.js b/packages/editor/src/components/post-last-revision/panel.js index e87475cc2b34e..55a3ba571c4b0 100644 --- a/packages/editor/src/components/post-last-revision/panel.js +++ b/packages/editor/src/components/post-last-revision/panel.js @@ -12,7 +12,7 @@ import PostLastRevisionCheck from './check'; /** * Renders the panel for displaying the last revision of a post. * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ function PostLastRevisionPanel() { return ( diff --git a/packages/editor/src/components/post-locked-modal/index.js b/packages/editor/src/components/post-locked-modal/index.js index 7bfa2d23fd980..16cff5af97684 100644 --- a/packages/editor/src/components/post-locked-modal/index.js +++ b/packages/editor/src/components/post-locked-modal/index.js @@ -24,7 +24,7 @@ import { store as editorStore } from '../../store'; * A modal component that is displayed when a post is locked for editing by another user. * The modal provides information about the lock status and options to take over or exit the editor. * - * @return {JSX.Element|null} The rendered PostLockedModal component. + * @return {React.ReactNode} The rendered PostLockedModal component. */ export default function PostLockedModal() { const instanceId = useInstanceId( PostLockedModal ); diff --git a/packages/editor/src/components/post-pending-status/check.js b/packages/editor/src/components/post-pending-status/check.js index 7a4ff5195041c..9f407d8c8cd82 100644 --- a/packages/editor/src/components/post-pending-status/check.js +++ b/packages/editor/src/components/post-pending-status/check.js @@ -13,10 +13,10 @@ import { store as editorStore } from '../../store'; * If the post is already published or the user doesn't have the * capability to publish, it returns null. * - * @param {Object} props Component properties. - * @param {Element} props.children Children to be rendered. + * @param {Object} props Component properties. + * @param {React.ReactElement} props.children Children to be rendered. * - * @return {JSX.Element|null} The rendered child elements or null if the post is already published or the user doesn't have the capability to publish. + * @return {React.ReactElement} The rendered child elements or null if the post is already published or the user doesn't have the capability to publish. */ export function PostPendingStatusCheck( { children } ) { const { hasPublishAction, isPublished } = useSelect( ( select ) => { diff --git a/packages/editor/src/components/post-pending-status/index.js b/packages/editor/src/components/post-pending-status/index.js index 8363ebc715891..352570c44a663 100644 --- a/packages/editor/src/components/post-pending-status/index.js +++ b/packages/editor/src/components/post-pending-status/index.js @@ -14,7 +14,7 @@ import { store as editorStore } from '../../store'; /** * A component for displaying and toggling the pending status of a post. * - * @return {JSX.Element} The rendered component. + * @return {React.ReactNode} The rendered component. */ export function PostPendingStatus() { const status = useSelect( diff --git a/packages/editor/src/components/post-preview-button/index.js b/packages/editor/src/components/post-preview-button/index.js index d57143cd355d8..d1755f96b6861 100644 --- a/packages/editor/src/components/post-preview-button/index.js +++ b/packages/editor/src/components/post-preview-button/index.js @@ -112,7 +112,7 @@ function writeInterstitialMessage( targetDocument ) { * @param {string} props.role The role attribute for the button. * @param {Function} props.onPreview The callback function for preview event. * - * @return {JSX.Element|null} The rendered button component. + * @return {React.ReactNode} The rendered button component. */ export default function PostPreviewButton( { className, diff --git a/packages/editor/src/components/post-schedule/check.js b/packages/editor/src/components/post-schedule/check.js index 28456b90371cc..32526a977f94f 100644 --- a/packages/editor/src/components/post-schedule/check.js +++ b/packages/editor/src/components/post-schedule/check.js @@ -11,10 +11,10 @@ import { store as editorStore } from '../../store'; /** * Wrapper component that renders its children only if post has a publish action. * - * @param {Object} props Props. - * @param {Element} props.children Children to be rendered. + * @param {Object} props Props. + * @param {React.ReactElement} props.children Children to be rendered. * - * @return {Component} - The component to be rendered or null if there is no publish action. + * @return {React.ReactElement} - The component to be rendered or null if there is no publish action. */ export default function PostScheduleCheck( { children } ) { const hasPublishAction = useSelect( ( select ) => { diff --git a/packages/editor/src/components/post-schedule/index.js b/packages/editor/src/components/post-schedule/index.js index 94387ed4267fa..c9b017bcfa80d 100644 --- a/packages/editor/src/components/post-schedule/index.js +++ b/packages/editor/src/components/post-schedule/index.js @@ -27,7 +27,7 @@ const { PrivatePublishDateTimePicker } = unlock( blockEditorPrivateApis ); * @param {Object} props Props. * @param {Function} props.onClose Function to close the component. * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ export default function PostSchedule( props ) { return ( diff --git a/packages/editor/src/components/post-schedule/label.js b/packages/editor/src/components/post-schedule/label.js index f6cf3811db791..2b8819747e7e0 100644 --- a/packages/editor/src/components/post-schedule/label.js +++ b/packages/editor/src/components/post-schedule/label.js @@ -15,7 +15,7 @@ import { store as editorStore } from '../../store'; * * @param {Object} props Props. * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ export default function PostScheduleLabel( props ) { return usePostScheduleLabel( props ); diff --git a/packages/editor/src/components/post-schedule/panel.js b/packages/editor/src/components/post-schedule/panel.js index 5d63da5e30c91..fd453a4667417 100644 --- a/packages/editor/src/components/post-schedule/panel.js +++ b/packages/editor/src/components/post-schedule/panel.js @@ -31,7 +31,7 @@ const DESIGN_POST_TYPES = [ /** * Renders the Post Schedule Panel component. * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ export default function PostSchedulePanel() { const [ popoverAnchor, setPopoverAnchor ] = useState( null ); diff --git a/packages/editor/src/components/post-slug/check.js b/packages/editor/src/components/post-slug/check.js index 86bf04814c934..8ca7078a1a9e2 100644 --- a/packages/editor/src/components/post-slug/check.js +++ b/packages/editor/src/components/post-slug/check.js @@ -6,10 +6,10 @@ import PostTypeSupportCheck from '../post-type-support-check'; /** * Wrapper component that renders its children only if the post type supports the slug. * - * @param {Object} props Props. - * @param {Element} props.children Children to be rendered. + * @param {Object} props Props. + * @param {React.ReactNode} props.children Children to be rendered. * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ export default function PostSlugCheck( { children } ) { return ( diff --git a/packages/editor/src/components/post-slug/index.js b/packages/editor/src/components/post-slug/index.js index 1a4f8e93d7565..afff7f361ea42 100644 --- a/packages/editor/src/components/post-slug/index.js +++ b/packages/editor/src/components/post-slug/index.js @@ -62,7 +62,7 @@ function PostSlugControl() { /** * Renders the PostSlug component. It provide a control for editing the post slug. * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ export default function PostSlug() { return ( diff --git a/packages/editor/src/components/post-sticky/check.js b/packages/editor/src/components/post-sticky/check.js index f504effca82c6..ede5c22f3c3e3 100644 --- a/packages/editor/src/components/post-sticky/check.js +++ b/packages/editor/src/components/post-sticky/check.js @@ -11,10 +11,10 @@ import { store as editorStore } from '../../store'; /** * Wrapper component that renders its children only if post has a sticky action. * - * @param {Object} props Props. - * @param {Element} props.children Children to be rendered. + * @param {Object} props Props. + * @param {React.ReactElement} props.children Children to be rendered. * - * @return {Component} The component to be rendered or null if post type is not 'post' or hasStickyAction is false. + * @return {React.ReactElement} The component to be rendered or null if post type is not 'post' or hasStickyAction is false. */ export default function PostStickyCheck( { children } ) { const { hasStickyAction, postType } = useSelect( ( select ) => { diff --git a/packages/editor/src/components/post-sticky/index.js b/packages/editor/src/components/post-sticky/index.js index 43a4bea98de26..6f5b914cb2f35 100644 --- a/packages/editor/src/components/post-sticky/index.js +++ b/packages/editor/src/components/post-sticky/index.js @@ -14,7 +14,7 @@ import { store as editorStore } from '../../store'; /** * Renders the PostSticky component. It provides a checkbox control for the sticky post feature. * - * @return {Component} The component to be rendered. + * @return {React.ReactNode} The rendered component. */ export default function PostSticky() { const postSticky = useSelect( ( select ) => { diff --git a/packages/editor/src/components/post-switch-to-draft-button/index.js b/packages/editor/src/components/post-switch-to-draft-button/index.js index a743c7a2991ff..6a41e1fad597a 100644 --- a/packages/editor/src/components/post-switch-to-draft-button/index.js +++ b/packages/editor/src/components/post-switch-to-draft-button/index.js @@ -18,7 +18,7 @@ import { store as editorStore } from '../../store'; /** * Renders a button component that allows the user to switch a post to draft status. * - * @return {JSX.Element} The rendered component. + * @return {React.ReactNode} The rendered component. */ export default function PostSwitchToDraftButton() { deprecated( 'wp.editor.PostSwitchToDraftButton', { diff --git a/packages/editor/src/components/post-sync-status/index.js b/packages/editor/src/components/post-sync-status/index.js index d3e2a1a5522e8..5f965c01503f5 100644 --- a/packages/editor/src/components/post-sync-status/index.js +++ b/packages/editor/src/components/post-sync-status/index.js @@ -13,7 +13,7 @@ import { store as editorStore } from '../../store'; /** * Renders the sync status of a post. * - * @return {JSX.Element|null} The rendered sync status component. + * @return {React.ReactNode} The rendered sync status component. */ export default function PostSyncStatus() { const { syncStatus, postType } = useSelect( ( select ) => { diff --git a/packages/editor/src/components/post-taxonomies/check.js b/packages/editor/src/components/post-taxonomies/check.js index 401b1adad7cad..ce3db319ae2e8 100644 --- a/packages/editor/src/components/post-taxonomies/check.js +++ b/packages/editor/src/components/post-taxonomies/check.js @@ -12,10 +12,10 @@ import { store as editorStore } from '../../store'; /** * Renders the children components only if the current post type has taxonomies. * - * @param {Object} props The component props. - * @param {Element} props.children The children components to render. + * @param {Object} props The component props. + * @param {React.ReactNode} props.children The children components to render. * - * @return {Component|null} The rendered children components or null if the current post type has no taxonomies. + * @return {React.ReactElement} The rendered children components or null if the current post type has no taxonomies. */ export default function PostTaxonomiesCheck( { children } ) { const hasTaxonomies = useSelect( ( select ) => { diff --git a/packages/editor/src/components/post-taxonomies/flat-term-selector.js b/packages/editor/src/components/post-taxonomies/flat-term-selector.js index cd9377766af50..890175534c8b4 100644 --- a/packages/editor/src/components/post-taxonomies/flat-term-selector.js +++ b/packages/editor/src/components/post-taxonomies/flat-term-selector.js @@ -71,7 +71,7 @@ const Wrapper = ( { children, __nextHasNoMarginBottom } ) => * @param {string} props.slug The slug of the taxonomy. * @param {boolean} props.__nextHasNoMarginBottom Start opting into the new margin-free styles that will become the default in a future version, currently scheduled to be WordPress 7.0. (The prop can be safely removed once this happens.) * - * @return {JSX.Element} The rendered flat term selector component. + * @return {React.ReactNode} The rendered flat term selector component. */ export function FlatTermSelector( { slug, __nextHasNoMarginBottom } ) { const [ values, setValues ] = useState( [] ); diff --git a/packages/editor/src/components/post-taxonomies/panel.js b/packages/editor/src/components/post-taxonomies/panel.js index 760626f984db3..f75fa74cc3d2e 100644 --- a/packages/editor/src/components/post-taxonomies/panel.js +++ b/packages/editor/src/components/post-taxonomies/panel.js @@ -11,6 +11,15 @@ import { store as editorStore } from '../../store'; import PostTaxonomiesForm from './index'; import PostTaxonomiesCheck from './check'; +/** + * Renders a panel for a specific taxonomy. + * + * @param {Object} props The component props. + * @param {Object} props.taxonomy The taxonomy object. + * @param {React.ReactNode} props.children The child components. + * + * @return {React.ReactNode} The rendered taxonomy panel. + */ function TaxonomyPanel( { taxonomy, children } ) { const slug = taxonomy?.slug; const panelName = slug ? `taxonomy-panel-${ slug }` : ''; @@ -47,7 +56,12 @@ function TaxonomyPanel( { taxonomy, children } ) { ); } -function PostTaxonomies() { +/** + * Component that renders the post taxonomies panel. + * + * @return {React.ReactNode} The rendered component. + */ +export default function PostTaxonomies() { return ( ); } - -/** - * Renders a panel for a specific taxonomy. - * - * @param {Object} props The component props. - * @param {Object} props.taxonomy The taxonomy object. - * @param {Element} props.children The child components. - * - * @return {Component} The rendered taxonomy panel. - */ -export default PostTaxonomies; diff --git a/packages/editor/src/components/post-template/classic-theme.js b/packages/editor/src/components/post-template/classic-theme.js index 4a65a9b4c7563..4345e06211c66 100644 --- a/packages/editor/src/components/post-template/classic-theme.js +++ b/packages/editor/src/components/post-template/classic-theme.js @@ -63,7 +63,7 @@ function PostTemplateToggle( { isOpen, onClick } ) { * @param {Object} props The component props. * @param {Function} props.onClose The function to close the dropdown. * - * @return {JSX.Element} The rendered dropdown content. + * @return {React.ReactNode} The rendered dropdown content. */ function PostTemplateDropdownContent( { onClose } ) { const allowSwitchingTemplate = useAllowSwitchingTemplates(); @@ -235,6 +235,6 @@ function ClassicThemeControl() { * * The dropdown menu includes a button for toggling the menu, a list of available templates, and options for creating and editing templates. * - * @return {JSX.Element} The rendered ClassicThemeControl component. + * @return {React.ReactNode} The rendered ClassicThemeControl component. */ export default ClassicThemeControl; diff --git a/packages/editor/src/components/post-template/panel.js b/packages/editor/src/components/post-template/panel.js index b5f0d34197c68..903612ef11ed1 100644 --- a/packages/editor/src/components/post-template/panel.js +++ b/packages/editor/src/components/post-template/panel.js @@ -16,7 +16,7 @@ import PostPanelRow from '../post-panel-row'; /** * Displays the template controls based on the current editor settings and user permissions. * - * @return {JSX.Element|null} The rendered PostTemplatePanel component. + * @return {React.ReactNode} The rendered PostTemplatePanel component. */ export default function PostTemplatePanel() { const { templateId, isBlockTheme } = useSelect( ( select ) => { diff --git a/packages/editor/src/components/post-text-editor/index.js b/packages/editor/src/components/post-text-editor/index.js index c3dc61a0b4a2e..0ae569c3e1530 100644 --- a/packages/editor/src/components/post-text-editor/index.js +++ b/packages/editor/src/components/post-text-editor/index.js @@ -22,7 +22,7 @@ import { store as editorStore } from '../../store'; /** * Displays the Post Text Editor along with content in Visual and Text mode. * - * @return {JSX.Element|null} The rendered PostTextEditor component. + * @return {React.ReactNode} The rendered PostTextEditor component. */ export default function PostTextEditor() { const instanceId = useInstanceId( PostTextEditor ); diff --git a/packages/editor/src/components/post-title/index.js b/packages/editor/src/components/post-title/index.js index 7fc79eaeddffb..090beb57f6170 100644 --- a/packages/editor/src/components/post-title/index.js +++ b/packages/editor/src/components/post-title/index.js @@ -193,7 +193,7 @@ const PostTitle = forwardRef( ( _, forwardedRef ) => { * @param {Object} _ Unused parameter. * @param {Element} forwardedRef Forwarded ref for the component. * - * @return {Component} The rendered PostTitle component. + * @return {React.ReactNode} The rendered PostTitle component. */ export default forwardRef( ( _, forwardedRef ) => ( diff --git a/packages/editor/src/components/post-title/post-title-raw.js b/packages/editor/src/components/post-title/post-title-raw.js index 66c944b45871a..9beba1068f8ef 100644 --- a/packages/editor/src/components/post-title/post-title-raw.js +++ b/packages/editor/src/components/post-title/post-title-raw.js @@ -26,7 +26,7 @@ import usePostTitle from './use-post-title'; * @param {Object} _ Unused parameter. * @param {Element} forwardedRef Reference to the component's DOM node. * - * @return {Component} The rendered component. + * @return {React.ReactNode} The rendered component. */ function PostTitleRaw( _, forwardedRef ) { const { placeholder } = useSelect( ( select ) => { diff --git a/packages/editor/src/components/post-trash/check.js b/packages/editor/src/components/post-trash/check.js index 7edc7c0f18c27..893d46ef9a086 100644 --- a/packages/editor/src/components/post-trash/check.js +++ b/packages/editor/src/components/post-trash/check.js @@ -13,10 +13,10 @@ import { GLOBAL_POST_TYPES } from '../../store/constants'; /** * Wrapper component that renders its children only if the post can trashed. * - * @param {Object} props - The component props. - * @param {Element} props.children - The child components to render. + * @param {Object} props - The component props. + * @param {React.ReactEl} props.children - The child components to render. * - * @return {Component|null} The rendered child components or null if the post can not trashed. + * @return {React.ReactElement} The rendered child components or null if the post can not trashed. */ export default function PostTrashCheck( { children } ) { const { canTrashPost } = useSelect( ( select ) => { diff --git a/packages/editor/src/components/post-trash/index.js b/packages/editor/src/components/post-trash/index.js index 743512e9efd7d..2d3dd8bcb0c4b 100644 --- a/packages/editor/src/components/post-trash/index.js +++ b/packages/editor/src/components/post-trash/index.js @@ -19,7 +19,7 @@ import PostTrashCheck from './check'; * Displays the Post Trash Button and Confirm Dialog in the Editor. * * @param {?{onActionPerformed: Object}} An object containing the onActionPerformed function. - * @return {JSX.Element|null} The rendered PostTrash component. + * @return {React.ReactNode} The rendered PostTrash component. */ export default function PostTrash( { onActionPerformed } ) { const registry = useRegistry(); diff --git a/packages/editor/src/components/post-type-support-check/index.js b/packages/editor/src/components/post-type-support-check/index.js index 613fda8eb82da..f04aea84b0e41 100644 --- a/packages/editor/src/components/post-type-support-check/index.js +++ b/packages/editor/src/components/post-type-support-check/index.js @@ -13,13 +13,13 @@ import { store as editorStore } from '../../store'; * A component which renders its own children only if the current editor post * type supports one of the given `supportKeys` prop. * - * @param {Object} props Props. - * @param {Element} props.children Children to be rendered if post - * type supports. - * @param {(string|string[])} props.supportKeys String or string array of keys - * to test. + * @param {Object} props Props. + * @param {React.ReactElement} props.children Children to be rendered if post + * type supports. + * @param {(string|string[])} props.supportKeys String or string array of keys + * to test. * - * @return {Component} The component to be rendered. + * @return {React.ReactElement} The component to be rendered. */ function PostTypeSupportCheck( { children, supportKeys } ) { const postType = useSelect( ( select ) => { diff --git a/packages/editor/src/components/post-url/check.js b/packages/editor/src/components/post-url/check.js index 7eb390472bdd7..a80d829de2322 100644 --- a/packages/editor/src/components/post-url/check.js +++ b/packages/editor/src/components/post-url/check.js @@ -12,10 +12,10 @@ import { store as editorStore } from '../../store'; /** * Check if the post URL is valid and visible. * - * @param {Object} props The component props. - * @param {Element} props.children The child components. + * @param {Object} props The component props. + * @param {React.ReactElement} props.children The child components. * - * @return {Component|null} The child components if the post URL is valid and visible, otherwise null. + * @return {React.ReactElement} The child components if the post URL is valid and visible, otherwise null. */ export default function PostURLCheck( { children } ) { const isVisible = useSelect( ( select ) => { diff --git a/packages/editor/src/components/post-url/index.js b/packages/editor/src/components/post-url/index.js index f03bdd59752a8..c72ca5825f6fe 100644 --- a/packages/editor/src/components/post-url/index.js +++ b/packages/editor/src/components/post-url/index.js @@ -34,7 +34,7 @@ import { store as editorStore } from '../../store'; * * @param {Function} onClose Callback function to be executed when the popover is closed. * - * @return {Component} The rendered PostURL component. + * @return {React.ReactNode} The rendered PostURL component. */ export default function PostURL( { onClose } ) { const { diff --git a/packages/editor/src/components/post-url/label.js b/packages/editor/src/components/post-url/label.js index 4f03e2bce0d05..277cc6cfc715d 100644 --- a/packages/editor/src/components/post-url/label.js +++ b/packages/editor/src/components/post-url/label.js @@ -12,7 +12,7 @@ import { store as editorStore } from '../../store'; /** * Represents a label component for a post URL. * - * @return {Component} The PostURLLabel component. + * @return {React.ReactNode} The PostURLLabel component. */ export default function PostURLLabel() { return usePostURLLabel(); diff --git a/packages/editor/src/components/post-url/panel.js b/packages/editor/src/components/post-url/panel.js index 786a12cb8e6b5..97eaa8ccb77f8 100644 --- a/packages/editor/src/components/post-url/panel.js +++ b/packages/editor/src/components/post-url/panel.js @@ -19,7 +19,7 @@ import { store as editorStore } from '../../store'; /** * Renders the `PostURLPanel` component. * - * @return {JSX.Element} The rendered PostURLPanel component. + * @return {React.ReactNode} The rendered PostURLPanel component. */ export default function PostURLPanel() { const { isFrontPage } = useSelect( ( select ) => { diff --git a/packages/editor/src/components/post-visibility/check.js b/packages/editor/src/components/post-visibility/check.js index 19a241ae1110a..ea04a6b739617 100644 --- a/packages/editor/src/components/post-visibility/check.js +++ b/packages/editor/src/components/post-visibility/check.js @@ -15,7 +15,7 @@ import { store as editorStore } from '../../store'; * @param {Object} props The component props. * @param {Function} props.render Function to render the component. * Receives an object with a `canEdit` property. - * @return {JSX.Element} The rendered component. + * @return {React.ReactNode} The rendered component. */ export default function PostVisibilityCheck( { render } ) { const canEdit = useSelect( ( select ) => { diff --git a/packages/editor/src/components/post-visibility/index.js b/packages/editor/src/components/post-visibility/index.js index e47f2acd66443..3eb0c157c337c 100644 --- a/packages/editor/src/components/post-visibility/index.js +++ b/packages/editor/src/components/post-visibility/index.js @@ -22,7 +22,7 @@ import { store as editorStore } from '../../store'; * * @param {Object} props The component props. * @param {Function} props.onClose Function to call when the popover is closed. - * @return {JSX.Element} The rendered component. + * @return {React.ReactNode} The rendered component. */ export default function PostVisibility( { onClose } ) { const instanceId = useInstanceId( PostVisibility ); diff --git a/packages/editor/src/components/provider/index.js b/packages/editor/src/components/provider/index.js index 6c05e5b58235b..996e9e6895459 100644 --- a/packages/editor/src/components/provider/index.js +++ b/packages/editor/src/components/provider/index.js @@ -411,7 +411,7 @@ export const ExperimentalEditorProvider = withRegistryProvider( * * ``` * - * @return {JSX.Element} The rendered EditorProvider component. + * @return {React.ReactNode} The rendered EditorProvider component. */ export function EditorProvider( props ) { return ( diff --git a/packages/editor/src/components/table-of-contents/index.js b/packages/editor/src/components/table-of-contents/index.js index 6fd83557b13ab..47de10b66ebdd 100644 --- a/packages/editor/src/components/table-of-contents/index.js +++ b/packages/editor/src/components/table-of-contents/index.js @@ -61,6 +61,6 @@ function TableOfContents( * @param {boolean} props.repositionDropdown Whether to reposition the dropdown. * @param {Element.ref} ref The component's ref. * - * @return {JSX.Element} The rendered table of contents component. + * @return {React.ReactNode} The rendered table of contents component. */ export default forwardRef( TableOfContents ); diff --git a/packages/editor/src/components/theme-support-check/index.js b/packages/editor/src/components/theme-support-check/index.js index 78fbde809a708..1f29370d32199 100644 --- a/packages/editor/src/components/theme-support-check/index.js +++ b/packages/editor/src/components/theme-support-check/index.js @@ -12,11 +12,11 @@ import { store as editorStore } from '../../store'; /** * Checks if the current theme supports specific features and renders the children if supported. * - * @param {Object} props The component props. - * @param {Element} props.children The children to render if the theme supports the specified features. - * @param {string|string[]} props.supportKeys The key(s) of the theme support(s) to check. + * @param {Object} props The component props. + * @param {React.ReactElement} props.children The children to render if the theme supports the specified features. + * @param {string|string[]} props.supportKeys The key(s) of the theme support(s) to check. * - * @return {JSX.Element|null} The rendered children if the theme supports the specified features, otherwise null. + * @return {React.ReactElement} The rendered children if the theme supports the specified features, otherwise null. */ export default function ThemeSupportCheck( { children, supportKeys } ) { const { postType, themeSupports } = useSelect( ( select ) => { diff --git a/packages/editor/src/components/time-to-read/index.js b/packages/editor/src/components/time-to-read/index.js index 5d748abc3049c..21891273991a2 100644 --- a/packages/editor/src/components/time-to-read/index.js +++ b/packages/editor/src/components/time-to-read/index.js @@ -23,7 +23,7 @@ const AVERAGE_READING_RATE = 189; /** * Component for showing Time To Read in Content. * - * @return {JSX.Element} The rendered TimeToRead component. + * @return {React.ReactNode} The rendered TimeToRead component. */ export default function TimeToRead() { const content = useSelect( diff --git a/packages/editor/src/components/unsaved-changes-warning/index.js b/packages/editor/src/components/unsaved-changes-warning/index.js index 49e2b7edf1f29..d04b1f36abcbb 100644 --- a/packages/editor/src/components/unsaved-changes-warning/index.js +++ b/packages/editor/src/components/unsaved-changes-warning/index.js @@ -10,7 +10,7 @@ import { store as coreStore } from '@wordpress/core-data'; * Warns the user if there are unsaved changes before leaving the editor. * Compatible with Post Editor and Site Editor. * - * @return {Component} The component. + * @return {React.ReactNode} The component. */ export default function UnsavedChangesWarning() { const { __experimentalGetDirtyEntityRecords } = useSelect( coreStore ); diff --git a/packages/editor/src/components/word-count/index.js b/packages/editor/src/components/word-count/index.js index aab562b46b89f..31eb4d6bfd8c3 100644 --- a/packages/editor/src/components/word-count/index.js +++ b/packages/editor/src/components/word-count/index.js @@ -13,7 +13,7 @@ import { store as editorStore } from '../../store'; /** * Renders the word count of the post content. * - * @return {JSX.Element|null} The rendered WordCount component. + * @return {React.ReactNode} The rendered WordCount component. */ export default function WordCount() { const content = useSelect( diff --git a/packages/editor/src/store/actions.js b/packages/editor/src/store/actions.js index 4942e50322e06..9d0de08718cd2 100644 --- a/packages/editor/src/store/actions.js +++ b/packages/editor/src/store/actions.js @@ -35,9 +35,9 @@ import { unlock } from '../lock-unlock'; * Returns an action generator used in signalling that editor has initialized with * the specified post object and editor settings. * - * @param {Object} post Post object. - * @param {Object} edits Initial edited attributes object. - * @param {Array?} template Block Template. + * @param {Object} post Post object. + * @param {Object} edits Initial edited attributes object. + * @param {Array} [template] Block Template. */ export const setupEditor = ( post, edits, template ) => @@ -157,8 +157,8 @@ export function setEditedPost( postType, postId ) { * Returns an action object used in signalling that attributes of the post have * been edited. * - * @param {Object} edits Post attributes to edit. - * @param {Object} options Options for the edit. + * @param {Object} edits Post attributes to edit. + * @param {Object} [options] Options for the edit. * * @example * ```js @@ -195,7 +195,7 @@ export const editPost = /** * Action for saving the current post in the editor. * - * @param {Object} options + * @param {Object} [options] */ export const savePost = ( options = {} ) => @@ -375,7 +375,8 @@ export const trashPost = * autosaving (e.g. on the Web, the post might be committed to Session * Storage). * - * @param {Object?} options Extra flags to identify the autosave. + * @param {Object} [options] Extra flags to identify the autosave. + * @param {boolean} [options.local] Whether to perform a local autosave. */ export const autosave = ( { local = false, ...options } = {} ) => @@ -598,8 +599,8 @@ export function unlockPostAutosaving( lockName ) { /** * Returns an action object used to signal that the blocks have been updated. * - * @param {Array} blocks Block Array. - * @param {?Object} options Optional options. + * @param {Array} blocks Block Array. + * @param {Object} [options] Optional options. */ export const resetEditorBlocks = ( blocks, options = {} ) => From 21ee975dbc831588cecda74af7a93dedb615448b Mon Sep 17 00:00:00 2001 From: Sukhendu Sekhar Guria Date: Mon, 25 Nov 2024 15:44:12 +0530 Subject: [PATCH 02/23] Fix: Preserve Display Preview State in File Block (#67263) Co-authored-by: Sukhendu2002 Co-authored-by: Mamaduka Co-authored-by: MadtownLems --- packages/block-library/src/file/edit.js | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/packages/block-library/src/file/edit.js b/packages/block-library/src/file/edit.js index 937eb3d28eb19..838b807507d31 100644 --- a/packages/block-library/src/file/edit.js +++ b/packages/block-library/src/file/edit.js @@ -128,15 +128,21 @@ function FileEdit( { attributes, isSelected, setAttributes, clientId } ) { } const isPdf = newMedia.url.endsWith( '.pdf' ); + const pdfAttributes = { + displayPreview: isPdf + ? attributes.displayPreview ?? true + : undefined, + previewHeight: isPdf ? attributes.previewHeight ?? 600 : undefined, + }; + setAttributes( { href: newMedia.url, fileName: newMedia.title, textLinkHref: newMedia.url, id: newMedia.id, - displayPreview: isPdf ? true : undefined, - previewHeight: isPdf ? 600 : undefined, fileId: `wp-block-file--media-${ clientId }`, blob: undefined, + ...pdfAttributes, } ); setTemporaryURL(); } From a6a04bebfb96f47df6c1f238c0fe63233d6dd3f5 Mon Sep 17 00:00:00 2001 From: Bernie Reiter <96308+ockham@users.noreply.github.com> Date: Mon, 25 Nov 2024 11:20:51 +0100 Subject: [PATCH 03/23] Terms: Respect order specified by register_taxonomy() (#67154) It is possible to supply a default set of `args` to `register_taxonomy()` which will be used when querying a list of terms -- for example, `orderby` in order to specify how the resulting list of terms should be sorted. This commit makes it so that the list of terms returned by the Terms REST API controller respects that order. Co-authored-by: ockham Co-authored-by: jsnajdr --- backport-changelog/6.8/7848.md | 3 +++ lib/compat/wordpress-6.8/rest-api.php | 29 +++++++++++++++++++++++++++ 2 files changed, 32 insertions(+) create mode 100644 backport-changelog/6.8/7848.md diff --git a/backport-changelog/6.8/7848.md b/backport-changelog/6.8/7848.md new file mode 100644 index 0000000000000..84600eb4847cd --- /dev/null +++ b/backport-changelog/6.8/7848.md @@ -0,0 +1,3 @@ +https://github.com/WordPress/wordpress-develop/pull/7848 + +* https://github.com/WordPress/gutenberg/pull/67154 diff --git a/lib/compat/wordpress-6.8/rest-api.php b/lib/compat/wordpress-6.8/rest-api.php index da1b657cda078..080e4003f57b3 100644 --- a/lib/compat/wordpress-6.8/rest-api.php +++ b/lib/compat/wordpress-6.8/rest-api.php @@ -20,3 +20,32 @@ function gutenberg_add_post_type_rendering_mode() { } } add_action( 'rest_api_init', 'gutenberg_add_post_type_rendering_mode' ); + +// When querying terms for a given taxonomy in the REST API, respect the default +// query arguments set for that taxonomy upon registration. +function gutenberg_respect_taxonomy_default_args_in_rest_api( $args ) { + // If a `post` argument is provided, the Terms controller will use + // `wp_get_object_terms`, which respects the default query arguments, + // so we don't need to do anything. + if ( ! empty( $args['post'] ) ) { + return $args; + } + + $t = get_taxonomy( $args['taxonomy'] ); + if ( isset( $t->args ) && is_array( $t->args ) ) { + $args = array_merge( $args, $t->args ); + } + return $args; +} +add_action( + 'registered_taxonomy', + function ( $taxonomy ) { + add_filter( "rest_{$taxonomy}_query", 'gutenberg_respect_taxonomy_default_args_in_rest_api' ); + } +); +add_action( + 'unregistered_taxonomy', + function ( $taxonomy ) { + remove_filter( "rest_{$taxonomy}_query", 'gutenberg_respect_taxonomy_default_args_in_rest_api' ); + } +); From 814bb4e380293ab79704682a067ff980d24c6a8c Mon Sep 17 00:00:00 2001 From: George Mamadashvili Date: Mon, 25 Nov 2024 14:45:29 +0400 Subject: [PATCH 04/23] Editor: Update focus return handler for the Featured Image (#67236) Co-authored-by: Mamaduka Co-authored-by: afercia --- .../components/post-featured-image/index.js | 30 +++++++++---------- 1 file changed, 14 insertions(+), 16 deletions(-) diff --git a/packages/editor/src/components/post-featured-image/index.js b/packages/editor/src/components/post-featured-image/index.js index 46a194f311a5e..acf366506cc41 100644 --- a/packages/editor/src/components/post-featured-image/index.js +++ b/packages/editor/src/components/post-featured-image/index.js @@ -18,7 +18,7 @@ import { Notice, } from '@wordpress/components'; import { isBlobURL } from '@wordpress/blob'; -import { useState, useRef, useEffect } from '@wordpress/element'; +import { useState, useRef } from '@wordpress/element'; import { compose } from '@wordpress/compose'; import { useSelect, withDispatch, withSelect } from '@wordpress/data'; import { @@ -102,17 +102,10 @@ function PostFeaturedImage( { noticeOperations, isRequestingFeaturedImageMedia, } ) { - const toggleRef = useRef(); + const returnsFocusRef = useRef( false ); const [ isLoading, setIsLoading ] = useState( false ); const { getSettings } = useSelect( blockEditorStore ); const { mediaSourceUrl } = getMediaDetails( media, currentPostId ); - const toggleFocusTimerRef = useRef(); - - useEffect( () => { - return () => { - clearTimeout( toggleFocusTimerRef.current ); - }; - }, [] ); function onDropFiles( filesList ) { getSettings().mediaUpload( { @@ -164,6 +157,13 @@ function PostFeaturedImage( { ); } + function returnFocus( node ) { + if ( returnsFocusRef.current && node ) { + node.focus(); + returnsFocusRef.current = false; + } + } + const isMissingMedia = ! isRequestingFeaturedImageMedia && !! featuredImageId && ! media; @@ -203,7 +203,7 @@ function PostFeaturedImage( { ) : (