hunk.code_window:         vertical: 'hidden',
           horizontal: 'hidden',
         },
         overviewRulerLanes: 0,
         minimap: { enabled: false },
       })
       format = async () => {
         model.setValue((await formatCode(props.code, lang())).trim())
  
hunk.labels: keep keep keep keep add keep keep keep keep
hunk.after_edit:       ...editorOptions,
  
hunk.file_path: packages/client/iframes/monaco/index.ts
hunk.type: add
file: import type { Ref, WritableComputedRef } from 'vue'
  import { watch } from 'vue'
  import CodeMirror from 'codemirror'
  import 'codemirror/mode/javascript/javascript'
  import 'codemirror/mode/css/css'
  import 'codemirror/mode/markdown/markdown'
  import 'codemirror/mode/xml/xml'
  import 'codemirror/mode/htmlmixed/htmlmixed'
  import 'codemirror/addon/display/placeholder'
  import 'codemirror/lib/codemirror.css'
  
  export async function useCodeMirror(
    textarea: Ref<HTMLTextAreaElement | null | undefined>,
    input: Ref<string> | WritableComputedRef<string>,
    options: CodeMirror.EditorConfiguration = {},
  ) {
    const cm = CodeMirror.fromTextArea(
      textarea.value!,
      {
        theme: 'vars',
        ...options,
      },
    )
  
    let skip = false
  
    cm.on('change', () => {
      if (skip) {
        skip = false
        return
      }
      input.value = cm.getValue()
    })
  
    watch(
      input,
      (v) => {
        if (v !== cm.getValue()) {
          skip = true
          const selections = cm.listSelections()
          cm.replaceRange(v, cm.posFromIndex(0), cm.posFromIndex(Number.POSITIVE_INFINITY))
          cm.setSelections(selections)
        }
      },
      { immediate: true },
    )
  
    return cm
  }
  