How to use the @lumino/widgets.SplitPanel function in @lumino/widgets

let rendermime = new RenderMimeRegistry({ initialFactories });

  let editorFactory = editorServices.factoryService.newInlineEditor;
  let contentFactory = new ConsolePanel.ContentFactory({ editorFactory });
  let consolePanel = new ConsolePanel({
    rendermime,
    manager,
    path,
    contentFactory,
    mimeTypeService: editorServices.mimeTypeService
  });
  consolePanel.title.label = TITLE;

  let palette = new CommandPalette({ commands });

  let panel = new SplitPanel();
  panel.id = 'main';
  panel.orientation = 'horizontal';
  panel.spacing = 0;
  SplitPanel.setStretch(palette, 0);
  SplitPanel.setStretch(consolePanel, 1);
  panel.addWidget(palette);
  panel.addWidget(consolePanel);

  // Attach the panel to the DOM.
  Widget.attach(panel, document.body);

  // Handle resize events.
  window.addEventListener('resize', () => {
    panel.update();
  });

constructor() {
    super();
    this.addClass(APPLICATION_SHELL_CLASS);
    this.id = 'main';

    let headerPanel = (this._headerPanel = new Panel());
    let topHandler = (this._topHandler = new Private.PanelHandler());
    let bottomPanel = (this._bottomPanel = new BoxPanel());
    let hboxPanel = new BoxPanel();
    let dockPanel = (this._dockPanel = new DockPanelSvg({
      kind: 'dockPanelBar'
    }));
    MessageLoop.installMessageHook(dockPanel, this._dockChildHook);

    let hsplitPanel = new SplitPanel();
    let leftHandler = (this._leftHandler = new Private.SideBarHandler());
    let rightHandler = (this._rightHandler = new Private.SideBarHandler());
    let rootLayout = new BoxLayout();

    headerPanel.id = 'jp-header-panel';
    topHandler.panel.id = 'jp-top-panel';
    bottomPanel.id = 'jp-bottom-panel';
    hboxPanel.id = 'jp-main-content-panel';
    dockPanel.id = 'jp-main-dock-panel';
    hsplitPanel.id = 'jp-main-split-panel';

    leftHandler.sideBar.addClass(SIDEBAR_CLASS);
    leftHandler.sideBar.addClass('jp-mod-left');
    leftHandler.stackedPanel.id = 'jp-left-stack';

    rightHandler.sideBar.addClass(SIDEBAR_CLASS);

let creator = new ToolbarButton({
    iconClassName: 'jp-AddIcon jp-Icon jp-Icon-16',
    onClick: () => {
      void docManager
        .newUntitled({
          type: 'file',
          path: fbModel.path
        })
        .then(model => {
          docManager.open(model.path);
        });
    }
  });
  fbWidget.toolbar.insertItem(0, 'create', creator);

  let panel = new SplitPanel();
  panel.id = 'main';
  panel.addWidget(fbWidget);
  SplitPanel.setStretch(fbWidget, 0);
  let dock = new DockPanel();
  panel.addWidget(dock);
  SplitPanel.setStretch(dock, 1);
  dock.spacing = 8;

  document.addEventListener('focus', event => {
    for (let i = 0; i < widgets.length; i++) {
      let widget = widgets[i];
      if (widget.node.contains(event.target as HTMLElement)) {
        activeWidget = widget;
        break;
      }
    }