How to use the @wordpress/rich-text.create function in @wordpress/rich-text

To help you get started, we’ve selected a few @wordpress/rich-text examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github WordPress / gutenberg / packages / format-library / src / link / modal.native.js View on Github external
const { isActive, onChange, speak, value } = this.props;
		const { inputValue, opensInNewWindow, text } = this.state;
		const url = prependHTTP( inputValue );
		const linkText = text || inputValue;
		const format = createLinkFormat( {
			url,
			opensInNewWindow,
			text: linkText,
		} );

		if ( isCollapsed( value ) && ! isActive ) { // insert link
			const toInsert = applyFormat( create( { text: linkText } ), format, 0, linkText.length );
			const newAttributes = insert( value, toInsert );
			onChange( { ...newAttributes, needsSelectionUpdate: true } );
		} else if ( text !== getTextContent( slice( value ) ) ) { // edit text in selected link
			const toInsert = applyFormat( create( { text } ), format, 0, text.length );
			const newAttributes = insert( value, toInsert, value.start, value.end );
			onChange( { ...newAttributes, needsSelectionUpdate: true } );
		} else { // transform selected text into link
			const newAttributes = applyFormat( value, format );
			onChange( { ...newAttributes, needsSelectionUpdate: true } );
		}

		if ( ! isValidHref( url ) ) {
			speak( __( 'Warning: the link has been inserted but may have errors. Please test it.' ), 'assertive' );
		} else if ( isActive ) {
			speak( __( 'Link edited.' ), 'assertive' );
		} else {
			speak( __( 'Link inserted' ), 'assertive' );
		}

		this.props.onClose();
github dsifford / academic-bloggers-toolkit / src / js / gutenberg / formats / citation / citation.tsx View on Github external
// that citation format.
    else {
        const formats = getNeighbors(NAME, value);
        if (formats.length > 0) {
            for (const format of formats) {
                format.attributes = format.attributes || {};
                format.attributes = {
                    ...format.attributes,
                    items: mergeItems(selectedItems, format.attributes.items),
                };
            }
            onChange(value);
        }
        // Otherwise just insert a new citation format.
        else {
            const newValue = create({
                html: CitationElement.create(selectedItems),
            });
            onChange(insert(value, newValue));
        }
    }
    return parseCitations();
}
github WordPress / gutenberg / packages / block-editor / src / store / effects.js View on Github external
);

		// A robust way to retain selection position through various transforms
		// is to insert a special character at the position and then recover it.
		const START_OF_SELECTED_AREA = '\u0086';

		// Clone the blocks so we don't insert the character in a "live" block.
		const cloneA = cloneBlock( blockA );
		const cloneB = cloneBlock( blockB );

		if ( hasTextSelection ) {
			const selectedBlock = clientId === clientIdA ? cloneA : cloneB;
			const html = selectedBlock.attributes[ attributeKey ];
			const selectedBlockType = clientId === clientIdA ? blockAType : blockBType;
			const multilineTag = selectedBlockType.attributes[ attributeKey ].multiline;
			const value = insert( create( {
				html,
				multilineTag,
			} ), START_OF_SELECTED_AREA, offset, offset );

			selectedBlock.attributes[ attributeKey ] = toHTMLString( {
				value,
				multilineTag,
			} );
		}

		// We can only merge blocks with similar types
		// thus, we transform the block to merge first
		const blocksWithTheSameType = blockA.name === blockB.name ?
			[ cloneB ] :
			switchToBlockType( cloneB, blockA.name );
github WordPress / gutenberg / packages / format-library / src / link / inline.js View on Github external
submitLink( event ) {
		const { isActive, value, onChange, speak } = this.props;
		const { inputValue, opensInNewWindow } = this.state;
		const url = prependHTTP( inputValue );
		const selectedText = getTextContent( slice( value ) );
		const format = createLinkFormat( {
			url,
			opensInNewWindow,
			text: selectedText,
		} );

		event.preventDefault();

		if ( isCollapsed( value ) && ! isActive ) {
			const toInsert = applyFormat( create( { text: url } ), format, 0, url.length );
			onChange( insert( value, toInsert ) );
		} else {
			onChange( applyFormat( value, format ) );
		}

		this.resetState();

		if ( ! isValidHref( url ) ) {
			speak( __( 'Warning: the link has been inserted but may have errors. Please test it.' ), 'assertive' );
		} else if ( isActive ) {
			speak( __( 'Link edited.' ), 'assertive' );
		} else {
			speak( __( 'Link inserted.' ), 'assertive' );
		}
	}
github WordPress / gutenberg / packages / components / src / autocomplete / index.js View on Github external
insertCompletion( replacement ) {
		const { open, query } = this.state;
		const { record, onChange } = this.props;
		const end = record.start;
		const start = end - open.triggerPrefix.length - query.length;
		const toInsert = create( { html: renderToString( replacement ) } );

		onChange( insert( record, toInsert, start, end ) );
	}
github WordPress / gutenberg / packages / editor / src / components / post-title / index.native.js View on Github external
onPaste( { value, onChange, plainText } ) {
		const content = pasteHandler( {
			plainText,
			mode: 'INLINE',
			tagName: 'p',
		} );

		if ( typeof content === 'string' ) {
			const valueToInsert = create( { html: content } );
			onChange( insert( value, valueToInsert ) );
		}
	}
github WordPress / gutenberg / packages / editor / src / components / document-outline / index.js View on Github external
( item.level !== 1 || ( ! hasMultipleH1 && ! hasTitle ) )
					);
					prevHeadingLevel = item.level;

					return (
						 onSelectHeading( item.clientId ) }
							path={ item.path }
						>
							{ item.isEmpty ?
								emptyHeadingContent :
								getTextContent(
									create( { html: item.attributes.content } )
								)
							}
							{ isIncorrectLevel && incorrectLevelContent }
							{ item.level === 1 && hasMultipleH1 && multipleH1Headings }
							{ hasTitle && item.level === 1 && ! hasMultipleH1 && singleH1Headings }
						
					);
				} ) }