prime-ui-kit 0.15.0 → 0.17.0

package/dist/components/color-picker/ColorPresets.d.ts

@@ -11,29 +11,74 @@ export type ColorPresetsLabels = {
     /** The "no color" swatch (`allowEmpty`) and the trigger name for an empty value. */
     empty: string;
 };
+export declare const COLOR_PRESETS_LABELS: ColorPresetsLabels;
 export type ColorPresetsRootProps = {
-    /** Controlled color; `null` — no color. */
+    /**
+     * Controlled color; `null` — no color.
+     */
     value?: string | null;
+    /**
+     * Initial color when uncontrolled.
+     */
     defaultValue?: string | null;
+    /**
+     * Called with the preset `value` or `null`.
+     */
     onValueChange?: (value: string | null) => void;
+    /**
+     * Controlled open state of the panel.
+     */
     open?: boolean;
+    /**
+     * Initial open state.
+     */
     defaultOpen?: boolean;
+    /**
+     * Called when the panel opens or closes.
+     */
     onOpenChange?: (open: boolean) => void;
-    /** Swatches in panel order. Default: `COLOR_PRESETS` (16). */
+    /**
+     * Escape closes the panel and returns focus to the trigger.
+     */
+    closeOnEscape?: boolean;
+    /**
+     * A press outside the panel and its trigger closes it; focus follows the pointer.
+     */
+    closeOnOutsideClick?: boolean;
+    /**
+     * Swatches in panel order.
+     */
     presets?: readonly ColorPreset[];
-    /** Grid columns. Default: one row for up to 8 presets (+ "no color"), else 8; 16 → 8 × 2. */
+    /**
+     * Grid columns; default one row for up to 8 presets (+ «no color»), else 8.
+     */
     columns?: number;
-    /** Tier of the trigger, swatches and panel. Default: the host tier, else `m`. */
+    /**
+     * Tier of the trigger, the swatches and the panel. Without it the tier of its host, else `m`.
+     */
     size?: ControlSize;
+    /**
+     * The trigger is disabled and does not open the panel. A disabled `Fieldset` around it sets it too.
+     */
     disabled?: boolean;
-    /** Adds the "no color" swatch after the presets (value `null`); hue rows stay aligned. */
+    /**
+     * Adds the «no color» swatch after the presets (value `null`).
+     */
     allowEmpty?: boolean;
-    /** Close the panel after a pick (focus returns to the trigger). Default `true`. */
+    /**
+     * Close the panel after a pick (focus returns to the trigger).
+     */
     closeOnSelect?: boolean;
+    /**
+     * Built-in strings, see Labels.
+     */
     labels?: Partial<ColorPresetsLabels>;
+    /**
+     * `ColorPresets.Trigger` and `ColorPresets.Content`.
+     */
     children: React.ReactNode;
 };
-declare function ColorPresetsRoot({ value: valueProp, defaultValue, onValueChange, open: openProp, defaultOpen, onOpenChange, presets, columns: columnsProp, size: sizeProp, disabled: disabledProp, allowEmpty, closeOnSelect, labels: labelsProp, children, }: ColorPresetsRootProps): import("react/jsx-runtime").JSX.Element;
+declare function ColorPresetsRoot({ value: valueProp, defaultValue, onValueChange, open: openProp, defaultOpen, onOpenChange, closeOnEscape, closeOnOutsideClick, presets, columns: columnsProp, size: sizeProp, disabled: disabledProp, allowEmpty, closeOnSelect, labels: labelsProp, children, }: ColorPresetsRootProps): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
 declare namespace ColorPresetsRoot {
     var displayName: string;
 }
