diff --git a/components/Carbon.js b/components/Carbon.js
index b81c1f5..fbffbf6 100644
--- a/components/Carbon.js
+++ b/components/Carbon.js
@@ -9,34 +9,7 @@ import WindowControls from '../components/WindowControls'
import Watermark from '../components/svg/Watermark'
import { COLORS, LANGUAGE_MODE_HASH, LANGUAGE_NAME_HASH, DEFAULT_SETTINGS } from '../lib/constants'
-const handleLanguageChange = (newCode, props) => {
- if (props.config.language === 'auto') {
- // try to set the language
- const detectedLanguage = hljs.highlightAuto(newCode).language
- const languageMode =
- LANGUAGE_MODE_HASH[detectedLanguage] || LANGUAGE_NAME_HASH[detectedLanguage]
-
- if (languageMode) {
- return { language: languageMode.mime || languageMode.mode }
- }
- }
- return { language: props.config.language }
-}
-
class Carbon extends React.PureComponent {
- constructor(props) {
- super(props)
-
- this.state = {
- ...handleLanguageChange(this.props.children, this.props)
- }
-
- this.handleTitleBarChange = this.handleTitleBarChange.bind(this)
- this.codeUpdated = this.codeUpdated.bind(this)
- this.onBeforeChange = this.onBeforeChange.bind(this)
- this.handleLanguageChange = this.handleLanguageChange.bind(this)
- }
-
componentDidMount() {
const ro = new ResizeObserver(entries => {
const cr = entries[0].contentRect
@@ -45,30 +18,38 @@ class Carbon extends React.PureComponent {
ro.observe(this.exportContainerNode)
}
- codeUpdated(newCode) {
- this.handleLanguageChange(newCode, this.props)
- this.props.updateCode(newCode)
- }
-
- handleTitleBarChange(newTitle) {
- this.props.updateTitleBar(newTitle)
- }
-
handleLanguageChange = debounce(
- (...args) => this.setState(handleLanguageChange(...args)),
+ (newCode, language) => {
+ if (language === 'auto') {
+ // try to set the language
+ const detectedLanguage = hljs.highlightAuto(newCode).language
+ const languageMode =
+ LANGUAGE_MODE_HASH[detectedLanguage] || LANGUAGE_NAME_HASH[detectedLanguage]
+
+ if (languageMode) {
+ return languageMode.mime || languageMode.mode
+ }
+ }
+
+ return language
+ },
ms('300ms'),
- { trailing: true }
+ {
+ leading: true,
+ trailing: true
+ }
)
- onBeforeChange(editor, meta, code) {
- return this.codeUpdated(code)
- }
+ onBeforeChange = (editor, meta, code) => this.props.updateCode(code)
render() {
const config = { ...DEFAULT_SETTINGS, ...this.props.config }
+
+ const languageMode = this.handleLanguageChange(this.props.children, config.language)
+
const options = {
lineNumbers: config.lineNumbers,
- mode: this.state.language || 'plaintext',
+ mode: languageMode || 'plaintext',
theme: config.theme,
scrollBarStyle: null,
viewportMargin: Infinity,
@@ -87,7 +68,7 @@ class Carbon extends React.PureComponent {
) : null}