How to use the @jupyterlab/rendermime.RenderMimeRegistry function in @jupyterlab/rendermime

// Initialize the command registry with the bindings.
  const commands = new CommandRegistry();
  const useCapture = true;

  // Setup the keydown listener for the document.
  document.addEventListener(
    'keydown',
    event => {
      commands.processKeydownEvent(event);
    },
    useCapture
  );

  // Create the cell widget with a default rendermime instance.
  const rendermime = new RenderMimeRegistry({ initialFactories });

  const cellWidget = new CodeCell({
    rendermime,
    model: new CodeCellModel({})
  }).initializeState();

  // Handle the mimeType for the current kernel.
  session.kernelChanged.connect(() => {
    if (session.kernel) {
      void session.kernel.ready.then(() => {
        const lang = session.kernel!.info!.language_info;
        const mimeType = mimeService.getMimeTypeByLanguage(lang);
        cellWidget.model.mimeType = mimeType;
      });
    }
  });

// Initialize the command registry with the bindings.
  const commands = new CommandRegistry();
  const useCapture = true;

  // Setup the keydown listener for the document.
  document.addEventListener(
    'keydown',
    event => {
      commands.processKeydownEvent(event);
    },
    useCapture
  );

  // Create the cell widget with a default rendermime instance.
  const rendermime = new RenderMimeRegistry({ initialFactories });

  const cellWidget = new CodeCell({
    rendermime,
    model: new CodeCellModel({})
  });

  // Handle the mimeType for the current kernel.
  session.kernelChanged.connect(() => {
    session.kernel.ready.then(() => {
      const lang = session.kernel.info.language_info;
      const mimeType = mimeService.getMimeTypeByLanguage(lang);
      cellWidget.model.mimeType = mimeType;
    });
  });

  // Start the default kernel.

