import '@xterm/xterm/css/xterm.css'
import { DocsTerminal } from 'docsterm/react'
import { createPyodideBackend } from 'docsterm/pyodide'

export const Playground = () => (
  <DocsTerminal
    backend={createPyodideBackend()}
    theme="auto"
  />
)

import '@xterm/xterm/css/xterm.css'
import { DocsTerminal } from 'docsterm'
import { createMockBackend } from 'docsterm/mock'

const term = new DocsTerminal({
  backend: createMockBackend({
    script: {
      'orbit init': { output: 'Project initialized.' },
    },
  }),
})
await term.mount(
  document.querySelector('#terminal'),
)