How to create an editor in a pane


Hi, I’m working on a package and I want to allow text input inside a pane. Rather than just use a text area or other methods I want to make use of the default atom editor and everything it has to offer. But, for the life of me I cannot workout how to add an editor inside a pane.

Has anyone done this? Ideally to I’d like to have nothing but but the editor, no line numbers or other UI, just the editor portion.

Is this possible?


What is stopping you from using If you’re really wanting to open an editor with everything it has to offer, then just open one, right? Or is there something I’m missing?


Well you can make a new EditorView if that is what you mean?


Hi everyone, Thanks for the responses.

I’ve tested each of the methods suggested and a few more things I could think of. They kinda work but not exactly what I was trying to do. Let me explain a little better.

Essentially I’m trying to create an input ‘console’ in a pane below the active editor. Sure, I could just use a HTML textarea, but I would not get all of the extra niceties.

It would be good to have the atom syntax highlighting, indenting and maybe even the shortcuts and other editor features. But I don’t want tabs, save features, line numbers and other guff … just the core text editor part if that’s possible. I don’t want to reinvent all this if possible.

I’ve attached an image to demonstrate:

Has anyone done anything like this?

Thanks again


The short answer is: No, nobody has done anything exactly like this yet. Or at least, nobody has done anything exactly like this and shared it here :grinning:

You might check the Atom Terminal package though for ideas.


For anyone wanting to do something like this, what eventually worked for me was using a subview:

    @div class: 'editor-container', =>
      @subview 'myEditor', new EditorView(mini: true)

A little extra css and I pretty much had what I needed. I’m sure there are other ways.


I am working on creating an EditorView inside a pane for my Preview package. My progress is documented here:
I am hoping this becomes easier to do. I required EditorView (ReactEditorView, actually, since EditorView for some reason did not work), Editor, and TextBuffer to create a new EditorView to display in a new pane when opening with custom URI.