Import
import { Meter } from "@typed/ui";Access Meter.Meter through the imported Meter export. Its declaration below describes the member.
This public exposure is a re-export. Its import path is supported; declaration documentation is shared with the other public exposures below.
Signatures
export declare function Meter<const Options extends MeterOptions, const Host extends HostResult = never>(options: Options, host?: Dom.HostOverride<Dom.RenderHostProps<Options, MeterInternalProps<Options>>, Options["content"], Host>): import("./Dom/Types.js").HostComponent<Options | Host>;Examples
import { RefSubject } from "@typed/fx";
import { html } from "@typed/template";
import { component } from "@typed/ui/Component";
import * as Meter from "@typed/ui/Meter";
export const StorageUsage = component(function* () {
const state = yield* Meter.makeState({ value: 64 });
const description = RefSubject.map(state, ({ value }) => `${value} GB of 100 GB used`);
return html`<section>
<label for="storage-meter">Storage used</label>
${Meter.Meter({
state, min: 0, max: 100, low: 60, high: 85, optimum: 0,
content: description,
props: { id: "storage-meter", "aria-valuetext": description },
})}
<p>${description}</p>
</section>`;
});Other public imports
These import paths expose the same declaration. Each page retains its own public name and signature.