create a panel at the bottom of editor

Hello. Does anybody know how to create a panel at the bottom of the editor?
What I have so far

   public p: Panel = {
    dom: document.getElementById("panel"),
    mount: () => {
      console.log("panels has been added")

  public f = function (view: EditorView) {
    return this.p
this.state = EditorState.create({
      doc: this.starterCode,
      extensions: [showPanel.of(this.f(this.editorView))]
this.editorView = new EditorView({
      state: this.state,
      parent: document.querySelector(".editor")

does not work… I have been stuck on this for a while. Any suggestions are appreciated!! Thank you!

Looks like you’re using TypeScript, but there’s a type error in your code—showPanel.of takes the function, not the result of calling it, as argument. Also, if you want the panel at the top, you’re going to have to add a top: true property to your panel object.

Hi. I want to show it at the bottom. And after I get the type correct it’s still not showing in the bottom. Is the constructor function not correct? Thank you!