@fusion.dev/helix-core 0.147.0 → 0.149.0

package/dist/utils/reorder/reorder.d.ts

@@ -0,0 +1,178 @@
+/**
+ * The state and the arithmetic of moving one item to a new place in its
+ * collection: rows of a list or a data table, or a table's columns.
+ *
+ * Pure, so every transition and every sum has a spec with no DOM.
+ * `ReorderController` holds the state, listens to the pointer and the keys, and
+ * runs the effects each change of state calls for.
+ */
+/** Which way a collection runs: rows down the block axis, columns along the inline one. */
+export type ReorderAxis = 'block' | 'inline';
+/** What holds the item: a key or a press on its grip, or a pointer dragging it. */
+export type ReorderHold = 'keyboard' | 'pointer';
+/**
+ * Where a move stands.
+ *
+ * - `idle`: nothing is held.
+ * - `pressed`: a pointer is down on a grip and has not traveled far enough to
+ *   be a drag.
+ * - `held`: an item is held, and `to` is where it would go.
+ * - `dropped` and `canceled`: the move has ended, for one step, so the
+ *   controller can run what each calls for before it settles to `idle`.
+ *
+ * `from` and `to` count from 0 in the order the items are drawn.
+ */
+export type ReorderState = {
+    phase: 'idle';
+} | {
+    from: number;
+    key: string;
+    phase: 'pressed';
+    pointer: number;
+    x: number;
+    y: number;
+} | {
+    by: ReorderHold;
+    from: number;
+    key: string;
+    phase: 'held';
+    to: number;
+} | {
+    by: ReorderHold;
+    from: number;
+    key: string;
+    phase: 'dropped';
+    to: number;
+} | {
+    by: ReorderHold;
+    key: string;
+    phase: 'canceled';
+};
+/**
+ * What can happen to a move.
+ *
+ * - `press`: a pointer went down on a grip.
+ * - `drag`: the pointer moved, and `to` is the place under it.
+ * - `release`: the pointer went up.
+ * - `pick`: a grip was pressed with a key or a click. It holds the item, or
+ *   drops the item that grip already holds.
+ * - `step`: a key moved the held item to `to`.
+ * - `target`: a click on another item dropped the held one at `to`.
+ * - `drop` and `cancel`: Enter or Space, and Escape.
+ * - `settle`: the controller has run the effects of a drop or a cancel.
+ */
+export type ReorderInput = {
+    from: number;
+    key: string;
+    pointer: number;
+    type: 'press';
+    x: number;
+    y: number;
+} | {
+    slop: number;
+    to: number;
+    type: 'drag';
+    x: number;
+    y: number;
+} | {
+    type: 'release';
+} | {
+    from: number;
+    key: string;
+    type: 'pick';
+} | {
+    to: number;
+    type: 'step';
+} | {
+    to: number;
+    type: 'target';
+} | {
+    type: 'cancel';
+} | {
+    type: 'drop';
+} | {
+    type: 'settle';
+};
+/** The state with nothing held. */
+export declare const IDLE: ReorderState;
+/**
+ * The state after an input, or `null` where the input changes nothing.
+ *
+ * A press becomes a drag only once the pointer has traveled `slop` pixels, so a
+ * click on a grip stays a click. A click on a grip holds the item for the
+ * keys, and a second click on the same grip drops it, which is the move a
+ * single pointer makes without dragging.
+ */
+export declare const reorderStep: (state: ReorderState, input: ReorderInput) => ReorderState | null;
+/**
+ * How many of the other items the pointer has passed: the place the held item
+ * goes, among the others.
+ *
+ * `centers` are the middles of the other items along the axis, in the order
+ * drawn. `reversed` is a row laid out from the right, a right-to-left page,
+ * where passing an item means being left of its middle.
+ */
+export declare const passedCount: (centers: readonly number[], at: number, reversed?: boolean) => number;
+/**
+ * The middles of the items along the axis, from their boxes, for
+ * `passedCount`.
+ *
+ * An item with no box is one a window did not draw. One before every drawn
+ * item counts as passed, one after them as not passed, and one between two
+ * drawn items as where the drawn one before it is. `reversed` is the same
+ * question on a row laid out from the right.
+ */
+export declare const centersOf: (spans: readonly ({
+    end: number;
+    start: number;
+} | undefined)[], reversed?: boolean) => number[];
+/**
+ * Where a key moves a held item, or `null` for a key that does not move one.
+ *
+ * The arrows along the axis move it one place, and Home and End move it to
+ * either end. Along the inline axis the arrows follow the writing direction,
+ * so on a right-to-left page the left arrow moves it forward. The answer is
+ * held to the collection, so an arrow at an end returns where it already is.
+ */
+export declare const reorderKey: (key: string, { axis, count, rtl, to }: {
+    axis: ReorderAxis;
+    count: number;
+    rtl: boolean;
+    to: number;
+}) => number | null;
+/**
+ * Where the drop indicator goes for a held item: before or after the item at
+ * an index of the order drawn, or nowhere while the item would stay where it
+ * is.
+ *
+ * Moving back, the item lands before the one now at `to`. Moving forward, it
+ * lands after it.
+ */
+export declare const dropMark: (from: number, to: number) => {
+    edge: 'after' | 'before';
+    index: number;
+} | undefined;
+/**
+ * Every key in a new order: `key` taken out and put back at `to` among the
+ * shown ones.
+ *
+ * `all` is the whole order, which can hold keys that are not drawn: a hidden
+ * column, or a row a search left out. `shown` is the order drawn. The key goes
+ * after the shown one it now follows, or before the first shown one where it
+ * moves to the front, so a key that is not drawn keeps its place among the
+ * rest.
+ */
+export declare const placeKey: (all: readonly string[], shown: readonly string[], key: string, to: number) => string[];
+/**
+ * How far to scroll a box in one frame while a held item is near one of its
+ * edges, in pixels: negative toward the start, positive toward the end, and 0
+ * away from both.
+ *
+ * `at` is the pointer along the axis, and `start` and `end` are the box's
+ * edges. The speed rises from nothing at `zone` pixels in to `most` at the
+ * edge and past it.
+ */
+export declare const edgeSpeed: (at: number, start: number, end: number, { most, zone }?: {
+    most?: number;
+    zone?: number;
+}) => number;

