@signalcore/ui 0.1.0 → 1.0.0-beta.1

package/dist/surface/templates/Slots.js

@@ -1,19 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { usePrimitives } from "../../primitives.js";
-import { useLanguage, useParts } from "../../SignalcoreProvider.js";
-import { when } from "../format.js";
-import { useScene } from "../scene.js";
-/** Free times to book: each is a button, and the pick goes back as the `book` action. */
-export function SlotPicker({ read }) {
-    const part = useParts();
-    const { locale } = useLanguage();
-    const { Button } = usePrimitives();
-    const { act } = useScene();
-    const name = read.text("action") ?? "book";
-    return (_jsx("div", { ...part("slots"), children: read.list("slots").map((slot) => {
-            const label = slot.label ?? when(slot.start, locale);
-            return (_jsx(Button, { size: "sm", disabled: !act, onClick: () => {
-                    act?.({ name, data: { slot: slot.id, start: slot.start }, label });
-                }, children: label }, slot.id));
-        }) }));
-}

package/dist/surface/templates/Table.d.ts

@@ -1,3 +0,0 @@
-import type { TemplateProps } from "../scene.js";
-/** Rows of records, one column per `columns` entry; drawn with the host's `Table` if it has one. */
-export declare function DataTable({ read }: TemplateProps): import("react").JSX.Element;

package/dist/surface/templates/Table.js

@@ -1,12 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { usePrimitives } from "../../primitives.js";
-import { display } from "../format.js";
-/** Rows of records, one column per `columns` entry; drawn with the host's `Table` if it has one. */
-export function DataTable({ read }) {
-    const { Table } = usePrimitives();
-    const columns = read.list("columns");
-    const rows = read
-        .list("rows")
-        .map((row) => Object.fromEntries(columns.map((column) => [column.key, display(row[column.key])])));
-    return _jsx(Table, { columns: columns, rows: rows });
-}

package/dist/surface/templates/Text.d.ts

@@ -1,4 +0,0 @@
-import type { TemplateProps } from "../scene.js";
-export declare function Text({ read }: TemplateProps): import("react").JSX.Element;
-/** A line the user should not miss, tinted by its tone (always in words as well). */
-export declare function Callout({ read }: TemplateProps): import("react").JSX.Element;

package/dist/surface/templates/Text.js

@@ -1,15 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useParts } from "../../SignalcoreProvider.js";
-const VARIANTS = new Set(["heading", "caption"]);
-export function Text({ read }) {
-    const part = useParts();
-    const variant = read.text("variant");
-    return (_jsx("p", { ...part("text", [variant && VARIANTS.has(variant) && variant]), children: read.text("text") }));
-}
-const TONES = new Set(["info", "success", "warning", "error"]);
-/** A line the user should not miss, tinted by its tone (always in words as well). */
-export function Callout({ read }) {
-    const part = useParts();
-    const tone = read.text("tone");
-    return _jsx("p", { ...part("callout", [tone && TONES.has(tone) ? tone : "info"]), children: read.text("text") });
-}

package/dist/surface/templates/index.d.ts

@@ -1,7 +0,0 @@
-import type { ComponentType } from "react";
-import type { TemplateProps } from "../scene.js";
-/**
- * The catalog `signalcore-basic.v1`, component by component: the only things a surface can draw.
- * A name that is not here is drawn by nothing, which is what keeps a model from adding markup.
- */
-export declare const TEMPLATES: ReadonlyMap<string, ComponentType<TemplateProps>>;

package/dist/surface/templates/index.js

@@ -1,32 +0,0 @@
-import { Browser } from "./Browser.js";
-import { Chart } from "./Chart.js";
-import { ChoiceList } from "./Choices.js";
-import { Form } from "./Form.js";
-import { KeyValue } from "./KeyValue.js";
-import { Card, Column, Row } from "./Layout.js";
-import { Live } from "./Live.js";
-import { Image, Link } from "./Media.js";
-import { SlotPicker } from "./Slots.js";
-import { DataTable } from "./Table.js";
-import { Callout, Text } from "./Text.js";
-/**
- * The catalog `signalcore-basic.v1`, component by component: the only things a surface can draw.
- * A name that is not here is drawn by nothing, which is what keeps a model from adding markup.
- */
-export const TEMPLATES = new Map([
-    ["Column", Column],
-    ["Row", Row],
-    ["Card", Card],
-    ["Text", Text],
-    ["KeyValue", KeyValue],
-    ["DataTable", DataTable],
-    ["Chart", Chart],
-    ["Callout", Callout],
-    ["Image", Image],
-    ["Link", Link],
-    ["ChoiceList", ChoiceList],
-    ["SlotPicker", SlotPicker],
-    ["Form", Form],
-    ["Browser", Browser],
-    ["Live", Live],
-]);