@@ -41,21 +86,23 @@ export type ColorPresetsSwatchProps = Omit<React.HTMLAttributes<HTMLSpanElement>
     ref?: React.Ref<HTMLSpanElement>;
 };
 /**
- * The current color as a small square for a custom trigger (e.g. inside `Button.Root`). Sized from
- * the host's `--prime-icon-size`; `aria-hidden` — the trigger carries the name.
+ * The current color as a small square for a custom trigger (e.g. inside `Button.Root`), at the
+ * host's icon size; `aria-hidden` — the trigger carries the name.
  */
 declare function Swatch(props: ColorPresetsSwatchProps): import("react/jsx-runtime").JSX.Element;
 declare namespace Swatch {
     var displayName: string;
 }
 export type ColorPresetsTriggerProps = {
-    /** One element that opens the panel: `ColorPresets.SwatchButton`, or e.g. `Button.Root` with `ColorPresets.Swatch`. */
+    /**
+     * One element: `ColorPresets.SwatchButton`, or e.g. `Button.Root` with `ColorPresets.Swatch`.
+     */
     children: React.ReactElement;
 };
 /**
  * A slot: clones its one child into the panel's trigger. Name «<labels.trigger>: <color name>»,
- * `disabled` from the root, ArrowDown / ArrowUp open the panel; the child's own `aria-label`,
- * `disabled` and handlers win (Slot merge rules).
+ * `disabled` from the root, ArrowDown / ArrowUp open the panel (the Popover's `openOnArrow`); the
+ * child's own `aria-label`, `disabled` and handlers win (Slot merge rules).
  */
 declare function Trigger({ children }: ColorPresetsTriggerProps): import("react/jsx-runtime").JSX.Element;
 declare namespace Trigger {
@@ -70,9 +117,17 @@ declare namespace SwatchButton {
     var displayName: string;
 }
 export type ColorPresetsContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, "children" | "role"> & {
-    /** Visible heading above the grid; also the list's accessible name (else `labels.list`). */
+    /**
+     * Heading above the grid; also the list's accessible name (else `labels.list`).
+     */
     label?: React.ReactNode;
+    /**
+     * Alignment along the trigger. `auto` lines the panel up with the trigger edge that has more room beyond it; `start`, `center` or `end` fix it.
+     */
     align?: PositionAlign;
+    /**
+     * Side of the trigger.
+     */
     side?: PositionSide;
     /** The floating panel. */
     ref?: React.Ref<HTMLDivElement>;

package/dist/components/color-swatches/ColorSwatches.d.ts

@@ -1,5 +1,5 @@
 import { type FieldFrameProps, type FieldRootDomProps } from "../../internal/FieldFrame";
-import type { ControlSize } from "../../internal/states";
+import type { ControlSize, PaletteColor } from "../../internal/states";
 import { type ColorPreset } from "../../internal/swatch";
 export type ColorSwatchesLabels = {
     /** Accessible name of the group when there is no visible `label` and no `aria-label`. */
@@ -8,38 +8,110 @@ export type ColorSwatchesLabels = {
     empty: string;
     /** Muted marker after the label for `optional`. */
     optional: string;
+    /** Names of the palette hues (`mode="palette"`): each swatch's accessible name. */
+    colorNames: Record<PaletteColor, string>;
 };
-export type ColorSwatchesProps = FieldRootDomProps & Omit<FieldFrameProps, "focusRing"> & {
-    /** Controlled color; `null` — no color. */
-    value?: string | null;
-    defaultValue?: string | null;
-    onValueChange?: (value: string | null) => void;
-    /** Swatches in order. Default: `COLOR_PRESETS` (16). */
-    presets?: readonly ColorPreset[];
+export declare const COLOR_SWATCHES_LABELS: ColorSwatchesLabels;
+type ColorSwatchesBaseProps = FieldRootDomProps & FieldFrameProps & {
     /**
-     * Tier: swatch = control height − 8 (20 · 24 · 28 · 32 · 40), gap = tier gap. Default: the
-     * tier of the surrounding control, else `m`.
+     * Tier of the swatches (height 20 · 24 · 28 · 32 · 40); the label and hint keep the host tier. Without it the swatches take the host tier too.
      */
     size?: ControlSize;
+    /**
+     * Disables every swatch (grey, half transparent).
+     */
     disabled?: boolean;
+    /**
+     * Danger inner edge on every swatch and `aria-invalid`. A non-empty `error` implies it.
+     */
     invalid?: boolean;
-    /** Adds the "no color" swatch after the presets (value `null`). */
+    /**
+     * Adds the «no color» checkerboard swatch after the presets (value `null`).
+     */
     allowEmpty?: boolean;
-    /** Form field name: a hidden input submits the selected color (empty string for no color). */
+    /**
+     * Form field name: a hidden input submits the selected color (empty string for no color).
+     */
     name?: string;
+    /**
+     * Id of the radiogroup; hint id is `<id>-hint`, error id is `<id>-error`.
+     */
     id?: string;
+    /**
+     * Accessible name when there is no visible `label` (else `labels.group`).
+     */
     "aria-label"?: string;
+    /**
+     * Names the group by an outside element.
+     */
     "aria-labelledby"?: string;
+    /**
+     * Merged before the hint/error ids.
+     */
     "aria-describedby"?: string;
+    /**
+     * Built-in strings, see Labels.
+     */
     labels?: Partial<ColorSwatchesLabels>;
 };
-/**
- * Columns of a grid of `count` swatches in `width`: as many tier-sized swatches as fit, then spread
- * evenly over the rows that needs (16 in a row of 14 → two rows of 8, not 14 + 2).
- */
-export declare function balancedColumns(count: number, width: number, cell: number, gap: number): number;
+/** Any CSS color from a preset list (the default mode). */
+export type ColorSwatchesColorProps = ColorSwatchesBaseProps & {
+    /**
+     * `color` — any CSS color from `presets`; `palette` — a kit palette hue (`PaletteColor`) from `palette`, drawn from its solid step in both themes.
+     */
+    mode?: "color";
+    /**
+     * Controlled color (a hue with `palette`); `null` — no color.
+     */
+    value?: string | null;
+    /**
+     * Initial color when uncontrolled.
+     */
+    defaultValue?: string | null;
+    /**
+     * Called with the preset `value` (as written in `presets`), the hue with `palette`, or `null`.
+     */
+    onValueChange?: (value: string | null) => void;
+    /**
+     * `color` mode: swatches in order, `{ value, label }`; the label is the swatch's accessible name and tooltip.
+     */
+    presets?: readonly ColorPreset[];
+    /**
+     * `palette` mode: the hues in order; each is named by `labels.colorNames`.
+     */
+    palette?: never;
+};
+/** A kit palette hue: the value is its name, the swatches its solid step in both themes. */
+type ColorSwatchesPaletteProps = ColorSwatchesBaseProps & {
+    /**
+     * `color` — any CSS color from `presets`; `palette` — a kit palette hue (`PaletteColor`) from `palette`, drawn from its solid step in both themes.
+     */
+    mode: "palette";
+    /**
+     * Controlled color (a hue with `palette`); `null` — no color.
+     */
+    value?: PaletteColor | null;
+    /**
+     * Initial color when uncontrolled.
+     */
+    defaultValue?: PaletteColor | null;
+    /**
+     * Called with the preset `value` (as written in `presets`), the hue with `palette`, or `null`.
+     */
+    onValueChange?: (value: PaletteColor | null) => void;
+    /**
+     * `color` mode: swatches in order, `{ value, label }`; the label is the swatch's accessible name and tooltip.
+     */
+    presets?: never;
+    /**
+     * `palette` mode: the hues in order; each is named by `labels.colorNames`.
+     */
+    palette?: readonly PaletteColor[];
+};
+export type ColorSwatchesProps = ColorSwatchesColorProps | ColorSwatchesPaletteProps;
 /**
  * Inline color choice: a wrapping grid of swatches, one selected (`role="radiogroup"`).
  * Fits forms and dialogs where opening a palette popover would be one step too many.
  */
-export declare function ColorSwatches({ value: valueProp, defaultValue, onValueChange, presets, size: sizeProp, disabled: disabledProp, invalid, allowEmpty, name, id, className, label, required, optional, hint, error, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, labels: labelsProp, ...rest }: ColorSwatchesProps): import("react/jsx-runtime").JSX.Element;
+export declare function ColorSwatches(props: ColorSwatchesProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/command-menu/CommandMenu.d.ts

@@ -12,53 +12,96 @@ export type CommandMenuLabels = {
     /** The retry button of the load error (`onRetry`). */
     retry: string;
 };
+export declare const COMMAND_MENU_LABELS: CommandMenuLabels;
 export type CommandMenuRootProps = Omit<React.HTMLAttributes<HTMLDivElement>, "children" | "defaultValue"> & {
+    /**
+     * Controlled visibility; together with `onOpenChange`.
+     */
     open?: boolean;
+    /**
+     * Initial visibility, uncontrolled.
+     */
     defaultOpen?: boolean;
+    /**
+     * Called on every open and close: Escape, scrim click, code.
+     */
     onOpenChange?: (open: boolean) => void;
-    /** The query (controlled); together with `onSearchChange`. Cleared when the palette closes. */
+    /**
+     * Controlled query; the list filters by it. Together with `onSearchChange`.
+     */
     search?: string;
-    /** The initial query, uncontrolled. Default `""`. */
+    /**
+     * Initial query, uncontrolled.
+     */
     defaultSearch?: string;
-    /** Called with the new query (typing, and `""` when the palette closes). */
+    /**
+     * Called with the new query: typing, and `""` when the palette closes. Load the matching results here for a server search.
+     */
     onSearchChange?: (search: string) => void;
     /**
-     * The palette filters its items by the query. `false` when the results come from a server:
-     * every item shows, highlighting of the query stays.
+     * The palette filters its items by the query. `false` when the results come from a server: every item shows, the query is still marked in the labels.
      */
     filter?: boolean;
-    /** The first results are loading: skeleton rows while no item matches; `aria-busy`. */
+    /**
+     * Results are loading: skeleton rows in the list while no item matches (items already on screen stay), `aria-busy`.
+     */
     loading?: boolean;
-    /** More results are loading at the end: skeleton rows after the items. */
+    /**
+     * More results are loading at the end: skeleton rows after the items.
+     */
     loadingMore?: boolean;
-    /** More results exist: reaching the end of the list calls `onLoadMore`. */
+    /**
+     * More results exist: reaching the end of the list calls `onLoadMore`.
+     */
     hasMore?: boolean;
-    /** Asked once per round when the end of the list scrolls into view or the arrows reach it. */
+    /**
+     * Called once per round with `hasMore` when the end of the list scrolls into view or the arrows reach the last item; set `loadingMore` while it runs.
+     */
     onLoadMore?: () => void | Promise<void>;
-    /** The results failed to load: replaces the list with the message in `role="alert"`. */
+    /**
+     * The results failed to load: the message replaces the list in `role="alert"`.
+     */
     loadError?: React.ReactNode;
     /**
-     * A retry button (`labels.retry`) under `loadError`; Enter in the search field runs it too.
-     * Return the request's promise: the button is loading and takes no second press until it
-     * settles; resolve — swap `loadError` for the results; reject — the error stays.
+     * A retry button (`labels.retry`) under `loadError`; Enter in the search field runs it too. Return the request's promise to keep the button loading until it settles.
      */
     onRetry?: () => void | Promise<void>;
-    /** Escape closes the palette. Default `true`. */
+    /**
+     * Escape closes the palette.
+     */
     closeOnEscape?: boolean;
-    /** A click on the scrim closes the palette. Default `true`. */
+    /**
+     * A click on the scrim closes the palette; focus returns to the opener.
+     */
     closeOnOutsideClick?: boolean;
-    /** Tier of the rows and the search row: item height, text, icon. */
+    /**
+     * Tier of the rows and the search row: item height, text, icon. Without it the tier of the host it opens from, else `m`.
+     */
     size?: ControlSize;
+    /**
+     * Built-in strings, see Labels.
+     */
     labels?: Partial<CommandMenuLabels>;
-    /** Name of the dialog when there is no `CommandMenu.Title`. */
+    /**
+     * Name and description of the dialog when there is no `CommandMenu.Title` / `Description`.
+     */
     "aria-label"?: string;
+    /**
+     * Name and description of the dialog when there is no `CommandMenu.Title` / `Description`.
+     */
     "aria-labelledby"?: string;
+    /**
+     * Name and description of the dialog when there is no `CommandMenu.Title` / `Description`.
+     */
     "aria-describedby"?: string;
+    /**
+     * Title, Description, Input, List, Footer.
+     */
     children: React.ReactNode;
     /** The dialog panel. */
     ref?: React.Ref<HTMLDivElement>;
 };
-declare function CommandMenuRoot({ open, defaultOpen, onOpenChange, search: searchProp, defaultSearch, onSearchChange, filter, loading, loadingMore, hasMore, onLoadMore, loadError, onRetry, closeOnEscape, closeOnOutsideClick, size, labels: labelsProp, className, children, ...rest }: CommandMenuRootProps): import("react/jsx-runtime").JSX.Element;
+declare function CommandMenuRoot({ open, defaultOpen, onOpenChange, search: searchProp, defaultSearch, onSearchChange, filter, loading, loadingMore, hasMore, onLoadMore, loadError, onRetry, closeOnEscape, closeOnOutsideClick, size: sizeProp, labels: labelsProp, className, children, ...rest }: CommandMenuRootProps): import("react/jsx-runtime").JSX.Element;
 declare namespace CommandMenuRoot {
     var displayName: string;
 }
@@ -103,7 +146,9 @@ declare namespace CommandMenuList {
     var displayName: string;
 }
 export type CommandMenuGroupProps = Omit<React.HTMLAttributes<HTMLDivElement>, "role"> & {
-    /** Visible heading of the group; names it for screen readers. */
+    /**
+     * Heading of the group (caption, muted); also its accessible name.
+     */
     label?: React.ReactNode;
     ref?: React.Ref<HTMLDivElement>;
 };
@@ -113,18 +158,25 @@ declare namespace CommandMenuGroup {
     var displayName: string;
 }
 export type CommandMenuItemProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "type" | "role" | "id" | "onSelect"> & {
-    /** Text matched with `keywords`; with `""` the item shows only while the query is empty or `keywords` match. */
+    /**
+     * Text matched against the query together with `keywords`. With `""` the item shows only while the query is empty or `keywords` match.
+     */
     value: string;
-    /** Extra words for the query (synonyms, English names). */
+    /**
+     * Extra words for the query (synonyms, English names).
+     */
     keywords?: string;
-    /** Unavailable right now: shown muted with `aria-disabled`, skipped by the arrows, not runnable. */
+    /**
+     * Unavailable right now: shown muted with `aria-disabled`, skipped by the arrows, does not run.
+     */
     disabled?: boolean;
     /**
-     * Shown whatever the query and never counted as a match (the match count, `CommandMenu.Empty`);
-     * the arrows reach it after the matches. For one «create from the query» item at the end.
+     * Shown whatever the query and never counted as a match (`CommandMenu.Empty` still shows); the arrows reach it after the matches. One «create from the query» item at the end of the list.
      */
     persistent?: boolean;
-    /** Runs the command: a click, or Enter while the item is active. */
+    /**
+     * Runs the command: a click, or Enter while the item is active.
+     */
     onSelect?: () => void;
     ref?: React.Ref<HTMLButtonElement>;
 };
@@ -141,7 +193,9 @@ declare namespace CommandMenuItemIcon {
     var displayName: string;
 }
 export type CommandMenuItemTextProps = React.HTMLAttributes<HTMLSpanElement> & {
-    /** Second line (path, details): caption, muted. */
+    /**
+     * Second line (path, details): caption, muted.
+     */
     description?: React.ReactNode;
     ref?: React.Ref<HTMLSpanElement>;
 };
@@ -151,6 +205,9 @@ declare namespace CommandMenuItemText {
     var displayName: string;
 }
 export type CommandMenuItemShortcutProps = Omit<React.HTMLAttributes<HTMLElement>, "children"> & {
+    /**
+     * The keys («⌘K»).
+     */
     children: React.ReactNode;
     ref?: React.Ref<HTMLElement>;
 };
@@ -180,7 +237,9 @@ declare namespace CommandMenuFooter {
     var displayName: string;
 }
 export type CommandMenuFooterHintProps = React.HTMLAttributes<HTMLSpanElement> & {
-    /** Keys (text or icons), each in its own Kbd. */
+    /**
+     * The keys (text or icons).
+     */
     keys: React.ReactNode[];
     ref?: React.Ref<HTMLSpanElement>;
 };

package/dist/components/composer/Composer.d.ts

@@ -3,6 +3,7 @@ import type { UploadItem, UploadQueue } from "../../hooks/useUploadQueue";
 import { type MediaKind } from "../../internal/mediaKind";
 import { type ControlSize } from "../../internal/states";
 import { type TextFormattingLabels } from "../../internal/textFormatting";
+import { type AsyncHandler } from "../../internal/usePendingChanges";
 import { type ComposerRecording, type ComposerRecordMode } from "./useRecorder";
 export type { ComposerRecording, ComposerRecordMode } from "./useRecorder";
 /** Every built-in string; the formatting toolbar's names are shared with Textarea. */
@@ -66,18 +67,20 @@ export type ComposerLabels = TextFormattingLabels & {
     /** Name of the close button of an edit bar. */
     cancelEdit: string;
 };
+export declare const COMPOSER_LABELS: ComposerLabels;
 /** An attached photo or video: the uploaded queue item and what it shows. */
 export type ComposerMediaItem = UploadItem & {
     type: MediaKind;
 };
 /**
- * What `onSend` receives: the text (trimmed); the uploaded `media` (photos and videos, in the order
- * of the tray — one album) and `files` (everything else, or every file with «как файлы»); and the
- * `value` of the shown `Composer.Context` — `replyTo` for a reply, `editOf` for an edit.
+ * What `onSend` receives: the text (trimmed); the uploaded photos and videos as `albums` (in the
+ * order of the tray, a new album every `GALLERY_MAX` items — one message each) and `files`
+ * (everything else, or every file with «как файлы»); and the `messageId` of the shown
+ * `Composer.Context` — `replyTo` for a reply, `editOf` for an edit.
  */
 export type ComposerMessage = {
     text: string;
-    media: readonly ComposerMediaItem[];
+    albums: readonly (readonly ComposerMediaItem[])[];
     files: readonly UploadItem[];
     replyTo?: string;
     editOf?: string;
@@ -89,55 +92,80 @@ export type ComposerMessage = {
 export type ComposerActivity = "typing" | "voice" | "video";
 /** The queue the composer attaches files to (`useUploadQueue`). */
 export type ComposerQueue = Pick<UploadQueue, "items" | "add" | "retry" | "remove" | "clear" | "move">;
-/** A slow event: return a Promise to show it pending (resolve = done, reject = nothing changes). */
-type AsyncEvent<T> = (value: T) => void | Promise<unknown>;
 /** Reply to a message, or edit one of yours. */
 export type ComposerContextMode = "reply" | "edit";
 export type ComposerRootProps = Omit<React.FormHTMLAttributes<HTMLFormElement>, "children" | "defaultValue" | "onSubmit"> & {
-    /** The text of the message (controlled). */
+    /**
+     * The text of the message (controlled).
+     */
     value?: string;
-    /** Initial text, uncontrolled (a saved draft). */
+    /**
+     * Initial text, uncontrolled (a saved draft).
+     */
     defaultValue?: string;
-    /** Every change of the text: typing, formatting, the field cleared after a send. */
+    /**
+     * Every change of the text: typing, formatting, the field cleared after a send.
+     */
     onValueChange?: (value: string) => void;
     /**
-     * Sends the message: Enter, Mod+Enter or the send button. Return a Promise to keep the text
-     * while it runs (the send button is busy, the field read-only): resolve clears the field and the
-     * attachments and closes the reply / edit bar (its `onDismiss`), reject leaves everything as it was.
+     * Sends the message (Enter, Mod+Enter, the button): trimmed `text`, photos and videos as `albums` of up to 10, `files`, `replyTo` / `editOf`. A Promise keeps the text until it resolves; reject changes nothing.
      */
-    onSend?: AsyncEvent<ComposerMessage>;
+    onSend?: AsyncHandler<[message: ComposerMessage], unknown>;
     /**
-     * What the person is doing changed: `typing` from the first keystroke until the text is sent,
-     * cleared or rests for 3 s; `voice` / `video` while a recording shows; `null` — nothing. Fires on
-     * a change only (and `null` on unmount while active): send the signal to the other side from here.
+     * What the person is doing changed, for the other side's «печатает…»: `typing`, `voice` / `video` while recording, or `null`. Fires on a change only.
      */
     onActivityChange?: (activity: ComposerActivity | null) => void;
-    /** A voice message was recorded. With it (or `onSendVideoNote`) an empty field shows the record button. */
-    onSendVoice?: AsyncEvent<ComposerRecording>;
     /**
-     * A round video message was recorded. With it a double click / double tap (or ↑ ↓) on the record
-     * button switches voice and video.
+     * A voice message was recorded: the `MediaRecorder` blob, its length and 48 loudness values 0…1 for its waveform. With it an empty field shows the record button (where the browser can record).
+     */
+    onSendVoice?: AsyncHandler<[recording: ComposerRecording], unknown>;
+    /**
+     * A round video message was recorded (front camera and microphone), at most 60 s. With both record handlers a double click or tap on the record button (or ↑ / ↓ on it) switches voice and video.
+     */
+    onSendVideoNote?: AsyncHandler<[recording: ComposerRecording], unknown>;
+    /**
+     * ↑ in an empty field: open your last message for editing (show a `Composer.Context mode="edit"` and put its text into `value`).
      */
-    onSendVideoNote?: AsyncEvent<ComposerRecording>;
-    /** ↑ in an empty field: open your last message for editing. */
     onEditLast?: () => void;
-    /** What the record button records (controlled); `video` needs `onSendVideoNote`. */
+    /**
+     * What the record button records (controlled); `video` needs `onSendVideoNote`.
+     */
     recordMode?: ComposerRecordMode;
-    /** Initial record mode, uncontrolled. */
+    /**
+     * Initial record mode, uncontrolled.
+     */
     defaultRecordMode?: ComposerRecordMode;
-    /** A double click / double tap (or ↑ ↓) on the record button switched voice and video. */
+    /**
+     * A double click / double tap on the record button (or ↑ / ↓ on it) switched voice and video.
+     */
     onRecordModeChange?: (mode: ComposerRecordMode) => void;
-    /** Attachments: the files of the paperclip, a paste and a drop go into it and show above the field. */
+    /**
+     * Attachments, usually `useUploadQueue(…)`: the paperclip, a paste and a drop add to it, and a tray above the row shows them as one reorderable strip of tiles. Without `queue` paste and drop of files do nothing.
+     */
     queue?: ComposerQueue;
-    /** The formatting toolbar on a text selection and the formatting hotkeys. */
+    /**
+     * Selecting text shows a floating toolbar of seven Markdown tools and enables their hotkeys; a tool wraps the selection, a second press unwraps it. `false` turns both off.
+     */
     formatting?: boolean;
-    /** Tier. Default: the tier of the surrounding control, else `m`. */
+    /**
+     * Tier of the field, the buttons and the bar text. Without it the tier of its host, else `m`.
+     */
     size?: ControlSize;
+    /**
+     * A closed conversation: the field, the paperclip and the button are disabled; nothing is pasted or dropped. A disabled `Fieldset` around it sets it too (`data-disabled` included).
+     */
     disabled?: boolean;
+    /**
+     * Built-in strings, see Labels.
+     */
     labels?: Partial<ComposerLabels>;
-    /** The message `<textarea>` (focus it after «Ответить» in a message menu). */
+    /**
+     * The message `<textarea>`: focus it after «Ответить» in a message menu.
+     */
     inputRef?: React.Ref<HTMLTextAreaElement>;
-    /** `Composer.Attach` (the start of the row) and `Composer.Context` (above the field). */
+    /**
+     * `Composer.Attach` (placed at the start of the row) and `Composer.Context` (above the field).
+     */
     children?: React.ReactNode;
     ref?: React.Ref<HTMLFormElement>;
 };
@@ -146,21 +174,26 @@ declare namespace ComposerRoot {
     var displayName: string;
 }
 export type ComposerContextProps = React.HTMLAttributes<HTMLDivElement> & {
-    /** `reply` — a reply to a message; `edit` — your message is being edited (send saves). */
+    /**
+     * `reply` — a reply to a message; `edit` — your message is being edited: the send button turns into «Сохранить» and the record button is not offered.
+     */
     mode?: ComposerContextMode;
-    /** The id of the message answered or edited: `onSend` gets it as `replyTo` / `editOf`. */
-    value?: string;
     /**
-     * Stop replying or editing: the close button, Escape in the field, and a send that went through.
-     * Without it no close button.
+     * The id of the message answered or edited: `onSend` receives it as `replyTo` (`reply`) or `editOf` (`edit`).
+     */
+    messageId?: string;
+    /**
+     * Stop replying or editing: the close button, Escape in the field, and a send that went through. Without it the bar has no close button.
      */
     onDismiss?: () => void;
-    /** `Composer.Title` and `Composer.Description`. */
+    /**
+     * `Composer.Title` and `Composer.Description`.
+     */
     children?: React.ReactNode;
     ref?: React.Ref<HTMLDivElement>;
 };
 /** The bar above the field: «Ответ Анне» with the quoted text, or «Редактирование». */
-declare function ComposerContext({ mode, value, onDismiss, id: idProp, className, children, ...rest }: ComposerContextProps): import("react/jsx-runtime").JSX.Element;
+declare function ComposerContext({ mode, messageId, onDismiss, id: idProp, className, children, ...rest }: ComposerContextProps): import("react/jsx-runtime").JSX.Element;
 declare namespace ComposerContext {
     var displayName: string;
 }
@@ -181,9 +214,13 @@ declare namespace ComposerDescription {
     var displayName: string;
 }
 export type ComposerAttachProps = Omit<React.HTMLAttributes<HTMLDivElement>, "children"> & {
-    /** File types of the picker without a menu. */
+    /**
+     * File types of the picker without a menu.
+     */
     accept?: string;
-    /** `Composer.Item` kinds of attachment: with them the paperclip opens a menu. */
+    /**
+     * `Composer.Item` kinds of attachment.
+     */
     children?: React.ReactNode;
     ref?: React.Ref<HTMLDivElement>;
 };
@@ -197,9 +234,13 @@ declare namespace ComposerAttach {
     var displayName: string;
 }
 export type ComposerItemProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onSelect" | "type"> & {
-    /** File types this item picks («image/*,video/*»). Without it the item only runs `onSelect`. */
+    /**
+     * File types this item picks (`"image/*,video/*"`; `""` for any file). Without it the item only runs `onSelect`.
+     */
     accept?: string;
-    /** The item's own action (a poll, a location), after the picker opens when `accept` is set. */
+    /**
+     * The item's own action (a poll, a location); runs after the picker opens when `accept` is set.
+     */
     onSelect?: () => void;
     ref?: React.Ref<HTMLButtonElement>;
 };