Lynx/Modules/OTA Update UI/UpdateProgress
@sigx/lynx-updates-ui · Beta · Component library

UpdateProgress#

An inline progress bar + percent label, visible only while an update is downloading. Place it wherever you want to surface download progress.

Import#

TSX
import { UpdateProgress } from '@sigx/lynx-updates-ui';

Usage#

<UpdateProgress> renders a Progress bar bound to the download plus a percent label while status === 'downloading', and an out-of-flow zero-size placeholder otherwise — so you can leave it mounted anywhere (a settings row, a toolbar) without it taking up space when idle.

TSX
import { UpdateProgress } from '@sigx/lynx-updates-ui';

<UpdateProgress color="primary" />

When the server sent no Content-Length the percent is unknown, so the label falls back to the received byte count.

Props#

PropTypeDefaultDescription
colorProgressColortheme defaultProgress bar color (a daisy semantic color).
classstringExtra class for the row container.

ProgressColor comes from @sigx/lynx-daisyui.

The closed-state placeholder uses the same out-of-flow zero-size shape as daisyUI's Modal (the lynx display:none caveat).