application/components/common/simple-editor/inline-style-controls.js

import React from 'react';
import StyleButton from './style-button';

var INLINE_STYLES = [
    {label: 'Bold', style: 'BOLD', icon: 'format_bold'},
    {label: 'Italic', style: 'ITALIC', icon: 'format_italic'},
    {label: 'Underline', style: 'UNDERLINE', icon: 'format_underlined'},
    // {label: 'Monospace', style: 'CODE', icon: 'code'},
];

/**
 * Render inline styles
 */
const InlineStyleControls = (props) => {
    var currentStyle = props.editorState.getCurrentInlineStyle();
    return (
        <div className="simple-editor-controls">
            {INLINE_STYLES.map(type =>
                <StyleButton
                    key={type.label}
                    active={currentStyle.has(type.style)}
                    label={type.label}
                    icon={type.icon}
                    onToggle={props.onToggle}
                    style={type.style}
                />
            )}
            {props.children}
        </div>
    );
};

export default InlineStyleControls;