forked from WordPress/gutenberg
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Footnotes: try with post meta (WordPress#51201)
* wip * wip * wip * higher order reducer * Make links interactive * min diff * Add style * wip * Lock apis * Fix failing tests * Add fn block fixture * Clean up hor * Fix unit test * Don't save ce=false * Fix selection issues * Remove editor style in bock json * Footnotes: try with post meta * Clean up * Add server site render callback * Add fn block if not present * Fix scroll into view * Fix tests * Fix PHP linting * Guard for no meta * clean up * Fix unit tests * Fix package lock * Temporarily use __unstable * Don't do anything if fn is not supported * Add tests and comments * Fix php lint * Fix removal and test * Writing flow: ignore ce false on mouse leave * Insert footnote after selection instead of replacing it * Somewhat fix copy/cut/paste * Keep old footnotes so they can be restored on paste * Address feedback: flatMap * Prefer BFS search over flattenBlocks This should make a difference in performance for large enough posts. * Share RichText.Content with native * Try private api * Try removing private api from native * Try unlocking just in time * Skip JSON.parse for empty string * Fix perf issue --------- Co-authored-by: Miguel Fonseca <[email protected]>
- Loading branch information
1 parent
e7864e5
commit 1e8e111
Showing
36 changed files
with
851 additions
and
97 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,85 @@ | ||
| /** | ||
| * WordPress dependencies | ||
| */ | ||
| import { RawHTML } from '@wordpress/element'; | ||
| import { | ||
| children as childrenSource, | ||
| getSaveElement, | ||
| __unstableGetBlockProps as getBlockProps, | ||
| } from '@wordpress/blocks'; | ||
| import deprecated from '@wordpress/deprecated'; | ||
|
|
||
| /** | ||
| * Internal dependencies | ||
| */ | ||
| import { getMultilineTag } from './utils'; | ||
|
|
||
| export const Content = ( { value, tagName: Tag, multiline, ...props } ) => { | ||
| // Handle deprecated `children` and `node` sources. | ||
| if ( Array.isArray( value ) ) { | ||
| deprecated( 'wp.blockEditor.RichText value prop as children type', { | ||
| since: '6.1', | ||
| version: '6.3', | ||
| alternative: 'value prop as string', | ||
| link: 'https://developer.wordpress.org/block-editor/how-to-guides/block-tutorial/introducing-attributes-and-editable-fields/', | ||
| } ); | ||
|
|
||
| value = childrenSource.toHTML( value ); | ||
| } | ||
|
|
||
| const MultilineTag = getMultilineTag( multiline ); | ||
|
|
||
| if ( ! value && MultilineTag ) { | ||
| value = `<${ MultilineTag }></${ MultilineTag }>`; | ||
| } | ||
|
|
||
| const content = <RawHTML>{ value }</RawHTML>; | ||
|
|
||
| if ( Tag ) { | ||
| const { format, ...restProps } = props; | ||
| return <Tag { ...restProps }>{ content }</Tag>; | ||
| } | ||
|
|
||
| return content; | ||
| }; | ||
|
|
||
| Content.__unstableIsRichTextContent = {}; | ||
|
|
||
| function findContent( blocks, richTextValues = [] ) { | ||
| if ( ! Array.isArray( blocks ) ) { | ||
| blocks = [ blocks ]; | ||
| } | ||
|
|
||
| for ( const block of blocks ) { | ||
| if ( | ||
| block?.type?.__unstableIsRichTextContent === | ||
| Content.__unstableIsRichTextContent | ||
| ) { | ||
| richTextValues.push( block.props.value ); | ||
| continue; | ||
| } | ||
|
|
||
| if ( block?.props?.children ) { | ||
| findContent( block.props.children, richTextValues ); | ||
| } | ||
| } | ||
|
|
||
| return richTextValues; | ||
| } | ||
|
|
||
| function _getSaveElement( { name, attributes, innerBlocks } ) { | ||
| return getSaveElement( | ||
| name, | ||
| attributes, | ||
| innerBlocks.map( _getSaveElement ) | ||
| ); | ||
| } | ||
|
|
||
| export function getRichTextValues( blocks = [] ) { | ||
| getBlockProps.skipFilters = true; | ||
| const values = findContent( | ||
| ( Array.isArray( blocks ) ? blocks : [ blocks ] ).map( _getSaveElement ) | ||
| ); | ||
| getBlockProps.skipFilters = false; | ||
| return values; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,18 @@ | ||
| { | ||
| "$schema": "https://schemas.wp.org/trunk/block.json", | ||
| "apiVersion": 3, | ||
| "name": "core/footnotes", | ||
| "title": "Footnotes", | ||
| "category": "text", | ||
| "description": "", | ||
| "keywords": [ "references" ], | ||
| "textdomain": "default", | ||
| "usesContext": [ "postId", "postType" ], | ||
| "supports": { | ||
| "html": false, | ||
| "multiple": false, | ||
| "inserter": false, | ||
| "reusable": false | ||
| }, | ||
| "style": "wp-block-footnotes" | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,52 @@ | ||
| /** | ||
| * WordPress dependencies | ||
| */ | ||
| import { RichText, useBlockProps } from '@wordpress/block-editor'; | ||
| import { useEntityProp } from '@wordpress/core-data'; | ||
|
|
||
| export default function FootnotesEdit( { context: { postType, postId } } ) { | ||
| const [ meta, updateMeta ] = useEntityProp( | ||
| 'postType', | ||
| postType, | ||
| 'meta', | ||
| postId | ||
| ); | ||
| const footnotes = meta?.footnotes ? JSON.parse( meta.footnotes ) : []; | ||
| return ( | ||
| <ol { ...useBlockProps() }> | ||
| { footnotes.map( ( { id, content } ) => ( | ||
| <li key={ id }> | ||
| <RichText | ||
| id={ id } | ||
| tagName="span" | ||
| value={ content } | ||
| identifier={ id } | ||
| // To do: figure out why the browser is not scrolling | ||
| // into view when it receives focus. | ||
| onFocus={ ( event ) => { | ||
| if ( ! event.target.textContent.trim() ) { | ||
| event.target.scrollIntoView(); | ||
| } | ||
| } } | ||
| onChange={ ( nextFootnote ) => { | ||
| updateMeta( { | ||
| ...meta, | ||
| footnotes: JSON.stringify( | ||
| footnotes.map( ( footnote ) => { | ||
| return footnote.id === id | ||
| ? { | ||
| content: nextFootnote, | ||
| id, | ||
| } | ||
| : footnote; | ||
| } ) | ||
| ), | ||
| } ); | ||
| } } | ||
| />{ ' ' } | ||
| <a href={ `#${ id }-link` }>↩︎</a> | ||
| </li> | ||
| ) ) } | ||
| </ol> | ||
| ); | ||
| } |
Oops, something went wrong.