function createApp(manager: ServiceManager.IManager): void {
  // Initialize the command registry with the bindings.
  let commands = new CommandRegistry();
  let useCapture = true;

  // Setup the keydown listener for the document.
  document.addEventListener(
    'keydown',
    event => {
      commands.processKeydownEvent(event);
    },
    useCapture
  );

  let rendermime = new RenderMimeRegistry({
    initialFactories: initialFactories,
    latexTypesetter: new MathJaxTypesetter({
      url: PageConfig.getOption('mathjaxUrl'),
      config: PageConfig.getOption('mathjaxConfig')
    })
  });

  let opener = {
    open: (widget: Widget) => {
      // Do nothing for sibling widgets for now.
    }
  };

  let docRegistry = new DocumentRegistry();
  let docManager = new DocumentManager({
    registry: docRegistry,

// let context = new Context({
//   manager: serviceManager
// })

// let widget = new Widget()

// docManager

// docRegistry.addWidgetExtension('Notebook', new NBWidgetExtension())
// docRegistry

let context = {} as DocumentRegistry.IContext

let contextManager = new ContextManager(context);

const rendermime = new RenderMimeRegistry({ initialFactories });
rendermime.addFactory({
  safe: true,  // false
  mimeTypes: [BOKEHJS_LOAD_MIME_TYPE],
  createRenderer: (options) => new BokehJSLoad(options)
}, 0);

rendermime.addFactory({
  safe: true,  // false
  mimeTypes: [BOKEHJS_EXEC_MIME_TYPE],
  createRenderer: (options) => new BokehJSExec(options, contextManager)
}, -1);

const kernelPromise = Kernel.startNew()

// element should be a `<pre>` tag with some code in it
  let mergedOptions = mergeOptions({ options });
  let $cell = $("<div class="thebelab-cell">");
  let $element = $(element);
  let $output = $element.next(mergedOptions.outputSelector);
  let source = $element.text().trim();
  let renderers = {
    initialFactories: getRenderers(mergedOptions),
  };
  if (mergedOptions.mathjaxUrl) {
    renderers.latexTypesetter = new MathJaxTypesetter({
      url: mergedOptions.mathjaxUrl,
      config: mergedOptions.mathjaxConfig,
    });
  }
  let renderMime = new RenderMimeRegistry(renderers);

  let manager = options.manager;

  renderMime.addFactory(
    {
      safe: false,
      mimeTypes: [WIDGET_MIMETYPE],
      createRenderer: options =&gt; new WidgetRenderer(options, manager),
    },
    1
  );

  let model = new OutputAreaModel({ trusted: true });

  let outputArea = new OutputArea({
    model: model,</div></pre>

// Open the link with the default rendered widget factory,
            // if applicable.
            const factory = docManager.registry.defaultRenderedWidgetFactory(
              path
            );
            const widget = docManager.openOrReveal(path, factory.name);

            // Handle the hash if one has been provided.
            if (widget && id) {
              widget.setFragment(id);
            }
          });
      }
    });
  }
  return new RenderMimeRegistry({
    initialFactories: standardRendererFactories,
    linkHandler: !docManager
      ? undefined
      : {
          handleLink: (node: HTMLElement, path: string, id?: string) => {
            // If node has the download attribute explicitly set, use the
            // default browser downloading behavior.
            if (node.tagName === 'A' && node.hasAttribute('download')) {
              return;
            }
            app.commandLinker.connectNode(node, CommandIDs.handleLink, {
              path,
              id
            });
          }
        },

renderCell($element) {
        const outputArea = new OutputArea({
            model: new OutputAreaModel({ trusted: true }),
            rendermime: new RenderMimeRegistry({
                initialFactories: this.getRenderers()
            })
        });

        const $cell = this._$('div', this.classNames.cell);
        $element.replaceWith($cell);
        const $input = this._$('div', this.classNames.input);
        $cell.appendChild($input);
        const $button = this._$('button', this.classNames.button, 'run');
        $cell.appendChild($button);
        const $output = this._$('div', this.classNames.output);
        $cell.appendChild($output);
        Widget.attach(outputArea, $output);

        const cm = new CodeMirror($input, {
            value: $element.textContent.trim(),

manager.ready.then(() => {
    let kind = PageConfig.getOption('kind') as KindType;
    let path = PageConfig.getOption('path');
    const rendermime = new RenderMimeRegistry({
      initialFactories: initialFactories,
      latexTypesetter: new MathJaxTypesetter({
        url: PageConfig.getOption('mathjaxUrl'),
        config: PageConfig.getOption('mathjaxConfig')
      })
    });

    ReactDOM.render(
      ,
      document.getElementById('everything-container')
    );

export function matplotlib(app: HTMLDivElement) {
  const code = [
    'import numpy as np',
    'import matplotlib.pyplot as plt',
    '%matplotlib inline',
    'x = np.linspace(-10,10)',
    'y = x**2',
    'print(x)',
    'print(y)',
    'plt.plot(x, y)'
  ].join('\n');
  const model = new OutputAreaModel();
  const rendermime = new RenderMimeRegistry({ initialFactories });
  const outputArea = new OutputArea({ model, rendermime });

  Kernel.startNew().then(kernel => {
    outputArea.future = kernel.requestExecute({ code });
    app.appendChild(outputArea.node);
  });

  return { model, code }
}

function showDiff(data: {base: nbformat.INotebookContent, diff: IDiffEntry[]}): Promise {


  let rendermime = new RenderMimeRegistry({
    initialFactories: rendererFactories,
    sanitizer: defaultSanitizer,
    latexTypesetter: new MathJaxTypesetter({
      url: getConfigOption('mathjaxUrl'),
      config: getConfigOption('mathjaxConfig'),
    }),
  });

  let nbdModel = new NotebookDiffModel(data.base, data.diff);
  let nbdWidget = new NotebookDiffWidget(nbdModel, rendermime);

  let root = document.getElementById('nbdime-root');
  if (!root) {
    throw new Error('Missing root element "nbidme-root"');
  }
  root.innerHTML = '';