StatusBar#

A footer row of status chips — each item is a key in an accent fill followed by a label.

Import#

TSX

import { StatusBar } from '@sigx/terminal';
import type { StatusItem } from '@sigx/terminal';

Usage#

TSX

/** @jsxImportSource @sigx/terminal */
import { component, defineApp, StatusBar } from '@sigx/terminal';
import type { StatusItem } from '@sigx/terminal';

const items: StatusItem[] = [
    { key: 'MODE', label: 'insert' },
    { key: 'BRANCH', label: 'main' },
    { key: 'LSP', label: 'ready' },
];

const App = component(() => {
    return () => (
        <box>
            <StatusBar items={items} />
        </box>
    );
});

defineApp(<App />).mount({ clearConsole: true });

Props#

Prop	Type	Notes
`items`	`StatusItem[]`	required — the chips

StatusItem#

TypeScript

interface StatusItem {
    key: string;
    label: string;
}

StatusBar#

Import#

Usage#

Props#

StatusItem#

See also#