base-ui-svelte

Meter

A graphical display of a numeric value within a range.

View as Markdown
Storage used 24

API Reference

Props mirror Base UI React where applicable, adapted for Svelte 5. Native HTML attributes for the rendered element are also accepted unless noted.

Meter.Root

Extends div HTML attributes.

PropertyTypeDefaultDescription
valuenumberControlled value.
minnumber
maxnumber
formatIntl.NumberFormatOptions | undefined
getAriaValueText((formattedValue: string, value: number) => string | undefined) | undefined
localeIntl.LocalesArgument | undefined
childrenSnippetContent rendered inside the part.
Data attributeDescription
data-completePresent on the element when applicable.
data-progressingPresent on the element when applicable.

Meter.Indicator

Extends div HTML attributes.

PropertyTypeDefaultDescription
childrenSnippetContent rendered inside the part.
Data attributeDescription
data-completePresent on the element when applicable.
data-progressingPresent on the element when applicable.

Meter.Label

Extends span HTML attributes.

PropertyTypeDefaultDescription
childrenSnippetContent rendered inside the part.
Data attributeDescription
data-completePresent on the element when applicable.
data-progressingPresent on the element when applicable.

Meter.Track

Extends div HTML attributes.

PropertyTypeDefaultDescription
childrenSnippetContent rendered inside the part.
Data attributeDescription
data-completePresent on the element when applicable.
data-progressingPresent on the element when applicable.

Meter.Value

Extends span HTML attributes.

PropertyTypeDefaultDescription
childrenSnippet<[formattedValue: string, value: number]>Content rendered inside the part.
Data attributeDescription
data-completePresent on the element when applicable.
data-progressingPresent on the element when applicable.