@stealthscale/component-messaging 0.1.0

package/dist/index.d.ts

@@ -0,0 +1,826 @@
+import { ComponentProps, ReactElement, ReactNode } from "react";
+import { ButtonProps } from "@stealthscale/component-actions";
+import { ScrollArea } from "@stealthscale/component-primitives";
+import { StickToBottomInstance } from "use-stick-to-bottom";
+import { Popover } from "@stealthscale/component-disclosure";
+//#region src/attachment/actions.d.ts
+/**
+ * Renders the actions' `div`.
+ */
+declare const Actions$1: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of `Actions`.
+ */
+type ActionsProps$1 = ComponentProps<typeof Actions$1>;
+//#endregion
+//#region src/attachment/content.d.ts
+/**
+ * Renders the column's `div`.
+ */
+declare const Content$2: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of `Content`.
+ */
+type ContentProps$2 = ComponentProps<typeof Content$2>;
+//#endregion
+//#region src/attachment/description.d.ts
+/**
+ * Renders the description's `span`.
+ */
+declare const Description: import("@stealthscale/theme").StyledComponent<"span", {}>;
+/**
+ * Describes the props of `Description`.
+ */
+type DescriptionProps = ComponentProps<typeof Description>;
+//#endregion
+//#region src/attachment/group.d.ts
+/**
+ * Renders the `ul` with the attachment's group class.
+ */
+declare const Listed: import("@stealthscale/theme").StyledComponent<"ul", {
+  readonly orientation?: "horizontal" | "vertical";
+  readonly size?: "md" | "sm" | "xs";
+}>;
+/**
+ * Describes the props of the group: the size and orientation of its attachments, and the props of
+ * a `ul`.
+ */
+type GroupProps = ComponentProps<typeof Listed>;
+/**
+ * Renders the list and provides its size and orientation to the attachments inside.
+ *
+ * @param props - The size and orientation of the attachments, and the props of a `ul`.
+ * @returns The `ul` element inside the provider.
+ */
+declare function Group(props: GroupProps): ReactElement;
+//#endregion
+//#region src/attachment/media.d.ts
+/**
+ * Renders the media square's `div`.
+ */
+declare const Media: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of `Media`.
+ */
+type MediaProps = ComponentProps<typeof Media>;
+//#endregion
+//#region src/attachment/root.d.ts
+/**
+ * Renders the `div` with the attachment's variants.
+ */
+declare const Framed: import("@stealthscale/theme").StyledComponent<"div", {
+  readonly orientation?: "horizontal" | "vertical";
+  readonly size?: "md" | "sm" | "xs";
+}>;
+/**
+ * Lists the states of an attachment.
+ */
+type AttachmentState = "done" | "error" | "idle" | "processing" | "uploading";
+/**
+ * Describes the props of an attachment: its state, the recipe's variants and the props of a `div`.
+ */
+interface RootProps$4 extends ComponentProps<typeof Framed> {
+  /**
+   * Where the file is on its way, `done` unless stated.
+   */
+  readonly state?: AttachmentState | undefined;
+}
+/**
+ * Renders the attachment, an `li` inside a group.
+ *
+ * @param props - The state, the recipe's variants and the props of a `div`.
+ * @returns The `div` or `li` element.
+ */
+declare function Root$4({ orientation, size, state, ...props }: RootProps$4): ReactElement;
+//#endregion
+//#region src/attachment/title.d.ts
+/**
+ * Renders the title's `span`.
+ */
+declare const Title: import("@stealthscale/theme").StyledComponent<"span", {}>;
+/**
+ * Describes the props of `Title`.
+ */
+type TitleProps = ComponentProps<typeof Title>;
+declare namespace index_d_exports {
+  export { Actions$1 as Actions, ActionsProps$1 as ActionsProps, AttachmentState, Content$2 as Content, ContentProps$2 as ContentProps, Description, DescriptionProps, Group, GroupProps, Media, MediaProps, Root$4 as Root, RootProps$4 as RootProps, Title, TitleProps };
+}
+//#endregion
+//#region src/composer/attach-trigger.d.ts
+/**
+ * Describes the props of the attach control: its name, the files it accepts, and the props of the
+ * actions `Button`.
+ */
+interface AttachTriggerProps extends ButtonProps {
+  /**
+   * File types the picker offers, as an `input`'s `accept` attribute takes them.
+   */
+  readonly accept?: string | undefined;
+  /**
+   * Accessible name of the control, "Attach files" unless stated.
+   */
+  readonly label?: string | undefined;
+}
+/**
+ * Renders the control and the hidden file input.
+ *
+ * @param props - The name, the accepted types and the props of the actions `Button`, the glyph
+ *   among its children.
+ * @returns The `button` element and the `input` element.
+ */
+declare function AttachTrigger({ accept, label, onClick, ...props }: AttachTriggerProps): ReactElement;
+//#endregion
+//#region src/composer/attachments.d.ts
+/**
+ * Renders the row's `div`.
+ */
+declare const Attachments: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of `Attachments`.
+ */
+type AttachmentsProps = ComponentProps<typeof Attachments>;
+//#endregion
+//#region src/composer/context-strip.d.ts
+/**
+ * Renders the strip's `div`.
+ */
+declare const Context: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of `Context`.
+ */
+type ContextProps = ComponentProps<typeof Context>;
+//#endregion
+//#region src/composer/mentions.d.ts
+/**
+ * Finds the mention a reader is typing at the caret, and writes a chosen name in its place.
+ *
+ * @remarks
+ *   A trigger character opens a query only at the start of the text or after whitespace, so
+ *   `ada@example.com` is an address and not a mention of `example.com`. Whitespace ends a query: a
+ *   term never spans a space or a line break. So at most one trigger opens a query at the caret: a
+ *   second trigger after the first needs whitespace before it, which ends the first query. The text
+ *   keeps the name the reader sees, such as `@Ada Okafor`, and a space after it.
+ */
+/**
+ * Describes the mention a reader is typing.
+ */
+interface Query {
+  /**
+   * Index of the trigger character in the text.
+   */
+  readonly from: number;
+  /**
+   * The text typed after the trigger, up to the caret, without whitespace.
+   */
+  readonly term: string;
+  /**
+   * The trigger character, such as `@`.
+   */
+  readonly trigger: string;
+}
+//#endregion
+//#region src/composer/use-mentions.d.ts
+/**
+ * Describes one suggestion: the name inserted and a line that tells two names apart.
+ */
+interface Suggestion {
+  /**
+   * Line under the name, such as a team or an email address.
+   */
+  readonly description?: string | undefined;
+  /**
+   * Identifier of the suggestion, unique among the suggestions.
+   */
+  readonly id: string;
+  /**
+   * The name listed and inserted after the trigger.
+   */
+  readonly label: string;
+}
+/**
+ * Describes the mention options the textarea takes.
+ */
+interface MentionOptions {
+  /**
+   * Called with the suggestion inserted and the query it replaced.
+   */
+  readonly onMention?: ((suggestion: Suggestion, query: Query) => void) | undefined;
+  /**
+   * Called with the query at the caret whenever it changes, undefined outside every mention.
+   */
+  readonly onQueryChange?: ((query: Query | undefined) => void) | undefined;
+  /**
+   * The suggestions for the query, which the caller finds from the term.
+   */
+  readonly suggestions?: readonly Suggestion[] | undefined;
+  /**
+   * The characters that open a mention, such as `@` and `#`.
+   */
+  readonly triggers?: readonly string[] | undefined;
+}
+//#endregion
+//#region src/composer/input.d.ts
+/**
+ * Renders the `textarea` with the composer's input class.
+ */
+declare const Typed: import("@stealthscale/theme").StyledComponent<"textarea", {}>;
+/**
+ * Describes the props of the input: its name, its row limit, the mention options, and the props of
+ * a `textarea` without the value and the style, which the composer sets.
+ */
+interface InputProps extends MentionOptions, Omit<ComponentProps<typeof Typed>, "defaultValue" | "style" | "value"> {
+  /**
+   * Accessible name of the textarea, "Message" unless stated.
+   */
+  readonly label?: string | undefined;
+  /**
+   * Most lines the textarea grows to before it scrolls, 8 unless stated.
+   */
+  readonly maxRows?: number | undefined;
+  /**
+   * Accessible name of the list of suggestions, "Suggestions" unless stated.
+   */
+  readonly suggestionsLabel?: string | undefined;
+}
+/**
+ * Renders the textarea with the composer's text and keys, and the list of suggestions.
+ *
+ * @param props - The name, the row limit, the mention options and the props of a `textarea`.
+ * @returns The `textarea` element and the list.
+ */
+declare function Input({ label, maxRows, onBlur, onChange, onKeyDown, onMention, onPaste, onQueryChange, onSelect, ref: handed, suggestions, suggestionsLabel, triggers, ...props }: InputProps): ReactElement;
+//#endregion
+//#region src/composer/state.d.ts
+/**
+ * Provides what the composer's root knows to its parts: the text, whether it can be sent, and the
+ * handlers the parts call.
+ */
+/**
+ * Lists the keys that send: Enter, with Shift+Enter for a new line, or Ctrl+Enter and Cmd+Enter,
+ * with Enter for a new line.
+ */
+type SubmitKey = "enter" | "modEnter";
+//#endregion
+//#region src/composer/root.d.ts
+/**
+ * Renders the `form` with the composer's variants.
+ */
+declare const Form: import("@stealthscale/theme").StyledComponent<"form", {
+  readonly size?: "lg" | "md" | "sm";
+  readonly variant?: import("@stealthscale/theme/authoring").Field;
+}>;
+/**
+ * Describes the props of the root: the text, the states, the handlers and the props of a `form`,
+ * without the element's `onSubmit` event, which the text handler replaces.
+ */
+interface RootProps$3 extends Omit<ComponentProps<typeof Form>, "defaultValue" | "onSubmit"> {
+  /**
+   * Whether files are attached, which makes a message without text one that can be sent.
+   */
+  readonly attached?: boolean | undefined;
+  /**
+   * Whether a response is running: the composer sends nothing, and the submit control stops the
+   * response where `onStop` is set.
+   */
+  readonly busy?: boolean | undefined;
+  /**
+   * Text of a composer the caller does not control.
+   */
+  readonly defaultValue?: string | undefined;
+  /**
+   * Whether the composer takes no input.
+   */
+  readonly disabled?: boolean | undefined;
+  /**
+   * Called with the files a reader picks, drops or pastes. Without it the composer attaches
+   * nothing.
+   */
+  readonly onAttach?: ((files: File[]) => void) | undefined;
+  /**
+   * Called when Escape in the textarea dismisses the message the composer replies to.
+   */
+  readonly onCancelContext?: (() => void) | undefined;
+  /**
+   * Called when ArrowUp in an empty textarea asks to edit the reader's last message.
+   */
+  readonly onEditLast?: (() => void) | undefined;
+  /**
+   * Called when the submit control interrupts a running response.
+   */
+  readonly onStop?: (() => void) | undefined;
+  /**
+   * Called with the text, trimmed, when the reader sends it.
+   */
+  readonly onSubmit?: ((value: string) => void) | undefined;
+  /**
+   * Called with the text on every change.
+   */
+  readonly onValueChange?: ((value: string) => void) | undefined;
+  /**
+   * Keys that send, `enter` unless stated.
+   */
+  readonly submitOn?: SubmitKey | undefined;
+  /**
+   * Controlled text.
+   */
+  readonly value?: string | undefined;
+}
+/**
+ * Renders the form and provides the text and the handlers to its parts.
+ *
+ * @param props - The text, the states, the handlers and the props of a `form`.
+ * @returns The `form` element inside the state's provider.
+ */
+declare function Root$3({ attached, busy, defaultValue, disabled, onAttach, onCancelContext, onEditLast, onStop, onSubmit, onValueChange, submitOn, value, ...props }: RootProps$3): ReactElement;
+//#endregion
+//#region src/composer/submit.d.ts
+/**
+ * Describes the props of the submit control: its names, the stop glyph, and the props of the
+ * actions `Button`.
+ */
+interface SubmitProps extends ButtonProps {
+  /**
+   * Accessible name while the control sends, "Send" unless stated.
+   */
+  readonly label?: string | undefined;
+  /**
+   * Glyph while the control stops a response.
+   */
+  readonly stopIcon?: ReactNode;
+  /**
+   * Accessible name while the control stops a response, "Stop" unless stated.
+   */
+  readonly stopLabel?: string | undefined;
+}
+/**
+ * Renders the control that sends, or stops while a response runs.
+ *
+ * @param props - The names, the stop glyph and the props of the actions `Button`, the send glyph
+ *   among its children.
+ * @returns The `button` element.
+ */
+declare function Submit({ children, label, onClick, stopIcon, stopLabel, ...props }: SubmitProps): ReactElement;
+//#endregion
+//#region src/composer/toolbar.d.ts
+/**
+ * Renders the row's `div`.
+ */
+declare const Toolbar: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of `Toolbar`.
+ */
+type ToolbarProps = ComponentProps<typeof Toolbar>;
+declare namespace index_d_exports$1 {
+  export { AttachTrigger, AttachTriggerProps, Attachments, AttachmentsProps, Context, ContextProps, Input, InputProps, Query, Root$3 as Root, RootProps$3 as RootProps, Submit, SubmitKey, SubmitProps, Suggestion, Toolbar, ToolbarProps };
+}
+//#endregion
+//#region src/conversation/content.d.ts
+/**
+ * Describes the props of the transcript: the props of the scroll area's viewport, without `ref`,
+ * which the engine takes.
+ */
+type ContentProps$1 = Omit<ScrollArea.ViewportProps, "ref">;
+/**
+ * Renders the log around the content, with the engine's refs on both.
+ *
+ * @param props - The props of the scroll area's viewport, the turns among its children.
+ * @returns The viewport element.
+ */
+declare function Content$1({ children, ...props }: ContentProps$1): ReactElement;
+//#endregion
+//#region src/conversation/jump-trigger.d.ts
+/**
+ * Describes the props of the control: its name and the props of the actions `Button`.
+ */
+interface JumpTriggerProps extends ButtonProps {
+  /**
+   * Accessible name of the control, "Jump to the latest message" unless stated.
+   */
+  readonly label?: string | undefined;
+}
+/**
+ * Renders the control while the view is away from the end.
+ *
+ * @param props - The control's name and the props of the actions `Button`, the glyph among its
+ *   children.
+ * @returns The placed control, or nothing at the end of the transcript.
+ */
+declare function JumpTrigger({ label, onClick, ...props }: JumpTriggerProps): null | ReactElement;
+//#endregion
+//#region src/conversation/use-conversation.d.ts
+/**
+ * Describes a conversation's scroll engine: the view's place, the two scrolls, and the refs
+ * `Conversation.Root` gives its viewport and content.
+ */
+interface ConversationApi {
+  /**
+   * Whether the view is at the end of the transcript or within 70px of it.
+   */
+  readonly atEnd: boolean;
+  /**
+   * Ref the transcript's content element takes, whose growth the engine follows.
+   */
+  readonly contentRef: StickToBottomInstance["contentRef"];
+  /**
+   * Ref the transcript's viewport takes, the element that scrolls.
+   */
+  readonly scrollRef: StickToBottomInstance["scrollRef"];
+  /**
+   * Scrolls to the end of the transcript and follows it again.
+   */
+  readonly scrollToEnd: () => void;
+  /**
+   * Scrolls the element with the `id` given to the top of the view and stops following the end,
+   * for a jump to the first unread message or to a search result.
+   */
+  readonly scrollToMessage: (id: string) => void;
+}
+/**
+ * Runs the scroll engine of one conversation.
+ *
+ * @returns Whether the view is at the end, the two scrolls, and the refs the root passes on.
+ */
+declare function useConversation(): ConversationApi;
+//#endregion
+//#region src/conversation/root.d.ts
+/**
+ * Describes the props of the root: the engine, the log's name and the props of the scroll area's
+ * root.
+ */
+interface RootProps$2 extends ScrollArea.RootProps {
+  /**
+   * Scroll engine `useConversation` returns. The root runs its own unless stated.
+   */
+  readonly conversation?: ConversationApi | undefined;
+  /**
+   * Accessible name of the transcript's log, "Messages" unless stated.
+   */
+  readonly label?: string | undefined;
+}
+/**
+ * Renders the root and provides the conversation's state to its parts.
+ *
+ * @param props - The engine, the log's name and the props of the scroll area's root.
+ * @returns The scroll area's root inside the state's provider.
+ */
+declare function Root$2({ children, conversation, label, ...props }: RootProps$2): ReactElement;
+//#endregion
+//#region src/conversation/typing.d.ts
+/**
+ * Renders the row's `div`.
+ */
+declare const Row: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the row: the props of a `div`, the words among its children.
+ */
+type TypingProps = ComponentProps<typeof Row>;
+/**
+ * Renders the dots before the caller's words.
+ *
+ * @param props - The props of a `div`, the words among its children.
+ * @returns The `div` element.
+ */
+declare function Typing({ children, ...props }: TypingProps): ReactElement;
+declare namespace index_d_exports$2 {
+  export { Content$1 as Content, ContentProps$1 as ContentProps, ConversationApi, JumpTrigger, JumpTriggerProps, Root$2 as Root, RootProps$2 as RootProps, Typing, TypingProps, useConversation };
+}
+//#endregion
+//#region src/message/actions.d.ts
+/**
+ * Renders the actions' `div`.
+ */
+declare const Actions: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of `Actions`.
+ */
+type ActionsProps = ComponentProps<typeof Actions>;
+//#endregion
+//#region src/message/avatar.d.ts
+/**
+ * Renders the avatar's `div`.
+ */
+declare const Avatar: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of `Avatar`.
+ */
+type AvatarProps = ComponentProps<typeof Avatar>;
+//#endregion
+//#region src/message/bubble.d.ts
+/**
+ * Renders the bubble's `div`.
+ */
+declare const Surface: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of the bubble: whether the message failed, and the props of a `div`.
+ */
+interface BubbleProps extends ComponentProps<typeof Surface> {
+  /**
+   * Whether the message did not send.
+   */
+  readonly failed?: boolean | undefined;
+}
+/**
+ * Renders the bubble, with `data-failed` while `failed`.
+ *
+ * @param props - Whether the message failed, and the props of a `div`.
+ * @returns The `div` element.
+ */
+declare function Bubble({ failed, ...props }: BubbleProps): ReactElement;
+//#endregion
+//#region src/message/content.d.ts
+/**
+ * Renders the column's `div`.
+ */
+declare const Content: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of `Content`.
+ */
+type ContentProps = ComponentProps<typeof Content>;
+//#endregion
+//#region src/message/footer.d.ts
+/**
+ * Renders the footer's `div`.
+ */
+declare const Footer: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of `Footer`.
+ */
+type FooterProps = ComponentProps<typeof Footer>;
+//#endregion
+//#region src/message/header.d.ts
+/**
+ * Renders the header's `div`.
+ */
+declare const Header: import("@stealthscale/theme").StyledComponent<"div", {}>;
+/**
+ * Describes the props of `Header`.
+ */
+type HeaderProps = ComponentProps<typeof Header>;
+//#endregion
+//#region src/message/root.d.ts
+/**
+ * Renders the root `article` with the message's variants.
+ */
+declare const Root$1: import("@stealthscale/theme").StyledComponent<"article", {
+  readonly align?: "end" | "start";
+  readonly look?: import("@stealthscale/theme/authoring").Flat;
+  readonly palette?: "accent" | "error" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning";
+  readonly reveal?: "always" | "hover";
+  readonly size?: "lg" | "md" | "sm";
+}>;
+/**
+ * Describes the props of `Root`.
+ */
+type RootProps$1 = ComponentProps<typeof Root$1>;
+//#endregion
+//#region src/message/status.d.ts
+/**
+ * Renders the status `span`.
+ */
+declare const Marked: import("@stealthscale/theme").StyledComponent<"span", {}>;
+/**
+ * Lists how far a message can get.
+ */
+type MessageStatus = "delivered" | "failed" | "read" | "sending" | "sent";
+/**
+ * Describes the props of the status: how far the message has got, and the props of a `span`.
+ */
+interface StatusProps extends ComponentProps<typeof Marked> {
+  /**
+   * How far the message has got.
+   */
+  readonly status: MessageStatus;
+}
+/**
+ * Renders the status with its state written as `data-status`.
+ *
+ * @param props - How far the message has got, and the props of a `span`.
+ * @returns The `span` element.
+ */
+declare function Status({ status, ...props }: StatusProps): ReactElement;
+declare namespace index_d_exports$3 {
+  export { Actions, ActionsProps, Avatar, AvatarProps, Bubble, BubbleProps, Content, ContentProps, Footer, FooterProps, Header, HeaderProps, MessageStatus, Root$1 as Root, RootProps$1 as RootProps, Status, StatusProps };
+}
+//#endregion
+//#region src/reactions/choice.d.ts
+/**
+ * Describes the props of a choice: its name, its value, and the props of the actions `Button`.
+ */
+interface ChoiceProps extends ButtonProps {
+  /**
+   * Accessible name of the reaction, such as "Thumbs up".
+   */
+  readonly label: string;
+  /**
+   * Value the picker's `onSelect` receives.
+   */
+  readonly value: string;
+}
+/**
+ * Renders the choice's button.
+ *
+ * @param props - The name, the value, and the props of the actions `Button`, the glyph among its
+ *   children.
+ * @returns The `button` element.
+ */
+declare function Choice({ children, label, onClick, value, ...props }: ChoiceProps): ReactElement;
+//#endregion
+//#region src/reactions/item.d.ts
+/**
+ * Describes the props of a reaction: its count, its name, whether the reader reacted, and the
+ * props of the actions `Button`.
+ */
+interface ItemProps extends ButtonProps {
+  /**
+   * Number of people who reacted, rendered after the glyph when stated.
+   */
+  readonly count?: number | undefined;
+  /**
+   * Accessible name: the reaction, the count and whether the reader is among them.
+   */
+  readonly label: string;
+  /**
+   * Whether the reader is among the people who reacted.
+   */
+  readonly pressed?: boolean | undefined;
+}
+/**
+ * Renders the reaction's button.
+ *
+ * @param props - The count, the name, whether the reader reacted, and the props of the actions
+ *   `Button`, the glyph among its children.
+ * @returns The `button` element.
+ */
+declare function Item({ children, count, label, pressed, ...props }: ItemProps): ReactElement;
+//#endregion
+//#region src/reactions/picker.d.ts
+/**
+ * Describes the props of the picker: the trigger's glyph and name, the panel's name, the handler of
+ * a choice, and the popover root's props without its open state, which the picker keeps, and
+ * without the element's `onSelect` event, which the choice handler replaces.
+ */
+interface PickerProps extends Omit<Popover.RootProps, "children" | "defaultOpen" | "onOpenChange" | "onSelect" | "open"> {
+  /**
+   * The choices, each a `Reactions.Choice`.
+   */
+  readonly children?: ReactNode;
+  /**
+   * Accessible name of the panel, "Choose a reaction" unless stated.
+   */
+  readonly choicesLabel?: string | undefined;
+  /**
+   * Glyph of the trigger.
+   */
+  readonly icon: ReactNode;
+  /**
+   * Accessible name of the trigger, "Add a reaction" unless stated.
+   */
+  readonly label?: string | undefined;
+  /**
+   * Called with the value of the choice pressed.
+   */
+  readonly onSelect?: ((value: string) => void) | undefined;
+}
+/**
+ * Renders the trigger and the panel, and closes the panel on a choice.
+ *
+ * @param props - The trigger's glyph and name, the panel's name, the handler of a choice and the
+ *   popover root's props.
+ * @returns The popover's root.
+ */
+declare function Picker({ children, choicesLabel, icon, label, onSelect, ...props }: PickerProps): ReactElement;
+//#endregion
+//#region src/reactions/root.d.ts
+/**
+ * Renders the `fieldset` with the reactions' root class.
+ */
+declare const Grouped: import("@stealthscale/theme").StyledComponent<"fieldset", {}>;
+/**
+ * Describes the props of the row: its name and the props of a `fieldset`.
+ */
+interface RootProps extends ComponentProps<typeof Grouped> {
+  /**
+   * Accessible name of the row, "Reactions" unless stated.
+   */
+  readonly label?: string | undefined;
+}
+/**
+ * Renders the row, named by `label`.
+ *
+ * @param props - The row's name and the props of a `fieldset`.
+ * @returns The `fieldset` element.
+ */
+declare function Root({ label, ...props }: RootProps): ReactElement;
+declare namespace index_d_exports$4 {
+  export { Choice, ChoiceProps, Item, ItemProps, Picker, PickerProps, Root, RootProps };
+}
+//#endregion
+//#region src/turns/group-turns.d.ts
+/**
+ * Groups a transcript into days, and each day into turns: the runs of messages one author sent
+ * close together.
+ *
+ * @remarks
+ *   A turn renders one avatar and one header over its messages, so two messages an hour apart
+ *   start two turns: their header would otherwise date the second message wrongly. A new day always
+ *   starts a new turn, because a divider between the messages of one turn would separate them from
+ *   their avatar. A day starts at midnight in `timeZone`, or in the runtime's time zone, the
+ *   reader's own calendar in a browser. A caller that formats its times in a zone passes that zone,
+ *   so a day's label and its messages' times name one calendar.
+ */
+/**
+ * Describes the fields of a message that the grouping reads.
+ */
+interface TurnMessage {
+  /**
+   * Identifier of the person or the assistant that sent the message.
+   */
+  readonly author: string;
+  /**
+   * Identifier of the message, unique in the transcript.
+   */
+  readonly id: string;
+  /**
+   * Instant the message was sent: a `Date`, the milliseconds since the epoch, or a string `Date`
+   * parses. A message without one, or with one `Date` cannot read, joins the turn and the day
+   * before it.
+   */
+  readonly sentAt?: Date | number | string | undefined;
+}
+/**
+ * Describes one turn: the messages one author sent in a row.
+ *
+ * @typeParam Message - The caller's message type.
+ */
+interface Turn<Message extends TurnMessage> {
+  /**
+   * Identifier of the author every message of the turn shares.
+   */
+  readonly author: string;
+  /**
+   * The message that opens the turn, whose `id` keys the turn and whose `sentAt` its header shows.
+   */
+  readonly first: Message;
+  /**
+   * The latest message of the turn, whose status and actions its footer shows.
+   */
+  readonly last: Message;
+  /**
+   * Every message of the turn, oldest first, never empty.
+   */
+  readonly messages: readonly Message[];
+  /**
+   * Whether `author` is the reader, the `self` option.
+   */
+  readonly own: boolean;
+}
+/**
+ * Describes one day of the transcript: the turns under one divider.
+ *
+ * @typeParam Message - The caller's message type.
+ */
+interface TurnDay<Message extends TurnMessage> {
+  /**
+   * Midnight at the start of the day, the day's first instant where a daylight saving change skips
+   * midnight, or undefined for messages without a readable `sentAt`.
+   */
+  readonly day: Date | undefined;
+  /**
+   * Identifier of the first message of the day, unique across the days.
+   */
+  readonly key: string;
+  /**
+   * The turns of the day, oldest first.
+   */
+  readonly turns: ReadonlyArray<Turn<Message>>;
+}
+/**
+ * Describes the options of the grouping.
+ */
+interface GroupTurnsOptions {
+  /**
+   * Identifier of the reader, whose turns are `own`.
+   */
+  readonly self?: string | undefined;
+  /**
+   * IANA time zone a day starts at midnight in, such as `UTC` or `Europe/Amsterdam`. The runtime's
+   * zone unless stated.
+   */
+  readonly timeZone?: string | undefined;
+  /**
+   * Longest gap in milliseconds between two messages of one turn, 5 minutes unless stated.
+   */
+  readonly window?: number | undefined;
+}
+/**
+ * Groups messages into days and turns.
+ *
+ * @typeParam Message - The caller's message type, which each turn returns as it was given.
+ * @param messages - The transcript, oldest first.
+ * @param options - The reader's identifier, the zone a day starts in and the longest gap inside
+ *   one turn.
+ * @returns The days in order, each with its turns in order.
+ */
+export declare function groupTurns<Message extends TurnMessage>(messages: readonly Message[], options?: GroupTurnsOptions): ReadonlyArray<TurnDay<Message>>;
+//#endregion
+export { index_d_exports as Attachment, index_d_exports$1 as Composer, index_d_exports$2 as Conversation, type GroupTurnsOptions, index_d_exports$3 as Message, index_d_exports$4 as Reactions, type Turn, type TurnDay, type TurnMessage };