diff --git a/packages/core/src/blocks/Code/block.ts b/packages/core/src/blocks/Code/block.ts index deda19c5d2..fc968b55fe 100644 --- a/packages/core/src/blocks/Code/block.ts +++ b/packages/core/src/blocks/Code/block.ts @@ -117,18 +117,6 @@ export const createCodeBlockSpec = createBlockSpec( if (options.supportedLanguages) { const select = document.createElement("select"); - const handleLanguageChange = (event: Event) => { - const language = (event.target as HTMLSelectElement).value; - - editor.updateBlock(block.id, { props: { language } }); - }; - select.addEventListener("change", handleLanguageChange); - - const selectWrapper = document.createElement("div"); - selectWrapper.contentEditable = "false"; - select.value = - block.props.language || options.defaultLanguage || "text"; - Object.entries(options.supportedLanguages ?? {}).forEach( ([id, { name }]) => { const option = document.createElement("option"); @@ -138,11 +126,23 @@ export const createCodeBlockSpec = createBlockSpec( select.appendChild(option); }, ); - selectWrapper.appendChild(select); - wrapper.appendChild(selectWrapper); + select.value = + block.props.language || options.defaultLanguage || "text"; + const handleLanguageChange = (event: Event) => { + const language = (event.target as HTMLSelectElement).value; + + editor.updateBlock(block.id, { props: { language } }); + }; + select.addEventListener("change", handleLanguageChange); removeSelectChangeListener = () => select.removeEventListener("change", handleLanguageChange); + + const selectWrapper = document.createElement("div"); + selectWrapper.contentEditable = "false"; + + selectWrapper.appendChild(select); + wrapper.appendChild(selectWrapper); } wrapper.appendChild(pre);