fix text selection state (#948)

components/Carbon.js

@@ -113,18 +113,21 @@ class Carbon extends React.PureComponent {
   onSelectionChange = changes => {
     if (this.state.selectionAt) {
       const css = [
-        `font-weight: ${changes.bold ? 'bold' : 'initial'}`,
+        changes.bold && `font-weight: ${changes.bold ? 'bold' : 'initial'}`,
-        `font-style: ${changes.italics ? 'italic' : 'initial'}`,
+        changes.italics && `font-style: ${changes.italics ? 'italic' : 'initial'}`,
-        `text-decoration: ${changes.underline ? 'underline' : 'initial'}`,
+        changes.underline && `text-decoration: ${changes.underline ? 'underline' : 'initial'}`,
         changes.color && `color: ${changes.color} !important`
       ]
         .filter(Boolean)
         .join('; ')
-      this.props.editorRef.current.editor.doc.markText(
+
-        this.state.selectionAt.from,
+      if (css) {
-        this.state.selectionAt.to,
+        this.props.editorRef.current.editor.doc.markText(
-        { css }
+          this.state.selectionAt.from,
-      )
+          this.state.selectionAt.to,
+          { css }
+        )
+      }
     }
   }
 

components/SelectionEditor.js

@@ -56,9 +56,9 @@ function SelectionEditor({ onChange }) {
   useKeyboardListener('Escape', () => setOpen(false))
 
   const [state, dispatch] = React.useReducer(reducer, {
-    bold: false,
+    bold: null,
-    italics: false,
+    italics: null,
-    underline: false,
+    underline: null,
     color: null
   })