You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
carbon/components/Carbon.js

42 lines
953 B
JavaScript

// Theirs
import React from 'react'
import { Provider } from 'unstated'
import HTML5Backend from 'react-dnd-html5-backend'
import { DragDropContext } from 'react-dnd'
// Ours
import EditorContainer from '../containers/Editor'
import Editor from './Editor'
import Toolbar from './Toolbar'
import { COLORS } from '../lib/constants'
class Carbon extends React.Component {
constructor(props) {
super(props)
this.inject = [new EditorContainer(props)]
}
render() {
return (
<Provider inject={this.inject}>
<div id="carbon">
<Toolbar />
<Editor />
</div>
<style jsx>
{`
#carbon {
background: ${COLORS.BLACK};
border: 3px solid ${COLORS.SECONDARY};
border-radius: 8px;
padding: 16px;
}
`}
</style>
</Provider>
)
}
}
export default DragDropContext(HTML5Backend)(Carbon)