How to use @wordpress/rich-text - 10 common examples
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.
DefinitelyTyped / DefinitelyTyped / types / wordpress__rich-text / wordpress__rich-text-tests.tsx View on Github 
RT.removeFormat(VALUE, 'foo');
RT.removeFormat(VALUE, 'foo', 10);
//
// replace
//
RT.replace(VALUE, 'foo', 'bar');
RT.replace(VALUE, /foo/, 'bar');
RT.replace(VALUE, 'foo', match => `${match}bar`);
RT.replace(VALUE, /foo/, match => `${match}bar`);
RT.replace(VALUE, 'foo', (match, a, b) => `${match} ${a} ${b}`);
//
// slice
//
RT.slice(VALUE);
RT.slice(VALUE, 10);
RT.slice(VALUE, 10, 20);
//
// split
//
RT.split(VALUE);
RT.split(VALUE, 'foo');
RT.split(VALUE, 5);
RT.split(VALUE, 'foo', 10);
RT.split(VALUE, 5, 10);
RT.split(VALUE, undefined, 5);
//
// toHTMLString
//RT.removeFormat(VALUE, 'foo', 10);
//
// replace
//
RT.replace(VALUE, 'foo', 'bar');
RT.replace(VALUE, /foo/, 'bar');
RT.replace(VALUE, 'foo', match => `${match}bar`);
RT.replace(VALUE, /foo/, match => `${match}bar`);
RT.replace(VALUE, 'foo', (match, a, b) => `${match} ${a} ${b}`);
//
// slice
//
RT.slice(VALUE);
RT.slice(VALUE, 10);
RT.slice(VALUE, 10, 20);
//
// split
//
RT.split(VALUE);
RT.split(VALUE, 'foo');
RT.split(VALUE, 5);
RT.split(VALUE, 'foo', 10);
RT.split(VALUE, 5, 10);
RT.split(VALUE, undefined, 5);
//
// toHTMLString
//
RT.toHTMLString({ value: VALUE });edit(props) {
return <span data-is-active="{props.isActive}">{props.value}</span>;
},
});
//
// remove
//
RT.remove(VALUE);
RT.remove(VALUE, 10);
RT.remove(VALUE, 10, 20);
//
// removeFormat
//
RT.removeFormat(VALUE, 'foo');
RT.removeFormat(VALUE, 'foo', 10);
//
// replace
//
RT.replace(VALUE, 'foo', 'bar');
RT.replace(VALUE, /foo/, 'bar');
RT.replace(VALUE, 'foo', match => `${match}bar`);
RT.replace(VALUE, /foo/, match => `${match}bar`);
RT.replace(VALUE, 'foo', (match, a, b) => `${match} ${a} ${b}`);
//
// slice
//
RT.slice(VALUE);
RT.slice(VALUE, 10);//
RT.join([VALUE, VALUE]);
RT.join([], VALUE);
RT.join([], 'foo');
RT.join([VALUE], 'foo');
//
// registerFormatType
//
RT.registerFormatType('foo', {
tagName: 'span',
className: 'foo',
title: 'Foo',
edit: () => <span>Hello World</span>,
});
RT.registerFormatType('foo', {
tagName: 'span',
className: null,
title: 'Foo',
keywords: ['foo', 'bar', 'baz'],
object: false,
attributes: {
className: 'class',
myFoo: 'data-my-foo',
},
edit(props) {
return <span data-is-active="{props.isActive}">{props.value}</span>;
},
});
//
// removetitle: 'Foo',
keywords: ['foo', 'bar', 'baz'],
object: false,
attributes: {
className: 'class',
myFoo: 'data-my-foo',
},
edit(props) {
return <span data-is-active="{props.isActive}">{props.value}</span>;
},
});
//
// remove
//
RT.remove(VALUE);
RT.remove(VALUE, 10);
RT.remove(VALUE, 10, 20);
//
// removeFormat
//
RT.removeFormat(VALUE, 'foo');
RT.removeFormat(VALUE, 'foo', 10);
//
// replace
//
RT.replace(VALUE, 'foo', 'bar');
RT.replace(VALUE, /foo/, 'bar');
RT.replace(VALUE, 'foo', match => `${match}bar`);
RT.replace(VALUE, /foo/, match => `${match}bar`);keywords: ['foo', 'bar', 'baz'],
object: false,
attributes: {
className: 'class',
myFoo: 'data-my-foo',
},
edit(props) {
return <span data-is-active="{props.isActive}">{props.value}</span>;
},
});
//
// remove
//
RT.remove(VALUE);
RT.remove(VALUE, 10);
RT.remove(VALUE, 10, 20);
//
// removeFormat
//
RT.removeFormat(VALUE, 'foo');
RT.removeFormat(VALUE, 'foo', 10);
//
// replace
//
RT.replace(VALUE, 'foo', 'bar');
RT.replace(VALUE, /foo/, 'bar');
RT.replace(VALUE, 'foo', match => `${match}bar`);
RT.replace(VALUE, /foo/, match => `${match}bar`);
RT.replace(VALUE, 'foo', (match, a, b) => `${match} ${a} ${b}`);object: false,
attributes: {
className: 'class',
myFoo: 'data-my-foo',
},
edit(props) {
return <span data-is-active="{props.isActive}">{props.value}</span>;
},
});
//
// remove
//
RT.remove(VALUE);
RT.remove(VALUE, 10);
RT.remove(VALUE, 10, 20);
//
// removeFormat
//
RT.removeFormat(VALUE, 'foo');
RT.removeFormat(VALUE, 'foo', 10);
//
// replace
//
RT.replace(VALUE, 'foo', 'bar');
RT.replace(VALUE, /foo/, 'bar');
RT.replace(VALUE, 'foo', match => `${match}bar`);
RT.replace(VALUE, /foo/, match => `${match}bar`);
RT.replace(VALUE, 'foo', (match, a, b) => `${match} ${a} ${b}`);RT.replace(VALUE, 'foo', match => `${match}bar`);
RT.replace(VALUE, /foo/, match => `${match}bar`);
RT.replace(VALUE, 'foo', (match, a, b) => `${match} ${a} ${b}`);
//
// slice
//
RT.slice(VALUE);
RT.slice(VALUE, 10);
RT.slice(VALUE, 10, 20);
//
// split
//
RT.split(VALUE);
RT.split(VALUE, 'foo');
RT.split(VALUE, 5);
RT.split(VALUE, 'foo', 10);
RT.split(VALUE, 5, 10);
RT.split(VALUE, undefined, 5);
//
// toHTMLString
//
RT.toHTMLString({ value: VALUE });
RT.toHTMLString({ value: VALUE, multilineTag: 'p' });
//
// toggleFormat
//
RT.toggleFormat(VALUE, FORMAT);//
// slice
//
RT.slice(VALUE);
RT.slice(VALUE, 10);
RT.slice(VALUE, 10, 20);
//
// split
//
RT.split(VALUE);
RT.split(VALUE, 'foo');
RT.split(VALUE, 5);
RT.split(VALUE, 'foo', 10);
RT.split(VALUE, 5, 10);
RT.split(VALUE, undefined, 5);
//
// toHTMLString
//
RT.toHTMLString({ value: VALUE });
RT.toHTMLString({ value: VALUE, multilineTag: 'p' });
//
// toggleFormat
//
RT.toggleFormat(VALUE, FORMAT);
//
// unregisterFormatType
////
// slice
//
RT.slice(VALUE);
RT.slice(VALUE, 10);
RT.slice(VALUE, 10, 20);
//
// split
//
RT.split(VALUE);
RT.split(VALUE, 'foo');
RT.split(VALUE, 5);
RT.split(VALUE, 'foo', 10);
RT.split(VALUE, 5, 10);
RT.split(VALUE, undefined, 5);
//
// toHTMLString
//
RT.toHTMLString({ value: VALUE });
RT.toHTMLString({ value: VALUE, multilineTag: 'p' });
//
// toggleFormat
//
RT.toggleFormat(VALUE, FORMAT);
//
// unregisterFormatType
//
RT.unregisterFormatType('foo');@wordpress/rich-text
Rich text value and manipulation API.
Package Health Score
95 / 100Popular @wordpress/rich-text functions
- @wordpress/rich-text.__unstableChangeListType
- @wordpress/rich-text.__unstableIsActiveListType
- @wordpress/rich-text.__unstableIsListRootSelected
- @wordpress/rich-text.applyFormat
- @wordpress/rich-text.create
- @wordpress/rich-text.getActiveFormat
- @wordpress/rich-text.getTextContent
- @wordpress/rich-text.insert
- @wordpress/rich-text.insertObject
- @wordpress/rich-text.isCollapsed
- @wordpress/rich-text.isEmpty
- @wordpress/rich-text.join
- @wordpress/rich-text.registerFormatType
- @wordpress/rich-text.remove
- @wordpress/rich-text.removeFormat
- @wordpress/rich-text.replace
- @wordpress/rich-text.slice
- @wordpress/rich-text.split
- @wordpress/rich-text.toggleFormat
- @wordpress/rich-text.toHTMLString