package/dist/utils/reorder/reorder.js

@@ -0,0 +1,112 @@
+export const IDLE = { phase: 'idle' };
+export const reorderStep = (state, input) => {
+    switch (input.type) {
+        case 'press':
+            return state.phase === 'idle'
+                ? {
+                    from: input.from,
+                    key: input.key,
+                    phase: 'pressed',
+                    pointer: input.pointer,
+                    x: input.x,
+                    y: input.y,
+                }
+                : null;
+        case 'drag':
+            if (state.phase === 'pressed') {
+                return Math.hypot(input.x - state.x, input.y - state.y) < input.slop
+                    ? null
+                    : { by: 'pointer', from: state.from, key: state.key, phase: 'held', to: input.to };
+            }
+            return state.phase === 'held' && state.by === 'pointer' && state.to !== input.to
+                ? { ...state, to: input.to }
+                : null;
+        case 'release':
+            if (state.phase === 'pressed') {
+                return IDLE;
+            }
+            return state.phase === 'held' && state.by === 'pointer'
+                ? { ...state, phase: 'dropped' }
+                : null;
+        case 'pick':
+            if (state.phase === 'idle') {
+                return { by: 'keyboard', from: input.from, key: input.key, phase: 'held', to: input.from };
+            }
+            return state.phase === 'held' && state.by === 'keyboard' && state.key === input.key
+                ? { ...state, phase: 'dropped' }
+                : null;
+        case 'step':
+            return state.phase === 'held' && state.by === 'keyboard' && state.to !== input.to
+                ? { ...state, to: input.to }
+                : null;
+        case 'target':
+            return state.phase === 'held' && state.by === 'keyboard'
+                ? { ...state, phase: 'dropped', to: input.to }
+                : null;
+        case 'drop':
+            return state.phase === 'held' ? { ...state, phase: 'dropped' } : null;
+        case 'cancel':
+            if (state.phase === 'pressed') {
+                return IDLE;
+            }
+            return state.phase === 'held' ? { by: state.by, key: state.key, phase: 'canceled' } : null;
+        case 'settle':
+            return state.phase === 'dropped' || state.phase === 'canceled' ? IDLE : null;
+    }
+};
+export const passedCount = (centers, at, reversed = false) => centers.filter((center) => (reversed ? at < center : at > center)).length;
+export const centersOf = (spans, reversed = false) => {
+    const drawn = spans.flatMap((span, index) => (span ? [index] : []));
+    const first = drawn[0] ?? spans.length;
+    const last = drawn[drawn.length - 1] ?? -1;
+    let before = reversed ? Number.POSITIVE_INFINITY : Number.NEGATIVE_INFINITY;
+    return spans.map((span, index) => {
+        if (span) {
+            before = (span.start + span.end) / 2;
+            return before;
+        }
+        if (index < first) {
+            return reversed ? Number.POSITIVE_INFINITY : Number.NEGATIVE_INFINITY;
+        }
+        return index > last ? (reversed ? Number.NEGATIVE_INFINITY : Number.POSITIVE_INFINITY) : before;
+    });
+};
+export const reorderKey = (key, { axis, count, rtl, to }) => {
+    const last = Math.max(0, count - 1);
+    if (key === 'Home') {
+        return 0;
+    }
+    if (key === 'End') {
+        return last;
+    }
+    const back = axis === 'block' ? 'ArrowUp' : rtl ? 'ArrowRight' : 'ArrowLeft';
+    const forward = axis === 'block' ? 'ArrowDown' : rtl ? 'ArrowLeft' : 'ArrowRight';
+    if (key !== back && key !== forward) {
+        return null;
+    }
+    return Math.min(last, Math.max(0, to + (key === forward ? 1 : -1)));
+};
+export const dropMark = (from, to) => to === from ? undefined : { edge: to < from ? 'before' : 'after', index: to };
+export const placeKey = (all, shown, key, to) => {
+    const others = shown.filter((one) => one !== key);
+    const rest = all.filter((one) => one !== key);
+    const beside = others[to - 1] ?? others[0];
+    if (beside === undefined) {
+        return [...all];
+    }
+    rest.splice(rest.indexOf(beside) + (to > 0 ? 1 : 0), 0, key);
+    return rest;
+};
+export const edgeSpeed = (at, start, end, { most = 12, zone = 40 } = {}) => {
+    const reach = Math.min(zone, (end - start) / 2);
+    if (reach <= 0) {
+        return 0;
+    }
+    if (at < start + reach) {
+        return -Math.round(most * Math.min(1, (start + reach - at) / reach)) || 0;
+    }
+    if (at > end - reach) {
+        return Math.round(most * Math.min(1, (at - (end - reach)) / reach));
+    }
+    return 0;
+};