package/dist/surface/types.d.ts

@@ -1,68 +0,0 @@
-/**
- * The shapes of a surface of the `signalcore-basic.v1` catalog, as the API sends them (see
- * `signalcore_core.ui`). A component's own properties are loose here (`unknown`): they come
- * from a model and are read defensively where they are drawn.
- */
-export interface ComponentData {
-    id: string;
-    component: string;
-    [prop: string]: unknown;
-}
-/**
- * Where a surface goes when it deserves a page of its own (ADR 0011): the `slot` names the
- * place, and showing into a slot that is open replaces what was there; the `title` is what the
- * window is called.
- */
-export interface Placement {
-    slot: string;
-    title: string;
-}
-export interface SurfaceData {
-    id: string;
-    root: string;
-    components: ComponentData[];
-    data?: Record<string, unknown>;
-    /** The text twin: what channels, screen readers and text-only doors show instead. */
-    fallback_text: string;
-    /** Set when the agent placed the surface as a window of the shell instead of in the transcript. */
-    window?: Placement | null;
-}
-/** What the user did on a surface, in the shape the API's `Action` expects. */
-export interface SurfaceAction {
-    surface_id: string;
-    /** The component's action: `choose`, `book`, `submit`. */
-    name: string;
-    data: Record<string, unknown>;
-    /** In words, as the user would say it: "Martes 10:00". */
-    label: string;
-}
-export interface Pair {
-    label: string;
-    value: string;
-}
-export interface TableColumn {
-    key: string;
-    label: string;
-}
-export interface Point {
-    label: string;
-    value: number;
-}
-export interface Option {
-    id: string;
-    label: string;
-    description?: string;
-}
-/** A free time on a `SlotPicker`. */
-export interface TimeSlot {
-    id: string;
-    start: string;
-    label?: string;
-}
-export interface FormField {
-    name: string;
-    label: string;
-    kind: "text" | "number" | "date" | "select" | "checkbox";
-    required?: boolean;
-    options?: Option[];
-}

package/dist/surface/types.js

@@ -1,6 +0,0 @@
-/**
- * The shapes of a surface of the `signalcore-basic.v1` catalog, as the API sends them (see
- * `signalcore_core.ui`). A component's own properties are loose here (`unknown`): they come
- * from a model and are read defensively where they are drawn.
- */
-export {};

package/dist/theme.d.ts

@@ -1,62 +0,0 @@
-import type { CSSProperties } from "react";
-import type { PresetChoice } from "./presets.js";
-/**
- * The tokens the components are drawn with. Each is the CSS custom property `--sc-<name>`
- * (`accentFg` is `--sc-accent-fg`), and every one has a default in styles.css, so a host sets
- * only what it wants different: in its own CSS (`:root { --sc-accent: var(--primary) }`), or
- * through the provider's `theme`, which writes them as inline custom properties on its wrapper.
- *
- * Unset, the type, the text color and the color scheme are the host page's own; the neutrals
- * (lines, muted text, sunken areas) are tints of the text color; the accent is SignalCore's.
- */
-export interface Theme {
-    /** Ink. Default: the text color of the page the surface is in. */
-    text: string;
-    muted: string;
-    subtle: string;
-    /** What the surfaces sit on. `surface` falls back to it. */
-    bg: string;
-    /** The face of a card. Default: none, so a card is a bordered area of the page. */
-    surface: string;
-    /** A recessed or hovered area. */
-    sunken: string;
-    line: string;
-    lineStrong: string;
-    /** The owner acting: primary buttons, selection, links. */
-    accent: string;
-    accentFg: string;
-    accentSoft: string;
-    /** The agent at work. */
-    signal: string;
-    signalSoft: string;
-    ok: string;
-    okSoft: string;
-    danger: string;
-    dangerSoft: string;
-    /** The ring around a focused control. */
-    focus: string;
-    /** The face of a button, and under the pointer. */
-    face: string;
-    faceHover: string;
-    /** The corner of a card; buttons and fields take smaller ones in proportion. */
-    radius: string;
-    /** How much room things take, as a multiplier: 1 is the product's, 0.8 tighter, 1.25 looser. */
-    density: string | number;
-    /** Default: the page's own font. */
-    font: string;
-    fontMono: string;
-    /** The reading size; the interface sizes derive from it. Default 14px. */
-    fontSize: string;
-}
-/**
- * What a host passes as `theme`: a design system by name (`"shadcn"`), `"auto"` (the default:
- * the system the page turns out to use, if any), `"none"`, or tokens, which are laid over the
- * detected system, or over the one named in `preset`.
- */
-export type ThemeOption = PresetChoice | (Partial<Theme> & {
-    preset?: PresetChoice;
-});
-/** `lineStrong` → `--sc-line-strong`. */
-export declare function variableOf(token: keyof Theme): string;
-/** Tokens as the inline style of the element carrying them; nothing when there are none. */
-export declare function themeStyle(tokens: Partial<Theme>): CSSProperties | undefined;

