Shimmer#

Sweeps a brighter highlight band across text over a base color — a subtle loading/attention effect.

Import#

TSX

import { Shimmer } from '@sigx/terminal';

Usage#

TSX

/** @jsxImportSource @sigx/terminal */
import { component, defineApp, Shimmer } from '@sigx/terminal';

const App = component(() => {
    return () => (
        <box>
            <Shimmer text="Loading…" color="dim" highlight="accent" speed={1} />
        </box>
    );
});

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

Props#

Prop	Type	Notes
`text`	`string`	required — the text
`color`	token \| `#hex`	base color
`highlight`	token \| `#hex`	sweep color
`width`	`number`	width of the highlight band
`speed`	`number`	sweep speed

Shimmer#

Import#

Usage#

Props#

See also#