package/dist/utils/report-runtime/report-runtime.d.ts

@@ -18,8 +18,10 @@
  */
 /** What went wrong, stable across versions, so it can be counted. */
 export type RuntimeKind = 
+/** A Blockquote's `cite` holds words, where it takes the source's URL. */
+'cite-not-url'
 /** A deprecated property, attribute or slot was used; the message names what replaces it. */
-'deprecated'
+ | 'deprecated'
 /** Another class asked for a tag that is already registered: two copies of Helix. */
  | 'duplicate-registration'
 /** The browser refused fullscreen, usually for a frame without the permission. */
@@ -28,7 +30,7 @@ export type RuntimeKind =
  | 'min-out-of-range'
 /** A Stat was given one of Trend's directions, `up`, `down` or `neutral`, which lay nothing out. */
  | 'misread-direction'
-/** A React handler prop names an event the element never dispatches itself. */
+/** A React handler prop names an event the element never dispatches itself. Development builds only. */
  | 'misplaced-handler'
 /** An Image has no `alt`, so a screen reader announces its file name. */
  | 'missing-alt'
@@ -57,9 +59,12 @@ export type RuntimeKind =
  | 'picture-in-picture-refused'
 /** A Grid's `min` is no length it can write, so the grid lays out by its column count. */
  | 'refused-length'
-/** A React handler prop is a removed callback, which never ran from JSX. */
+/** A React handler prop is a removed callback, which never ran from JSX. Development builds only. */
  | 'removed-callback'
-/** A React handler prop uses Solid's `on:`, which React reads as another event's name. */
+/**
+ * A React handler prop uses Solid's `on:`, which React reads as another event's name.
+ * Development builds only.
+ */
  | 'solid-handler-syntax'
 /** A stencil's regions went unused: no named parts, or parts too small. */
  | 'stencil-regions-unused'
@@ -71,7 +76,7 @@ export type RuntimeKind =
  | 'two-default-operators'
 /** A Quote's text starts or ends with a quotation mark, so the browser's marks double it. */
  | 'typed-marks'
-/** A React handler prop names an event nothing dispatches. */
+/** A React handler prop names an event nothing dispatches. Development builds only. */
  | 'unknown-event'
 /** An Icon's `name` is in no icon set it can read, so it draws nothing. */
  | 'unknown-icon'