package/dist/theme.js

@@ -1,9 +0,0 @@
-/** `lineStrong` → `--sc-line-strong`. */
-export function variableOf(token) {
-    return `--sc-${token.replace(/[A-Z]/g, (letter) => `-${letter.toLowerCase()}`)}`;
-}
-/** Tokens as the inline style of the element carrying them; nothing when there are none. */
-export function themeStyle(tokens) {
-    const entries = Object.entries(tokens).map(([token, value]) => [variableOf(token), String(value)]);
-    return entries.length > 0 ? Object.fromEntries(entries) : undefined;
-}

package/dist/useTokens.d.ts

@@ -1,7 +0,0 @@
-import type { Theme, ThemeOption } from "./theme.js";
-/**
- * The tokens to write on the provider's wrapper: the chosen system's (found, for `"auto"`), under
- * whatever tokens the host gave. They are only ever written on the wrapper, never on the page's
- * root, so the host's own variables are read and never changed.
- */
-export declare function useTokens(option?: ThemeOption): Partial<Theme>;

package/dist/useTokens.js

@@ -1,41 +0,0 @@
-import { useSyncExternalStore } from "react";
-import { detectPreset, SYSTEMS } from "./presets.js";
-// What changes on <html> when a page changes theme: the attribute, or the class that dark mode
-// toggles (shadcn). The system's variables may only exist, or change, in one of them.
-const WATCHED = ["data-theme", "class"];
-function watchRoot(changed) {
-    const observer = new MutationObserver(changed);
-    observer.observe(document.documentElement, { attributes: true, attributeFilter: WATCHED });
-    return () => {
-        observer.disconnect();
-    };
-}
-const probeRoot = () => detectPreset(getComputedStyle(document.documentElement));
-const never = () => () => undefined;
-const nothing = () => null;
-/**
- * The design system the page uses, found by asking its root for the variables each system always
- * defines, again whenever its theme changes. Nothing is asked without a `document` (a server
- * renders as if the page used none, then the client finds out), and nothing at all when the host
- * named its system or wants none.
- */
-function useDetected(wanted) {
-    const browser = wanted && typeof document !== "undefined";
-    return useSyncExternalStore(browser ? watchRoot : never, browser ? probeRoot : nothing, nothing);
-}
-/**
- * The tokens to write on the provider's wrapper: the chosen system's (found, for `"auto"`), under
- * whatever tokens the host gave. They are only ever written on the wrapper, never on the page's
- * root, so the host's own variables are read and never changed.
- */
-export function useTokens(option = "auto") {
-    const { preset = "auto", ...own } = typeof option === "string" ? { preset: option } : option;
-    const detected = useDetected(preset === "auto");
-    const system = choose(preset, detected);
-    return { ...(system ? SYSTEMS[system].tokens : {}), ...own };
-}
-function choose(preset, detected) {
-    if (preset === "auto")
-        return detected;
-    return preset === "none" ? null : preset;
-}

package/dist/voice/VoiceWindow.d.ts

