diff --git a/components/Carbon.js b/components/Carbon.js
index f8851bd..04f97d8 100644
--- a/components/Carbon.js
+++ b/components/Carbon.js
@@ -129,8 +129,6 @@ class Carbon extends React.PureComponent {
}
}
- closeSelectionEditor = () => this.setState({ selectionAt: null })
-
render() {
const config = { ...DEFAULT_SETTINGS, ...this.props.config }
@@ -313,10 +311,7 @@ class Carbon extends React.PureComponent {
{!this.props.readOnly &&
this.state.selectionAt &&
ReactDOM.createPortal(
- ,
+ ,
// TODO: don't use portal?
document.getElementById('style-editor-button')
)}
diff --git a/components/SelectionEditor.js b/components/SelectionEditor.js
index f1f62bf..3c161b6 100644
--- a/components/SelectionEditor.js
+++ b/components/SelectionEditor.js
@@ -6,7 +6,7 @@ import ColorPicker from './ColorPicker'
import ThemeIcon from './svg/Theme'
import { COLORS } from '../lib/constants'
-const styleEditorButtonStyle = { width: 32, maxWidth: 32, height: 32, borderRadius: '50%' }
+const styleEditorButtonStyle = { width: 28, maxWidth: 28, height: 28, borderRadius: '50%' }
function ModifierButton(props) {
return (
@@ -53,11 +53,12 @@ function reducer(state, action) {
throw new Error('Invalid action')
}
-function SelectionEditor({ onChange, onClose }) {
- useKeyboardListener('Escape', onClose)
+function SelectionEditor({ onChange }) {
const [visible, setVisible] = React.useState(false)
const [open, setOpen] = React.useState(true)
+ useKeyboardListener('Escape', () => setVisible(false))
+
const [state, dispatch] = React.useReducer(reducer, {
bold: false,
italics: false,
@@ -77,7 +78,7 @@ function SelectionEditor({ onChange, onClose }) {
center
selected={visible}
style={styleEditorButtonStyle}
- margin="4px 0 0"
+ margin="6px 0 0"
onClick={() => setVisible(v => !v)}
>