@@ -79,8 +84,12 @@ export type RuntimeKind =
  | 'unlinked-trigger'
 /** A Text is rendered as a label, a deprecated value whose shadow root reaches no control. */
  | 'unreachable-label'
+/** A QR code holds a logo at a correction level below `H`, so it may not scan. */
+ | 'unscannable-logo'
 /** A virtualized list's box has no height of its own, so its window never settles. */
  | 'unsettled-window'
+/** A native button in a Button Group with `selection-mode`, which cannot be told it is pressed. */
+ | 'untold-toggle'
 /** A slotted trigger is a plain element, which cannot be told it opens something. */
  | 'untold-trigger'
 /** A tooltip wraps its trigger, so its text reaches no screen reader. */

package/dist/utils/report-values/report-values.d.ts

@@ -9,13 +9,25 @@
  * sent the first and Date Picker the second, so what a server received for the
  * same answer depended on which control asked for it.
  *
- * **The joined string is the state**, which is what the browser hands back to
- * `formStateRestoreCallback` and what `value` holds, so a restored control
- * reads the shape it wrote.
+ * **The joined string is the state by default**, which is what the browser
+ * hands back to `formStateRestoreCallback` and what `value` holds, so a
+ * restored control reads the shape it wrote. A control whose answers can hold
+ * a comma asks for `state: 'entries'`, and the browser hands back the form
+ * data itself, one entry per answer, so `b,1` comes back as one answer and not
+ * two.
  *
  * **Nothing without a `name`.** A plain string is skipped by the form when its
  * control has no name, but `FormData` carries its own names and its entries
  * are appended whatever the element is called, so an unnamed control would
  * submit empty-named values.
  */
-export declare const reportValues: (internals: ElementInternals, name: string, values: readonly string[]) => void;
+/** How `reportValues` saves the state the browser restores. */
+export interface ReportValuesOptions {
+    /**
+     * What the browser hands back to `formStateRestoreCallback`: `joined`, the
+     * answers joined with commas, or `entries`, the form data with one entry per
+     * answer. Defaults to `joined`.
+     */
+    state?: 'entries' | 'joined';
+}
+export declare const reportValues: (internals: ElementInternals, name: string, values: readonly string[], { state }?: ReportValuesOptions) => void;

package/dist/utils/report-values/report-values.js

