How to use the draft-js.RichUtils.toggleInlineStyle function in draft-js

export function editorStateSettingTextStyle(editorState, groupPrefix, groupValue) {
  // TODO: Get all inine styles in selected area, not just at insertion point
  const currentStyle = editorState.getCurrentInlineStyle();
  const currentGroupKeys = currentStyle.filter(value => value.startsWith(groupPrefix));
  const nextGroupKey = groupValue ? `${groupPrefix}${groupValue}` : null;

  let nextEditorState = editorState;

  if (currentGroupKeys.count() !== 1 || currentGroupKeys[0] !== nextGroupKey) {
    for (const key of currentGroupKeys) {
      nextEditorState = RichUtils.toggleInlineStyle(nextEditorState, key);
    }
  }
  if (nextGroupKey) {
    nextEditorState = RichUtils.toggleInlineStyle(nextEditorState, nextGroupKey);
  }
  return nextEditorState;
}

it('should export custom + default + customStyleMap styles', () => {
    const editorState = new Raw()
      .addBlock('block 1')
      .anchorKey(0)
      .focusKey(5)
      .toEditorState();
    const newEditorStat1 = RichUtils.toggleInlineStyle(editorState, 'BOLD');
    const newEditorStat2 = RichUtils.toggleInlineStyle(newEditorStat1, 'MARK');
    const newEditorState3 = styles.color.add(newEditorStat2, 'red');
    const newEditorState4 = styles.backgroundColor.add(newEditorState3, 'green');
    const inlineStyles = exporter(newEditorState4);
    expect(inlineStyles).to.deep.equal({
      CUSTOM_COLOR_red: {
        style: {
          color: 'red',
        },
      },
      BOLD: {
        style: {
          fontWeight: 'bold',
        },
      },
      MARK: {
        style: {

private onItalicClick = () => {
    this.onChange(RichUtils.toggleInlineStyle(this.state.editorState, "ITALIC"));
  }

_toggleInlineStyle(inlineStyle) {
      this.onChange(
        RichUtils.toggleInlineStyle(
          this.props.editorState,
          inlineStyle
        )
      );
    }

_toggleInlineStyle(inlineStyle) {
		const {onChange, editorState} = this.props;

		onChange(
			RichUtils.toggleInlineStyle(
				editorState,
				inlineStyle
			)
		);
	}

onHighlight = () => {
        this.onChange(RichUtils.toggleInlineStyle(this.state.editorState, 'HIGHLIGHT'))
    }

const handleStyleChange = style => {
    onChange(RichUtils.toggleInlineStyle(editorState, style));
  };
  const handleBoldClick = event => {

nextEditorState = currentStyle.reduce((state, color) => {
        return RichUtils.toggleInlineStyle(state, color);
      }, nextEditorState);
    }

const { editorState, selection, currentInlineStyle, fontFamilies } = this.props;

    const nextContentState = fontFamilies.reduce((contentState, item) => {
      return Modifier.removeInlineStyle(contentState, selection, `FONTFAMILY-${item.name}`);
    }, editorState.getCurrentContent());

    let nextEditorState = EditorState.push(editorState, nextContentState, 'change-inline-style');

    if (selection.isCollapsed()) {
      nextEditorState = currentInlineStyle.reduce((state, fontFamily) => {
        return RichUtils.toggleInlineStyle(state, fontFamily);
      }, nextEditorState);
    }

    if (!currentInlineStyle.has(toggledFontFamily)) {
      nextEditorState = RichUtils.toggleInlineStyle(nextEditorState, toggledFontFamily);
    }

    this.props.onChange(nextEditorState);
  };
  render() {

_toggleInlineStyle(inlineStyle) {
    this.onChange(
      RichUtils.toggleInlineStyle(this.props.editorState, inlineStyle)
    );
  }