@@ -1,18 +0,0 @@
-import { type VoiceOptions } from "./useVoice.js";
-export interface VoiceWindowProps extends Pick<VoiceOptions, "agentId" | "thread" | "voice" | "lang" | "continuous" | "onTurn" | "onSurfaces"> {
-    /** What the window is called to someone who cannot see it. */
-    label?: string | undefined;
-    className?: string | undefined;
-}
-/**
- * Talking to an agent (ADR 0011): an orb that listens, thinks and speaks, the state in words
- * under it, and captions of what was heard and what the agent said. The person chooses voice by
- * pressing the button (the agent may suggest it, never start it); from then on it is a
- * conversation, until they end it, with a button to turn the microphone off meanwhile.
- *
- * It speaks to the agent as the person does in the chat (`useVoice`, with `modality: "voice"`)
- * and can never change it. What the agent shows with its answer is not drawn here: it goes to
- * `onSurfaces`, for the host to place as a window. Where the browser cannot listen or speak, the
- * window says so and offers nothing else. The orb is the `Orb` primitive, the host's if it has one.
- */
-export declare function VoiceWindow(props: VoiceWindowProps): import("react").JSX.Element;

package/dist/voice/VoiceWindow.js

@@ -1,35 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, IconButton } from "../parts/Button.js";
-import { Icon } from "../parts/Icon.js";
-import { ErrorText } from "../parts/Input.js";
-import { Scoped, useMessages, useParts } from "../SignalcoreProvider.js";
-import { useVoicePrimitives } from "./useVoicePrimitives.js";
-import { useVoice } from "./useVoice.js";
-/** How big the orb is drawn: room for it to grow when the voice is loud. */
-const ORB_SIZE = 280;
-/**
- * Talking to an agent (ADR 0011): an orb that listens, thinks and speaks, the state in words
- * under it, and captions of what was heard and what the agent said. The person chooses voice by
- * pressing the button (the agent may suggest it, never start it); from then on it is a
- * conversation, until they end it, with a button to turn the microphone off meanwhile.
- *
- * It speaks to the agent as the person does in the chat (`useVoice`, with `modality: "voice"`)
- * and can never change it. What the agent shows with its answer is not drawn here: it goes to
- * `onSurfaces`, for the host to place as a window. Where the browser cannot listen or speak, the
- * window says so and offers nothing else. The orb is the `Orb` primitive, the host's if it has one.
- */
-export function VoiceWindow(props) {
-    return (_jsx(Scoped, { children: _jsx(Window, { ...props }, `${props.agentId}/${props.thread ?? ""}`) }));
-}
-function Window({ label, className, ...options }) {
-    const part = useParts();
-    const copy = useMessages();
-    const { Orb } = useVoicePrimitives();
-    const talk = useVoice(options);
-    // The microphone being off is not a state of the conversation, but it is what the person sees.
-    const muted = talk.active && talk.muted;
-    const state = muted ? copy.voiceMuted : copy.voiceStates[talk.state];
-    return (_jsxs("section", { ...part("voice", [talk.state, muted && "muted"], className), "aria-label": label ?? copy.voiceWindow, children: [_jsx("div", { ...part("voice__stage"), children: _jsx(Orb, { state: talk.state, level: talk.level, size: ORB_SIZE, label: state }) }), _jsx("p", { role: "status", ...part("voice__state"), children: state }), _jsxs("div", { ...part("voice__captions"), children: [talk.transcript !== "" && (_jsxs("p", { ...part("voice__line", ["person"]), children: [_jsx("span", { ...part("voice__who"), children: copy.you }), talk.transcript] })), talk.captions !== "" && (_jsxs("p", { ...part("voice__line", ["agent"]), children: [_jsx("span", { ...part("voice__who"), children: copy.theAgent }), talk.captions] }))] }), !talk.supported && _jsx("p", { ...part("voice__note"), children: copy.voiceUnsupported }), talk.problem !== undefined && _jsx(ErrorText, { children: talk.problem }), _jsxs("div", { ...part("voice__controls"), children: [_jsxs(Button, { variant: talk.active ? "secondary" : "primary", disabled: !talk.supported, onClick: talk.active ? talk.stop : talk.start, children: [_jsx(Icon, { name: "microphone" }), talk.active ? copy.stopVoice : copy.startVoice] }), _jsx(IconButton, { label: talk.muted ? copy.unmuteVoice : copy.muteVoice, "aria-pressed": talk.muted, disabled: !talk.active, onClick: () => {
-                            talk.mute();
-                        }, children: _jsx(Icon, { name: talk.muted ? "microphoneSlash" : "microphone" }) })] })] }));
-}

