Overscan shell

OVERSCANUI KIT

Tab completion does not guess. Type v and press tab: it completes only as far as everything agrees and then lists the candidates, because silently picking the first match is the same invention as a readout drawing a number it does not have. Two more: the echo shows what will run rather than what you typed, since an echo that shows your typing while running something else is a display disagreeing with its machine; and a failure says why, because "error" is not a message. Arrow keys walk the history. Try vent, v+tab, and xyz.

demo/cli.html, from this page

import 'overscan'
import 'overscan/overscan.css'

<ov-cli
  prompt=">"
  commands="status,scan,vent,ventilate,verify,purge,calibrate,halt"
  label="command for terminal"
></ov-cli>

const banner = await fetch('./data/cli-0-banner.json').then(r => r.json())
document.querySelector('ov-cli').setAttribute('banner', banner)

import { OvCli } from 'overscan/react'

const banner = await fetch('./data/cli-0-banner.json').then(r => r.json())

<OvCli
  prompt=">"
  commands="status,scan,vent,ventilate,verify,purge,calibrate,halt"
  label="command for terminal"
  banner={banner}
/>

import { OvCli } from 'overscan/vue'

const banner = await fetch('./data/cli-0-banner.json').then(r => r.json())

<OvCli
  prompt=">"
  commands="status,scan,vent,ventilate,verify,purge,calibrate,halt"
  label="command for terminal"
  :banner="banner"
/>

import OvCli from 'overscan/svelte/OvCli.svelte'

const banner = await fetch('./data/cli-0-banner.json').then(r => r.json())

<OvCli
  prompt=">"
  commands="status,scan,vent,ventilate,verify,purge,calibrate,halt"
  label="command for terminal"
  banner={banner}
/>

terminal

shell

variation: prompt="$" label="command for industrial"

import 'overscan'
import 'overscan/overscan.css'

<ov-cli
  prompt="$"
  commands="status,scan,vent,ventilate,verify,purge,calibrate,halt"
  label="command for industrial"
></ov-cli>

const banner = await fetch('./data/cli-1-banner.json').then(r => r.json())
document.querySelector('ov-cli').setAttribute('banner', banner)

import { OvCli } from 'overscan/react'

const banner = await fetch('./data/cli-1-banner.json').then(r => r.json())

<OvCli
  prompt="$"
  commands="status,scan,vent,ventilate,verify,purge,calibrate,halt"
  label="command for industrial"
  banner={banner}
/>

import { OvCli } from 'overscan/vue'

const banner = await fetch('./data/cli-1-banner.json').then(r => r.json())

<OvCli
  prompt="$"
  commands="status,scan,vent,ventilate,verify,purge,calibrate,halt"
  label="command for industrial"
  :banner="banner"
/>

import OvCli from 'overscan/svelte/OvCli.svelte'

const banner = await fetch('./data/cli-1-banner.json').then(r => r.json())

<OvCli
  prompt="$"
  commands="status,scan,vent,ventilate,verify,purge,calibrate,halt"
  label="command for industrial"
  banner={banner}
/>

industrial

shell

variation: prompt=">>" label="command for cyber"

import 'overscan'
import 'overscan/overscan.css'

<ov-cli
  prompt="&gt;&gt;"
  commands="status,scan,vent,ventilate,verify,purge,calibrate,halt"
  label="command for cyber"
></ov-cli>

const banner = await fetch('./data/cli-2-banner.json').then(r => r.json())
document.querySelector('ov-cli').setAttribute('banner', banner)

import { OvCli } from 'overscan/react'

const banner = await fetch('./data/cli-2-banner.json').then(r => r.json())

<OvCli
  prompt="&gt;&gt;"
  commands="status,scan,vent,ventilate,verify,purge,calibrate,halt"
  label="command for cyber"
  banner={banner}
/>

import { OvCli } from 'overscan/vue'

const banner = await fetch('./data/cli-2-banner.json').then(r => r.json())

<OvCli
  prompt="&gt;&gt;"
  commands="status,scan,vent,ventilate,verify,purge,calibrate,halt"
  label="command for cyber"
  :banner="banner"
/>

import OvCli from 'overscan/svelte/OvCli.svelte'

const banner = await fetch('./data/cli-2-banner.json').then(r => r.json())

<OvCli
  prompt="&gt;&gt;"
  commands="status,scan,vent,ventilate,verify,purge,calibrate,halt"
  label="command for cyber"
  banner={banner}
/>

cyber

shell

variation: prompt=":" label="command for antiseptic"

import 'overscan'
import 'overscan/overscan.css'

<ov-cli
  prompt=":"
  commands="status,scan,vent,ventilate,verify,purge,calibrate,halt"
  label="command for antiseptic"
></ov-cli>

const banner = await fetch('./data/cli-3-banner.json').then(r => r.json())
document.querySelector('ov-cli').setAttribute('banner', banner)

import { OvCli } from 'overscan/react'

const banner = await fetch('./data/cli-3-banner.json').then(r => r.json())

<OvCli
  prompt=":"
  commands="status,scan,vent,ventilate,verify,purge,calibrate,halt"
  label="command for antiseptic"
  banner={banner}
/>

import { OvCli } from 'overscan/vue'

const banner = await fetch('./data/cli-3-banner.json').then(r => r.json())

<OvCli
  prompt=":"
  commands="status,scan,vent,ventilate,verify,purge,calibrate,halt"
  label="command for antiseptic"
  :banner="banner"
/>

import OvCli from 'overscan/svelte/OvCli.svelte'

const banner = await fetch('./data/cli-3-banner.json').then(r => r.json())

<OvCli
  prompt=":"
  commands="status,scan,vent,ventilate,verify,purge,calibrate,halt"
  label="command for antiseptic"
  banner={banner}
/>

antiseptic

shell

esper

shell

neo

shell

machina

shell

holo

shell

aegis

shell

vector

shell