33 lines
813 B
JavaScript

import { Card, Splitter } from 'antd'
import PropTypes from 'prop-types'
import CodeBlockEditor from './CodeBlockEditor'
import MarkdownDisplay from './MarkdownDisplay'
const MarkdownInput = ({ value, onChange }) => {
return (
<Splitter className={'farmcontrol-splitter'} style={{ height: '100%' }}>
<Splitter.Panel>
<Card>
<CodeBlockEditor
code={value}
onChange={onChange}
language='markdown'
/>
</Card>
</Splitter.Panel>
<Splitter.Panel>
<Card style={{ height: '100%' }}>
<MarkdownDisplay content={value} />
</Card>
</Splitter.Panel>
</Splitter>
)
}
MarkdownInput.propTypes = {
value: PropTypes.string.isRequired,
onChange: PropTypes.func
}
export default MarkdownInput