package/dist/voice/index.d.ts

@@ -1,13 +0,0 @@
-/**
- * Talking to an agent: a voice window with an orb, the loop behind it and the ways of listening
- * and speaking it runs on. A separate entry, so a host that never speaks does not load the orb
- * library.
- *
- *     import { VoiceWindow } from "@signalcore/ui/voice";
- */
-export type { OrbProps } from "../host.js";
-export { Orb } from "./Orb.js";
-export { useVoice, type VoiceConversation, type VoiceOptions, type VoiceTurn } from "./useVoice.js";
-export { VoiceError, type Heard, type Voice, type VoiceFailure, type VoiceState } from "./voice.js";
-export { VoiceWindow, type VoiceWindowProps } from "./VoiceWindow.js";
-export { webSpeechVoice, type WebSpeechOptions } from "./webSpeech.js";

package/dist/voice/index.js

@@ -1,12 +0,0 @@
-/**
- * Talking to an agent: a voice window with an orb, the loop behind it and the ways of listening
- * and speaking it runs on. A separate entry, so a host that never speaks does not load the orb
- * library.
- *
- *     import { VoiceWindow } from "@signalcore/ui/voice";
- */
-export { Orb } from "./Orb.js";
-export { useVoice } from "./useVoice.js";
-export { VoiceError } from "./voice.js";
-export { VoiceWindow } from "./VoiceWindow.js";
-export { webSpeechVoice } from "./webSpeech.js";

package/dist/voice/meter.d.ts

@@ -1,16 +0,0 @@
-/** One step of the smoothing: where a level that was `level` is after a frame aiming at `goal`. */
-export declare function approach(level: number, goal: number): number;
-/** The microphone's loudness, read when asked. */
-export interface Meter {
-    /** From 0 (silence) to 1 (loud), right now, not smoothed. */
-    read: () => number;
-    /** Lets go of the microphone. */
-    close: () => void;
-}
-/**
- * Opens the microphone only to measure it (an `AnalyserNode` over its stream: the root mean
- * square of the waveform). Nothing is recorded or sent anywhere. Where it cannot be read, because
- * the person said no, there is no device or the browser has no Web Audio, there is no meter, and
- * whoever asked goes without a level.
- */
-export declare function openMeter(): Promise<Meter | undefined>;

package/dist/voice/meter.js

@@ -1,52 +0,0 @@
-/**
- * How much of the way to its goal a level covers in one frame. Each frame the level moves by this
- * fraction of what is left, so a jump in loudness eases in and out instead of flickering.
- */
-const SMOOTHING = 0.15;
-/** Speech sits well below full scale on a microphone; this brings its usual loudness near 1. */
-const GAIN = 4;
-/** One step of the smoothing: where a level that was `level` is after a frame aiming at `goal`. */
-export function approach(level, goal) {
-    return level + (goal - level) * SMOOTHING;
-}
-/**
- * Opens the microphone only to measure it (an `AnalyserNode` over its stream: the root mean
- * square of the waveform). Nothing is recorded or sent anywhere. Where it cannot be read, because
- * the person said no, there is no device or the browser has no Web Audio, there is no meter, and
- * whoever asked goes without a level.
- */
-export async function openMeter() {
-    const devices = navigator.mediaDevices;
-    if (!devices || typeof AudioContext === "undefined")
-        return undefined;
-    let stream;
-    try {
-        stream = await devices.getUserMedia({ audio: true });
-    }
-    catch {
-        return undefined;
-    }
-    const context = new AudioContext();
-    void context.resume();
-    const analyser = context.createAnalyser();
-    analyser.fftSize = 512;
-    context.createMediaStreamSource(stream).connect(analyser);
-    const samples = new Uint8Array(analyser.fftSize);
-    return {
-        read: () => {
-            analyser.getByteTimeDomainData(samples);
-            let energy = 0;
-            for (const sample of samples) {
-                // Bytes centred on 128 are the waveform from -1 to 1.
-                const wave = (sample - 128) / 128;
-                energy += wave * wave;
-            }
-            return Math.min(1, Math.sqrt(energy / samples.length) * GAIN);
-        },
-        close: () => {
-            for (const track of stream.getTracks())
-                track.stop();
-            void context.close();
-        },
-    };
-}

