Cannot align text using align buttons in static Toolbar

Uncaught TypeError: _this.props.setAlignment is not a function
    at BlockAlignmentButton._this.activate (bundle.js:19195)
    at Object.ReactErrorUtils.invokeGuardedCallback (bundle.js:19888)
    at executeDispatch (bundle.js:19672)
    at Object.executeDispatchesInOrder (bundle.js:19695)
    at executeDispatchesAndRelease (bundle.js:15722)
    at executeDispatchesAndReleaseTopLevel (bundle.js:15733)
    at Array.forEach (<anonymous>)
    at forEachAccumulated (bundle.js:28111)
    at Object.processEventQueue (bundle.js:15933)
    at runEventQueueInBatch (bundle.js:51468)

[avinesse]

I also have this issue. Here is what the code is :

import createInlineToolbarPlugin from 'draft-js-inline-toolbar-plugin';
import { AlignBlockCenterButton } from 'draft-js-buttons';
import Editor from 'draft-js-plugins-editor';

class TextEditor extends Component {
  constructor(props) {
    super(props);
    let InlineToolbarStructure = [AlignBlockCenterButton];

    let InlineToolbarPlugin = createInlineToolbarPlugin({
      structure: InlineToolbarStructure,
    });
    let pluginsArray = [InlineToolbarPlugin];
    this.state = {
      plugins: pluginsArray,
    };
  }

  render() {
    let { plugins } = this.state;

    let InlineToolbar = plugins[0].InlineToolbar;
    let classes = [];
    let props = {};

    return (
      <div {...props}>
        <Editor
          [...some onChange, onBlur, etc.]
          plugins={plugins}
        />
        <InlineToolbar />
      </div>
    );
  }
}

react version is 16.0.0 react-dom is also 16.0.0

The error is the same as above, and appears when clicking on the ‘center’ icon present in the toolbar.

Uncaught TypeError: _this.props.setAlignment is not a function
    at BlockAlignmentButton._this.activate (createBlockAlignmentButton.js?c7ca:45)
    at HTMLUnknownElement.callCallback (react-dom.development.js?cada:104)
    at Object.invokeGuardedCallbackDev (react-dom.development.js?cada:142)
    at Object.invokeGuardedCallback (react-dom.development.js?cada:191)
    at Object.invokeGuardedCallbackAndCatchFirstError (react-dom.development.js?cada:205)
    at executeDispatch (react-dom.development.js?cada:470)
    at executeDispatchesInOrder (react-dom.development.js?cada:492)
    at executeDispatchesAndRelease (react-dom.development.js?cada:590)
    at executeDispatchesAndReleaseTopLevel (react-dom.development.js?cada:601)
    at forEachAccumulated (react-dom.development.js?cada:571)

[juliankrispel]

Since we don’t have enough info to reproduce this bug we’ll need to close it. If you disagree please leave a comment and we’ll take it from there.