@@ -1,4 +1,4 @@
-export const reportValues = (internals, name, values) => {
+export const reportValues = (internals, name, values, { state = 'joined' } = {}) => {
     if (name === '' || values.length === 0) {
         internals.setFormValue(null);
         return;
@@ -7,5 +7,5 @@ export const reportValues = (internals, name, values) => {
     for (const value of values) {
         data.append(name, value);
     }
-    internals.setFormValue(data, values.join(','));
+    internals.setFormValue(data, state === 'entries' ? data : values.join(','));
 };

package/dist/utils/request-change/request-change.d.ts

@@ -35,3 +35,14 @@ export interface ChangeRequestOptions<T> {
     next: T;
 }
 export declare const requestChange: <T>({ apply, event, host, next, }: ChangeRequestOptions<T>) => boolean;
+/**
+ * Asks before a reader's press moves a value, then applies it and says so:
+ * `helix-before-change` with the value it would leave, which a listener may
+ * cancel, and `change` once it has moved.
+ *
+ * **The order every selectable set in the library keeps**, so a page reads the
+ * same pair from a list, a tag group, a heatmap or a legend: the cancelable
+ * question first, the platform's `change` after, bubbling and composed as a
+ * native control's does. Returns whether the value moved.
+ */
+export declare const requestValue: (host: EventTarget, next: string, apply: (value: string) => void) => boolean;

package/dist/utils/request-change/request-change.js

@@ -1,3 +1,4 @@
+import { HelixBeforeChangeEvent } from '../../events/before-change.js';
 export const requestChange = ({ apply, event, host, next, }) => {
     if (!host.dispatchEvent(event(next))) {
         return false;
@@ -5,3 +6,12 @@ export const requestChange = ({ apply, event, host, next, }) => {
     apply(next);
     return true;
 };
+export const requestValue = (host, next, apply) => requestChange({
+    apply: (value) => {
+        apply(value);
+        host.dispatchEvent(new Event('change', { bubbles: true, composed: true }));
+    },
+    event: (value) => new HelixBeforeChangeEvent({ value }),
+    host,
+    next,
+});

package/dist/utils/scroll-item-into-view/scroll-item-into-view.d.ts

@@ -27,6 +27,23 @@ export interface ScrollItemOptions {
  * bar with it.
  */
 export declare const scrollingAncestor: (item: HTMLElement, options?: ScrollerOptions) => HTMLElement | null;
+/** What `scrollRoom` takes off a box that scrolls. */
+export interface ScrollRoomOptions {
+    /**
+     * How much of the box its own content covers while it scrolls, a sticky row
+     * of headings, in pixels. Defaults to `0`.
+     */
+    covered?: number;
+}
+/**
+ * How much of a list a reader sees at once, for Page Up and Page Down: the
+ * box's own height where it scrolls, less what covers it, and the window's
+ * where it does not and the page scrolls instead.
+ *
+ * **A pixel of slack**, since a box whose content rounds to one pixel more
+ * than its height does not scroll, and was paging by the window's height.
+ */
+export declare const scrollRoom: (box: Element | null | undefined, { covered }?: ScrollRoomOptions) => number;
 /** Where `scrollingAncestor` looks, and what it takes for a scroller. */
 export interface ScrollerOptions {
     /** The axis whose overflow counts, or either where absent. */

package/dist/utils/scroll-item-into-view/scroll-item-into-view.js

@@ -15,6 +15,7 @@ export const scrollingAncestor = (item, options = {}) => {
     }
     return null;
 };
+export const scrollRoom = (box, { covered = 0 } = {}) => box && box.scrollHeight > box.clientHeight + 1 ? box.clientHeight - covered : window.innerHeight;
 const overflows = (node, axis) => {
     const tall = node.scrollHeight > node.clientHeight;
     const wide = node.scrollWidth > node.clientWidth;

package/dist/utils/slot-filled/slot-filled.d.ts

@@ -22,3 +22,11 @@
  * anything", and a slot showing its fallback does render.
  */
 export declare const slotFilled: (slot: HTMLSlotElement | null | undefined) => boolean;
+/**
+ * The slot of a name in a shadow root, or its default slot for `''`.
+ *
+ * `slot[name=""]` matches nothing, since the default slot has no `name`
+ * attribute at all, which is the one thing every hand-written lookup had to
+ * remember.
+ */
+export declare const slotNamed: (root: ParentNode | null | undefined, name: string) => HTMLSlotElement | null;

package/dist/utils/slot-filled/slot-filled.js

@@ -1 +1,2 @@
 export const slotFilled = (slot) => (slot?.assignedNodes({ flatten: true }) ?? []).some((node) => node.nodeType === Node.ELEMENT_NODE || node.textContent?.trim() !== '');
+export const slotNamed = (root, name) => root?.querySelector?.(name === '' ? 'slot:not([name])' : `slot[name="${name}"]`) ?? null;

package/dist/utils/slotted-words/slotted-words.d.ts

@@ -5,7 +5,8 @@
  * For a component that says what the page put in it, which is the page's own
  * text and not anything this library wrote: an empty state's heading and
  * message, a banner's message. Text nodes count toward the default slot, as
- * they are assigned to it. Nothing on a server, whose element has no children
- * to read.
+ * they are assigned to it; comments, such as the markers a template writes
+ * around its text, are left out. Nothing on a server, whose element has no
+ * children to read.
  */
 export declare const slottedWords: (host: Element, slots: readonly string[]) => string;

package/dist/utils/slotted-words/slotted-words.js

@@ -1,5 +1,7 @@
 export const slottedWords = (host, slots) => [...(host.childNodes ?? [])]
-    .filter((node) => (node instanceof Element ? slots.includes(node.slot) : slots.includes('')))
+    .filter((node) => node instanceof Element
+    ? slots.includes(node.slot)
+    : node.nodeType === 3 && slots.includes(''))
     .map((node) => node.textContent?.replace(/\s+/g, ' ').trim() ?? '')
     .filter(Boolean)
     .join(' ');

package/dist/utils/toolbar-around/toolbar-around.d.ts

@@ -0,0 +1,18 @@
+/**
+ * The toolbar an element sits in, or `null`.
+ *
+ * Read from the parent up, so a toolbar is never its own. One answer for every
+ * family that changes inside a toolbar: Toolbar becomes a group of the outer
+ * one, a multiple Toggle Group becomes a group, and Divider turns across the
+ * toolbar's axis. By tag and by role, since a family other than Toolbar cannot
+ * import Toolbar's class; Toolbar adds its own class for a third tag.
+ *
+ * `closest` stops at a shadow root, which is what a slotted child wants: its
+ * toolbar is its light-DOM parent or above.
+ */
+export declare const toolbarAround: (element: Element) => Element | null;
+/**
+ * The axis a toolbar runs along: its own `orientation`, else the page's
+ * `aria-orientation`, else horizontal, which is the role's default.
+ */
+export declare const toolbarAxis: (toolbar: Element) => 'horizontal' | 'vertical';

package/dist/utils/toolbar-around/toolbar-around.js

@@ -0,0 +1,5 @@
+const TOOLBAR = '[role="toolbar"], helix-toolbar, helix-headless-toolbar';
+export const toolbarAround = (element) => element.parentElement?.closest(TOOLBAR) ?? null;
+export const toolbarAxis = (toolbar) => (toolbar.getAttribute('orientation') ?? toolbar.getAttribute('aria-orientation')) === 'vertical'
+    ? 'vertical'
+    : 'horizontal';

package/dist/version.d.ts

@@ -6,4 +6,4 @@
  * release, so the two never disagree; a spec beside this holds them to it.
  * Nothing else in the running code knows which release it is.
  */
-export declare const VERSION = "0.147.0";
+export declare const VERSION = "0.149.0";

package/dist/version.js

@@ -1 +1 @@
-export const VERSION = '0.147.0';
+export const VERSION = '0.149.0';

package/dist/words/index.d.ts

@@ -0,0 +1,3 @@
+export { formatMessage, type Message, type MessageOptions, type MessageTable, type MessageValues, } from './message.js';
+export { clearWords, type HelixWords, localeChain, refreshWords, registerWords, setDefaultWordsLocale, type Words, } from './registry.js';
+export { handedLocale, wordsLocale } from './words-locale.js';

package/dist/words/index.js

@@ -0,0 +1,3 @@
+export { formatMessage, } from './message.js';
+export { clearWords, localeChain, refreshWords, registerWords, setDefaultWordsLocale, } from './registry.js';
+export { handedLocale, wordsLocale } from './words-locale.js';

package/dist/words/message.d.ts

@@ -0,0 +1,47 @@
+/**
+ * A sentence a component says, written in a small subset of ICU
+ * MessageFormat, the syntax translation tools already read:
+ *
+ * - `{name}`, a value put in where the sentence says. A number is written in
+ *   the element's locale.
+ * - `{n, number}`, `{n, number, percent}` and `{n, number, integer}`.
+ * - `{n, plural, =0 {...} one {# ...} other {...}}`, with `offset:`, and
+ *   `{n, selectordinal, ...}` in the same shape. `#` is the number.
+ * - `{x, select, a {...} other {...}}`.
+ * - `''` for one apostrophe, and `'{'` for a brace written as text. A lone
+ *   apostrophe is text, so "L'élément" needs no escaping.
+ */
+export type Message = string;
+/** A word table, such as `color-words`. Its entries merge one by one. */
+export type MessageTable = Readonly<Record<string, Message>>;
+/** The values a message puts in, by name. */
+export type MessageValues = Readonly<Record<string, string | number>>;
+/** How a message is formatted. */
+export interface MessageOptions {
+    /**
+     * Wraps each value in Unicode isolates (U+2068 and U+2069), so a number or
+     * a Latin name keeps its order inside a right-to-left sentence.
+     */
+    isolate?: boolean;
+    /**
+     * The locale whose plural rules pick a form, where it is not the locale
+     * the numbers are written in. A message from the English fallback counts
+     * with English rules on a Polish page, because its forms are English.
+     */
+    plurals?: string;
+}
+/**
+ * A message with its values put in, its numbers written in `locale`, and its
+ * plural forms picked by the rules of `options.plurals`, or of `locale`.
+ *
+ * **A value that is missing leaves its placeholder as written**, so
+ * `{count}` shows on the page as the mistake it is. An unknown argument type
+ * writes the value as text, so a type added later changes only the messages
+ * that use it.
+ *
+ * ```js
+ * formatMessage('{count, plural, one {# wynik} few {# wyniki} many {# wyników} other {# wyniku}}', { count: 5 }, 'pl')
+ * // '5 wyników'
+ * ```
+ */
+export declare const formatMessage: (message: Message, values: MessageValues, locale: string, options?: MessageOptions) => string;