package/dist/voice/orbColors.d.ts

@@ -1,16 +0,0 @@
-import type { VoiceState } from "./voice.js";
-/** What each state is when the page cannot say (no CSS color mixing, or no styles at all). */
-export declare const FALLBACK_COLORS: Record<VoiceState, string>;
-/**
- * `#rrggbb` for a color as a browser reports it once computed: `rgb(153, 50, 204)`, the modern
- * `rgb(153 50 204 / 1)`, or `color(srgb 0.6 0.2 0.8)` (what Chrome says for a color it mixed).
- * Nothing for any other notation. Transparency is ignored; channels out of gamut are clamped.
- */
-export declare function hexOf(color: string): string | undefined;
-/**
- * The color of a state as the page draws it here: our tokens, with the host's values and the
- * scheme (light or dark) of the element. Asked of a probe placed inside `host`, so it follows
- * whatever the host set on the provider or above it. A color the browser cannot give is the
- * fallback's.
- */
-export declare function resolveColor(host: Element, state: VoiceState): string;

package/dist/voice/orbColors.js

@@ -1,75 +0,0 @@
-/**
- * The colors the orb library is given for each state. It takes `#rrggbb` only (it blends them
- * frame by frame), so a CSS variable cannot be passed as it is: each is written in terms of our
- * tokens, resolved by the browser on a probe element, and turned into hex (`resolveColors`).
- *
- * The person is the accent (the one acting, as on a primary button); the agent working and
- * speaking is the signal (the agent at work); at rest the orb is the accent worn down to gray.
- * The fallbacks inside `var()` are the product's own defaults, for a page without our styles.
- */
-const ACCENT = "var(--_accent, var(--sc-accent, #9932cc))";
-const SIGNAL = "var(--_signal, var(--sc-signal, #ff8c00))";
-const TOKENS = {
-    idle: `color-mix(in srgb, ${ACCENT} 40%, rgb(150 150 150))`,
-    listening: ACCENT,
-    thinking: SIGNAL,
-    speaking: SIGNAL,
-};
-/** What each state is when the page cannot say (no CSS color mixing, or no styles at all). */
-export const FALLBACK_COLORS = {
-    idle: "#976eac",
-    listening: "#9932cc",
-    thinking: "#ff8c00",
-    speaking: "#ff8c00",
-};
-const channel = (value) => Math.round(Math.min(255, Math.max(0, value)))
-    .toString(16)
-    .padStart(2, "0");
-/** `#rrggbb` from three channels on a scale of 255; nothing if one is not a number. */
-function toHex(red, green, blue) {
-    if (red === undefined || green === undefined || blue === undefined)
-        return undefined;
-    if ([red, green, blue].some(Number.isNaN))
-        return undefined;
-    return `#${channel(red)}${channel(green)}${channel(blue)}`;
-}
-/**
- * `#rrggbb` for a color as a browser reports it once computed: `rgb(153, 50, 204)`, the modern
- * `rgb(153 50 204 / 1)`, or `color(srgb 0.6 0.2 0.8)` (what Chrome says for a color it mixed).
- * Nothing for any other notation. Transparency is ignored; channels out of gamut are clamped.
- */
-export function hexOf(color) {
-    const text = color.trim().toLowerCase();
-    if (/^#[0-9a-f]{6}$/.test(text))
-        return text;
-    const unit = /^color\(srgb\s+(\S+)\s+(\S+)\s+(\S+)(?:\s*\/\s*\S+)?\)$/.exec(text);
-    if (unit) {
-        const [red, green, blue] = unit.slice(1, 4).map((each) => Number.parseFloat(each) * 255);
-        return toHex(red, green, blue);
-    }
-    const rgb = /^rgba?\(\s*([\d.]+)[\s,]+([\d.]+)[\s,]+([\d.]+)(?:[\s,/]+[\d.]+%?)?\s*\)$/.exec(text);
-    if (rgb) {
-        const [red, green, blue] = rgb.slice(1, 4).map((each) => Number.parseFloat(each));
-        return toHex(red, green, blue);
-    }
-    return undefined;
-}
-/**
- * The color of a state as the page draws it here: our tokens, with the host's values and the
- * scheme (light or dark) of the element. Asked of a probe placed inside `host`, so it follows
- * whatever the host set on the provider or above it. A color the browser cannot give is the
- * fallback's.
- */
-export function resolveColor(host, state) {
-    const probe = host.ownerDocument.createElement("span");
-    host.append(probe);
-    try {
-        // Mixed with itself in sRGB, so the browser answers in a notation `hexOf` reads whatever
-        // space the token was written in.
-        probe.style.color = `color-mix(in srgb, ${TOKENS[state]}, ${TOKENS[state]})`;
-        return hexOf(getComputedStyle(probe).color) ?? FALLBACK_COLORS[state];
-    }
-    finally {
-        probe.remove();
-    }
-}

package/dist/voice/pushable.d.ts

@@ -1,16 +0,0 @@
-/** An async iterable that is fed from outside, for events that arrive when they please. */
-export interface Pushable<T> {
-    readonly iterable: AsyncIterable<T>;
-    push: (item: T) => void;
-    /** Nothing more will come: the iteration ends once what was pushed has been read. */
-    end: () => void;
-    /** The source broke: the iteration throws `error` once what was pushed has been read. */
-    fail: (error: unknown) => void;
-}
-/**
- * Turns a callback source (a recognizer's `onresult`) into something to `for await` over. Items
- * are kept until they are read, in order. `onClose` runs when the reader is done, however it
- * left: the iteration ended, threw, or the reader broke out of its loop, so the source is never
- * left running for nobody.
- */
-export declare function pushable<T>(onClose: () => void): Pushable<T>;

package/dist/voice/pushable.js

@@ -1,56 +0,0 @@
-/**
- * Turns a callback source (a recognizer's `onresult`) into something to `for await` over. Items
- * are kept until they are read, in order. `onClose` runs when the reader is done, however it
- * left: the iteration ended, threw, or the reader broke out of its loop, so the source is never
- * left running for nobody.
- */
-export function pushable(onClose) {
-    const items = [];
-    let ending;
-    let wake;
-    const notify = () => {
-        wake?.();
-        wake = undefined;
-    };
-    async function* read() {
-        try {
-            for (;;) {
-                const next = items.shift();
-                if (next) {
-                    yield next.value;
-                }
-                else if (ending === "end") {
-                    return;
-                }
-                else if (ending) {
-                    throw ending.error;
-                }
-                else {
-                    await new Promise((resolve) => {
-                        wake = resolve;
-                    });
-                }
-            }
-        }
-        finally {
-            onClose();
-        }
-    }
-    return {
-        iterable: read(),
-        push: (item) => {
-            if (ending)
-                return;
-            items.push({ value: item });
-            notify();
-        },
-        end: () => {
-            ending ??= "end";
-            notify();
-        },
-        fail: (error) => {
-            ending ??= { error };
-            notify();
-        },
-    };
-}

package/dist/voice/useDictation.d.ts

@@ -1,24 +0,0 @@
-export interface DictationOptions {
-    /** The language spoken, as a BCP 47 tag (`"es-ES"`). */
-    lang: string;
-    /** A sentence settled: the person paused, and these words will not change. */
-    onFinal: (text: string) => void;
-}
-export interface Dictation {
-    /** Whether this browser can listen. Where it cannot, nothing else is offered. */
-    supported: boolean;
-    listening: boolean;
-    /** The words being heard now, which may still change. Empty between sentences. */
-    interim: string;
-    start: () => void;
-    /** Stops listening. What was said just before still arrives. */
-    stop: () => void;
-}
-/**
- * Dictating into a message box: the words settle into `onFinal` sentence by sentence while
- * `interim` shows what is still being heard, until `stop`, or until the browser ends the session
- * or refuses the microphone. It is the voice window's transport (`webSpeechVoice`) without the
- * conversation, and without reading the microphone's level, which a box to write in does not
- * show and some browsers do not like having a second reader of.
- */
-export declare function useDictation({ lang, onFinal }: DictationOptions): Dictation;