I just started using grapesjs and I'm trying tobuild a simple web builder using grapesjs, I customized my editor's UI. I'm trying to add a view code button similar to the one in grapesjs Demo that shows the source code in a modal like this one grapesjs code modal

right now I added the export button to my panel

const editor = grapesjs.init({
  ...
  // panels config
  panels: {
    defaults: [
      {
        id: "basic-actions",
        el: "#actions",
        buttons: [
          {
            id: "visibility",
            active: true,
            label: "<i class='fa-solid fa-eye'></i>",
            command: "sw-visibility",
          },
          {
            id: "save",
            label: "<i class='fa fa-paper-plane btn-save'></i>",
            command: "save-project",
          },
          {
            id: "cmd-clear",
            label: "<i class='fa-solid fa-trash'></i>",
            command: "cmd-clear",
          },
          {
            id: "undo",
            label: "<i class='fa-solid fa-undo'></i>",
            command: "undo",
          },
          {
            id: "redo",
            label: "<i class='fa-solid fa-redo'></i>",
            command: "redo",
          },
          {
            id: "export",
            label: "<i class='fa-solid fa-download'></i>",
            command: "export",
          },
        ]
      },
    ]
  },
})

now I'm want to set the code to "export" command so I can show that modal here I'm stuck

editor.Commands.add('export', {
  run: (editor) => {
    // what to do ???
    console.log(editor.getHtml())
  }
})