@particle-academy/react-fancy 5.43.0 → 5.44.0

package/CHANGELOG.md

@@ -11,6 +11,37 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [5.44.0] - 2026-10-19
+
+### Added
+
+- **`Input` holds a long paste as a pill**, as `Composer` and `PromptInput` do:
+  `<Input name="q" pasteThreshold={500} />`. The pill sits in the field (one
+  line, so no line of its own); clicking it puts the full text back. A hidden
+  `<input name={name}>` posts the value with every pill expanded, so a plain
+  `<form>` submit sends the whole paste. Enter still submits the form.
+  **Omit `pasteThreshold` and `pasteImages` and nothing changes**: it is the same
+  `<input>` as before. With either set, `ref` points at the hidden input,
+  `onValueChange` receives the value with a marker per pill, and `onChange` is
+  not called.
+- **Pasted files reach the form.** `pasteImages` on `Input` holds a pasted image
+  as a pill AND puts the file in a hidden `<input type="file" multiple>` in the
+  same form (`{name}_files[]` by default, or `pasteFilesName`), kept in step with
+  the pills: delete one and its file leaves the input. `Composer` and
+  `PromptInput` take `pasteFilesName` for the same hidden input.
+- **`PastePills`** (`@particle-academy/react-fancy/paste-pills`): the paste-pill
+  core in one place: `usePastePills`, `useInlinePaste`, `InlinePasteEditor`,
+  `PastedFilesInput` and the marker helpers. `Composer`, `PromptInput` and
+  `Input` all import it, so `npx fancy-cli add` copies it once, as a dependency,
+  instead of a copy per component.
+
+### Changed
+
+- The paste-pill files moved from `components/Composer/` and
+  `hooks/use-paste-pills.ts` into `components/PastePills/`. **What to do:**
+  nothing. Every public export is unchanged, and `hooks/use-paste-pills` still
+  re-exports the hook.
+
 ## [5.43.0] - 2026-10-17
 
 ### Fixed

package/dist/{Composer.types-CuSPnaOt.d.cts → PastePills.types-CDyotkUb.d.cts}

@@ -1,5 +1,3 @@
-import { ReactNode } from 'react';
-
 /**
  * A paste held beside a composer rather than inserted into it.
  *
@@ -137,8 +135,39 @@ interface HeldImage {
     file: File;
     label: string;
 }
+/**
+ * U+FFFC OBJECT REPLACEMENT CHARACTER — Unicode's own "an embedded object sits
+ * here". A marker is the id wrapped in a pair of them.
+ *
+ * Why the message carries a marker at all: with inline placement the message
+ * ITSELF is the record of what is attached and where, so there is one answer to
+ * "what am I sending?" rather than a text plus a parallel list that can disagree
+ * the moment someone backspaces a pill. This is the MOIC estate's design for their
+ * own composer, and the reason they withdrew from the beside-the-input layout.
+ *
+ * Only a marker whose id the composer actually holds is a pill; anything else is
+ * left as text, so a stray U+FFFC in pasted content cannot invent an attachment.
+ */
+declare const PILL_MARK = "\uFFFC";
 /** The marker for a held paste or image, for a host or agent writing `value` itself. */
 declare function pasteMarker(id: string): string;
+type ValueSegment = {
+    type: "text";
+    text: string;
+} | {
+    type: "pill";
+    id: string;
+};
+/** Split a value into text and pills. Markers for ids not in `known` stay text. */
+declare function segmentValue(value: string, known: ReadonlySet<string>): ValueSegment[];
+/** The id of every marker the value contains, in order, held or not. */
+declare function markedIds(value: string): string[];
+/**
+ * What actually gets sent: every text pill replaced by its full text, every image
+ * pill by `[Pasted image N]` so the reader of the message can see where the image
+ * sat. The images themselves go to `onSubmit`'s second argument.
+ */
+declare function expandMarkers(value: string, pastes: readonly HeldPaste[], images: readonly HeldImage[]): string;
 
 /** What a hover preview is being asked to show. */
 type ComposerPastePreview = {
@@ -166,84 +195,8 @@ interface ComposerPasteClassNames {
     /** The editable surface itself. */
     input?: string;
 }
-interface ComposerSubmitExtras {
-    /**
-     * Images still pasted into the message when it was sent, in the order they
-     * appear in it. Each one's place in the sent text is marked `[Pasted image N]`,
-     * matching its `label`.
-     */
-    images: HeldImage[];
-}
-interface ComposerProps {
-    value?: string;
-    defaultValue?: string;
-    onChange?: (value: string) => void;
-    /**
-     * The second argument only ever carries anything with `pasteImages` on. A
-     * one-argument handler stays valid.
-     */
-    onSubmit?: (value: string, extras: ComposerSubmitExtras) => void;
-    placeholder?: string;
-    actions?: ReactNode;
-    disabled?: boolean;
-    className?: string;
-    /**
-     * Hold a paste of at least this many characters as a pill, instead of inserting
-     * it. Try 500 — about a long paragraph.
-     *
-     * **Omit it and paste behaves exactly as it always has.** Opt-in on purpose:
-     * paste is a fundamental interaction and this library is past 1.0, so a minor
-     * release must not quietly change what pasting does for every consumer. There is
-     * no default threshold for the same reason.
-     *
-     * Below the threshold nothing changes at all — no prevented event, no pill, no
-     * ceremony for an address or a name.
-     */
-    pasteThreshold?: number;
-    /**
-     * Where a pill goes.
-     *
-     * - `"above"` (default, and the only behaviour before 5.38.0) — in a row above
-     *   the input; a send appends held text after what was typed.
-     * - `"inline"` — **in the message, where the paste happened.** A text pill gets
-     *   a line to itself; clicking it puts the full text back exactly there; an
-     *   image pill sits in the sentence. Backspace deletes a pill like a character.
-     *
-     * With `"inline"`, `value` carries a marker for each pill (see `pasteMarker`),
-     * because the message is then the one record of what is attached and where.
-     * `onSubmit` always receives the expanded text, never a marker.
-     */
-    pastePlacement?: "above" | "inline";
-    /**
-     * Hold a pasted IMAGE as a pill (`"inline"` placement only). Off by default —
-     * turning it on is a promise to read `onSubmit`'s second argument, because a pill
-     * reads as "attached" and an image a host never sends is an attachment the
-     * person believes went and did not.
-     *
-     * A clipboard carrying text as well as an image (copying from a document often
-     * includes a picture of the selection) pastes the TEXT: the image there is a
-     * rendering, not the thing that was copied.
-     */
-    pasteImages?: boolean;
-    /** Characters of a held text paste shown at EACH end of its hover preview. Default 20. */
-    previewChars?: number;
-    /** Replace the hover popover's content. Its box is styled by `classNames.preview`. */
-    renderPastePreview?: (preview: ComposerPastePreview) => ReactNode;
-    /** Restyle the pills and their popover. */
-    classNames?: ComposerPasteClassNames;
-    /**
-     * The held pastes, if you want to own them.
-     *
-     * Controllable rather than internal because the component contract forbids
-     * internal-only state for anything an agent might need to read or write — an
-     * agent driving this surface has to be able to see that a paste is attached, and
-     * to attach one itself.
-     */
-    heldPastes?: HeldPaste[];
-    onHeldPastesChange?: (pastes: HeldPaste[]) => void;
-    /** The held images, if you want to own them. Same reasoning as `heldPastes`. */
-    heldImages?: HeldImage[];
-    onHeldImagesChange?: (images: HeldImage[]) => void;
-}
+/** The same shapes under the names they have outside `Composer`. */
+type PastePreview = ComposerPastePreview;
+type PasteClassNames = ComposerPasteClassNames;
 
-export { type ComposerPasteClassNames as C, type HeldImage as H, type PasteEventLike as P, type UsePastePillsOptions as U, type ComposerPastePreview as a, type ComposerProps as b, type ComposerSubmitExtras as c, type HeldPaste as d, type UsePastePillsResult as e, pasteMarker as p, usePastePills as u };
+export { type ComposerPastePreview as C, type HeldImage as H, PILL_MARK as P, type UsePastePillsOptions as U, type ValueSegment as V, type ComposerPasteClassNames as a, type HeldPaste as b, type PasteClassNames as c, type PasteEventLike as d, type PastePreview as e, type UsePastePillsResult as f, expandMarkers as g, markedIds as m, pasteMarker as p, segmentValue as s, usePastePills as u };

package/dist/{Composer.types-CuSPnaOt.d.ts → PastePills.types-CDyotkUb.d.ts}

@@ -1,5 +1,3 @@
-import { ReactNode } from 'react';
-
 /**
  * A paste held beside a composer rather than inserted into it.
  *
@@ -137,8 +135,39 @@ interface HeldImage {
     file: File;
     label: string;
 }
+/**
+ * U+FFFC OBJECT REPLACEMENT CHARACTER — Unicode's own "an embedded object sits
+ * here". A marker is the id wrapped in a pair of them.
+ *
+ * Why the message carries a marker at all: with inline placement the message
+ * ITSELF is the record of what is attached and where, so there is one answer to
+ * "what am I sending?" rather than a text plus a parallel list that can disagree
+ * the moment someone backspaces a pill. This is the MOIC estate's design for their
+ * own composer, and the reason they withdrew from the beside-the-input layout.
+ *
+ * Only a marker whose id the composer actually holds is a pill; anything else is
+ * left as text, so a stray U+FFFC in pasted content cannot invent an attachment.
+ */
+declare const PILL_MARK = "\uFFFC";
 /** The marker for a held paste or image, for a host or agent writing `value` itself. */
 declare function pasteMarker(id: string): string;
+type ValueSegment = {
+    type: "text";
+    text: string;
+} | {
+    type: "pill";
+    id: string;
+};
+/** Split a value into text and pills. Markers for ids not in `known` stay text. */
+declare function segmentValue(value: string, known: ReadonlySet<string>): ValueSegment[];
+/** The id of every marker the value contains, in order, held or not. */
+declare function markedIds(value: string): string[];
+/**
+ * What actually gets sent: every text pill replaced by its full text, every image
+ * pill by `[Pasted image N]` so the reader of the message can see where the image
+ * sat. The images themselves go to `onSubmit`'s second argument.
+ */
+declare function expandMarkers(value: string, pastes: readonly HeldPaste[], images: readonly HeldImage[]): string;
 
 /** What a hover preview is being asked to show. */
 type ComposerPastePreview = {
@@ -166,84 +195,8 @@ interface ComposerPasteClassNames {
     /** The editable surface itself. */
     input?: string;
 }
-interface ComposerSubmitExtras {
-    /**
-     * Images still pasted into the message when it was sent, in the order they
-     * appear in it. Each one's place in the sent text is marked `[Pasted image N]`,
-     * matching its `label`.
-     */
-    images: HeldImage[];
-}
-interface ComposerProps {
-    value?: string;
-    defaultValue?: string;
-    onChange?: (value: string) => void;
-    /**
-     * The second argument only ever carries anything with `pasteImages` on. A
-     * one-argument handler stays valid.
-     */
-    onSubmit?: (value: string, extras: ComposerSubmitExtras) => void;
-    placeholder?: string;
-    actions?: ReactNode;
-    disabled?: boolean;
-    className?: string;
-    /**
-     * Hold a paste of at least this many characters as a pill, instead of inserting
-     * it. Try 500 — about a long paragraph.
-     *
-     * **Omit it and paste behaves exactly as it always has.** Opt-in on purpose:
-     * paste is a fundamental interaction and this library is past 1.0, so a minor
-     * release must not quietly change what pasting does for every consumer. There is
-     * no default threshold for the same reason.
-     *
-     * Below the threshold nothing changes at all — no prevented event, no pill, no
-     * ceremony for an address or a name.
-     */
-    pasteThreshold?: number;
-    /**
-     * Where a pill goes.
-     *
-     * - `"above"` (default, and the only behaviour before 5.38.0) — in a row above
-     *   the input; a send appends held text after what was typed.
-     * - `"inline"` — **in the message, where the paste happened.** A text pill gets
-     *   a line to itself; clicking it puts the full text back exactly there; an
-     *   image pill sits in the sentence. Backspace deletes a pill like a character.
-     *
-     * With `"inline"`, `value` carries a marker for each pill (see `pasteMarker`),
-     * because the message is then the one record of what is attached and where.
-     * `onSubmit` always receives the expanded text, never a marker.
-     */
-    pastePlacement?: "above" | "inline";
-    /**
-     * Hold a pasted IMAGE as a pill (`"inline"` placement only). Off by default —
-     * turning it on is a promise to read `onSubmit`'s second argument, because a pill
-     * reads as "attached" and an image a host never sends is an attachment the
-     * person believes went and did not.
-     *
-     * A clipboard carrying text as well as an image (copying from a document often
-     * includes a picture of the selection) pastes the TEXT: the image there is a
-     * rendering, not the thing that was copied.
-     */
-    pasteImages?: boolean;
-    /** Characters of a held text paste shown at EACH end of its hover preview. Default 20. */
-    previewChars?: number;
-    /** Replace the hover popover's content. Its box is styled by `classNames.preview`. */
-    renderPastePreview?: (preview: ComposerPastePreview) => ReactNode;
-    /** Restyle the pills and their popover. */
-    classNames?: ComposerPasteClassNames;
-    /**
-     * The held pastes, if you want to own them.
-     *
-     * Controllable rather than internal because the component contract forbids
-     * internal-only state for anything an agent might need to read or write — an
-     * agent driving this surface has to be able to see that a paste is attached, and
-     * to attach one itself.
-     */
-    heldPastes?: HeldPaste[];
-    onHeldPastesChange?: (pastes: HeldPaste[]) => void;
-    /** The held images, if you want to own them. Same reasoning as `heldPastes`. */
-    heldImages?: HeldImage[];
-    onHeldImagesChange?: (images: HeldImage[]) => void;
-}
+/** The same shapes under the names they have outside `Composer`. */
+type PastePreview = ComposerPastePreview;
+type PasteClassNames = ComposerPasteClassNames;
 
-export { type ComposerPasteClassNames as C, type HeldImage as H, type PasteEventLike as P, type UsePastePillsOptions as U, type ComposerPastePreview as a, type ComposerProps as b, type ComposerSubmitExtras as c, type HeldPaste as d, type UsePastePillsResult as e, pasteMarker as p, usePastePills as u };
+export { type ComposerPastePreview as C, type HeldImage as H, PILL_MARK as P, type UsePastePillsOptions as U, type ValueSegment as V, type ComposerPasteClassNames as a, type HeldPaste as b, type PasteClassNames as c, type PasteEventLike as d, type PastePreview as e, type UsePastePillsResult as f, expandMarkers as g, markedIds as m, pasteMarker as p, segmentValue as s, usePastePills as u };

package/dist/PastedFilesInput-CrgNoEBd.d.ts

@@ -0,0 +1,141 @@
+import * as react from 'react';
+import { ReactNode, RefObject } from 'react';
+import { C as ComposerPastePreview, a as ComposerPasteClassNames, b as HeldPaste, H as HeldImage, f as UsePastePillsResult } from './PastePills.types-CDyotkUb.js';
+
+/** The attribute on the placeholder span a pill is portalled into. */
+declare const HOST_ATTR = "data-react-fancy-composer-paste-host";
+/** What a paste becomes, as decided by `Composer`. `block` pills get their own line. */
+interface PillToInsert {
+    id: string;
+    block: boolean;
+}
+interface InlinePasteEditorHandle {
+    focus(): void;
+    /** Swap a pill for plain text, where it sits. */
+    replacePill(id: string, text: string): void;
+    /**
+     * Replace the whole value and put the caret at `caret` (an offset into the
+     * value). For a host that edits text itself — `PromptInput`'s `/` and `@`
+     * pickers — where rebuilding from `value` alone would lose the caret.
+     */
+    setValue(value: string, caret: number): void;
+}
+interface InlinePasteEditorProps {
+    value: string;
+    /** Ids the composer holds. A marker for anything else stays text. */
+    known: ReadonlySet<string>;
+    /** `caret` is the caret's offset into `value`, or `value.length` if it is elsewhere. */
+    onChange(value: string, caret: number): void;
+    onSubmit(): void;
+    /**
+     * Which key sends. `"enter"` (default): Enter sends, Shift+Enter is a newline.
+     * `"mod-enter"`: Ctrl/⌘+Enter sends and a plain Enter is a newline.
+     */
+    submitKey?: "enter" | "mod-enter";
+    /** Runs BEFORE the editor's own key handling; `preventDefault()` to claim the key. */
+    onKeyDown?(e: React.KeyboardEvent<HTMLDivElement>): void;
+    placeholderClassName?: string;
+    /** Height in px past which the input scrolls. Defaults to the class's max height. */
+    maxHeight?: number;
+    /** Return the pills a paste becomes, or null to insert its text as typed. */
+    onPaste(data: DataTransfer | null): PillToInsert[] | null;
+    /** Every pill placeholder currently in the editor, for the composer to portal into. */
+    onHostsChange(hosts: ReadonlyMap<string, HTMLElement>): void;
+    placeholder: string;
+    disabled: boolean;
+    className?: string;
+    /**
+     * `false` makes it a single-line field, as `Input` uses it: Enter always
+     * submits, and a newline in pasted text becomes a space, as a browser does for
+     * an `<input>`. A held paste keeps its newlines; it is only the field that has
+     * one line. Default `true`.
+     */
+    multiline?: boolean;
+    /** The editable surface's id, so a host can find it. */
+    id?: string;
+    /** Names the textbox for assistive tech; a `<div>` cannot be the target of a `<label>`. */
+    ariaLabelledBy?: string;
+    ariaInvalid?: boolean;
+    style?: React.CSSProperties;
+}
+/**
+ * The plain-text-plus-pills surface behind `Composer`'s inline placement.
+ *
+ * The DOM is the source of truth WHILE TYPING and `value` is its serialisation;
+ * the DOM is rebuilt from `value` only when `value` changes from outside (a send,
+ * a host, an agent). Rebuilding on every keystroke would throw the caret away.
+ *
+ * Every insertion is done here by hand, never by the browser: a paste is always
+ * intercepted, so no foreign HTML ever lands in the editor, and Enter is handled
+ * so a browser never invents a `<div>` per line.
+ */
+declare const InlinePasteEditor: react.ForwardRefExoticComponent<InlinePasteEditorProps & react.RefAttributes<InlinePasteEditorHandle>>;
+
+interface UseInlinePasteOptions {
+    pasteThreshold?: number;
+    pasteImages?: boolean;
+    previewChars: number;
+    renderPastePreview?: (preview: ComposerPastePreview) => ReactNode;
+    classNames?: ComposerPasteClassNames;
+    disabled: boolean;
+    heldPastes?: HeldPaste[];
+    onHeldPastesChange?: (pastes: HeldPaste[]) => void;
+    heldImages?: HeldImage[];
+    onHeldImagesChange?: (images: HeldImage[]) => void;
+    editorRef: RefObject<InlinePasteEditorHandle | null>;
+    /**
+     * Give a text pill a line to itself. Default `true`; a single-line field
+     * (`Input`) has no lines to give, so its pills sit in the text.
+     */
+    blockText?: boolean;
+}
+/**
+ * Everything inline paste pills need besides the editor itself: the held pastes
+ * and images, deciding what a paste becomes, dropping a pill's hold when it is
+ * deleted from the message, rendering the pills into the editor, and expanding
+ * them on send.
+ *
+ * Shared by `Composer`, `PromptInput` and `Input` so they cannot disagree about
+ * what a pill means. The rule that must not drift is the one `expand` and `imagesIn`
+ * carry: a send with pills still closed carries everything they hold.
+ */
+declare function useInlinePaste({ pasteThreshold, pasteImages, previewChars, renderPastePreview, classNames, disabled, heldPastes: controlledHeldPastes, onHeldPastesChange, heldImages: controlledHeldImages, onHeldImagesChange, editorRef, blockText, }: UseInlinePasteOptions): {
+    pills: UsePastePillsResult;
+    heldPastes: HeldPaste[];
+    heldImages: HeldImage[];
+    known: Set<string>;
+    decidePaste: (data: DataTransfer | null) => PillToInsert[] | null;
+    prune: (next: string) => void;
+    onHostsChange: (next: ReadonlyMap<string, HTMLElement>) => void;
+    expand: (value: string) => string;
+    imagesIn: (value: string) => HeldImage[];
+    clear: () => void;
+    portals: (react.ReactPortal | null)[];
+};
+
+interface PastedFilesInputProps {
+    /** The form field name the files are submitted under. */
+    name: string;
+    /** The files to submit, in the order the message holds them. */
+    files: readonly File[];
+    /** Associate with a `<form id>` elsewhere in the document, as `<input form>` does. */
+    form?: string;
+}
+/**
+ * A hidden `<input type="file">` carrying the files pasted into a field, so a
+ * plain `<form>` submits them with everything else.
+ *
+ * A pasted file is not in any form field: the clipboard hands it to the paste
+ * handler and nowhere else. Held as a pill, it is attached as far as the person can
+ * see, and a native submit would then post the text without it. A file input is
+ * the one element a form posts files from, and its `files` can be set from a
+ * `DataTransfer`, so the pills keep it in step: delete a pill and its file leaves
+ * the input too.
+ *
+ * Hidden rather than visually hidden: `hidden` keeps it out of the tab order and
+ * the accessibility tree, where the pills already represent it, and does not stop
+ * a form submitting it.
+ */
+declare function PastedFilesInput({ name, files, form }: PastedFilesInputProps): react.JSX.Element;
+
+export { HOST_ATTR as H, InlinePasteEditor as I, PastedFilesInput as P, type UseInlinePasteOptions as U, type InlinePasteEditorHandle as a, type PastedFilesInputProps as b, type PillToInsert as c, useInlinePaste as u };

package/dist/PastedFilesInput-DQ1eZaHk.d.cts

@@ -0,0 +1,141 @@
+import * as react from 'react';
+import { ReactNode, RefObject } from 'react';
+import { C as ComposerPastePreview, a as ComposerPasteClassNames, b as HeldPaste, H as HeldImage, f as UsePastePillsResult } from './PastePills.types-CDyotkUb.cjs';
+
+/** The attribute on the placeholder span a pill is portalled into. */
+declare const HOST_ATTR = "data-react-fancy-composer-paste-host";
+/** What a paste becomes, as decided by `Composer`. `block` pills get their own line. */
+interface PillToInsert {
+    id: string;
+    block: boolean;
+}
+interface InlinePasteEditorHandle {
+    focus(): void;
+    /** Swap a pill for plain text, where it sits. */
+    replacePill(id: string, text: string): void;
+    /**
+     * Replace the whole value and put the caret at `caret` (an offset into the
+     * value). For a host that edits text itself — `PromptInput`'s `/` and `@`
+     * pickers — where rebuilding from `value` alone would lose the caret.
+     */
+    setValue(value: string, caret: number): void;
+}
+interface InlinePasteEditorProps {
+    value: string;
+    /** Ids the composer holds. A marker for anything else stays text. */
+    known: ReadonlySet<string>;
+    /** `caret` is the caret's offset into `value`, or `value.length` if it is elsewhere. */
+    onChange(value: string, caret: number): void;
+    onSubmit(): void;
+    /**
+     * Which key sends. `"enter"` (default): Enter sends, Shift+Enter is a newline.
+     * `"mod-enter"`: Ctrl/⌘+Enter sends and a plain Enter is a newline.
+     */
+    submitKey?: "enter" | "mod-enter";
+    /** Runs BEFORE the editor's own key handling; `preventDefault()` to claim the key. */
+    onKeyDown?(e: React.KeyboardEvent<HTMLDivElement>): void;
+    placeholderClassName?: string;
+    /** Height in px past which the input scrolls. Defaults to the class's max height. */
+    maxHeight?: number;
+    /** Return the pills a paste becomes, or null to insert its text as typed. */
+    onPaste(data: DataTransfer | null): PillToInsert[] | null;
+    /** Every pill placeholder currently in the editor, for the composer to portal into. */
+    onHostsChange(hosts: ReadonlyMap<string, HTMLElement>): void;
+    placeholder: string;
+    disabled: boolean;
+    className?: string;
+    /**
+     * `false` makes it a single-line field, as `Input` uses it: Enter always
+     * submits, and a newline in pasted text becomes a space, as a browser does for
+     * an `<input>`. A held paste keeps its newlines; it is only the field that has
+     * one line. Default `true`.
+     */
+    multiline?: boolean;
+    /** The editable surface's id, so a host can find it. */
+    id?: string;
+    /** Names the textbox for assistive tech; a `<div>` cannot be the target of a `<label>`. */
+    ariaLabelledBy?: string;
+    ariaInvalid?: boolean;
+    style?: React.CSSProperties;
+}
+/**
+ * The plain-text-plus-pills surface behind `Composer`'s inline placement.
+ *
+ * The DOM is the source of truth WHILE TYPING and `value` is its serialisation;
+ * the DOM is rebuilt from `value` only when `value` changes from outside (a send,
+ * a host, an agent). Rebuilding on every keystroke would throw the caret away.
+ *
+ * Every insertion is done here by hand, never by the browser: a paste is always
+ * intercepted, so no foreign HTML ever lands in the editor, and Enter is handled
+ * so a browser never invents a `<div>` per line.
+ */
+declare const InlinePasteEditor: react.ForwardRefExoticComponent<InlinePasteEditorProps & react.RefAttributes<InlinePasteEditorHandle>>;
+
+interface UseInlinePasteOptions {
+    pasteThreshold?: number;
+    pasteImages?: boolean;
+    previewChars: number;
+    renderPastePreview?: (preview: ComposerPastePreview) => ReactNode;
+    classNames?: ComposerPasteClassNames;
+    disabled: boolean;
+    heldPastes?: HeldPaste[];
+    onHeldPastesChange?: (pastes: HeldPaste[]) => void;
+    heldImages?: HeldImage[];
+    onHeldImagesChange?: (images: HeldImage[]) => void;
+    editorRef: RefObject<InlinePasteEditorHandle | null>;
+    /**
+     * Give a text pill a line to itself. Default `true`; a single-line field
+     * (`Input`) has no lines to give, so its pills sit in the text.
+     */
+    blockText?: boolean;
+}
+/**
+ * Everything inline paste pills need besides the editor itself: the held pastes
+ * and images, deciding what a paste becomes, dropping a pill's hold when it is
+ * deleted from the message, rendering the pills into the editor, and expanding
+ * them on send.
+ *
+ * Shared by `Composer`, `PromptInput` and `Input` so they cannot disagree about
+ * what a pill means. The rule that must not drift is the one `expand` and `imagesIn`
+ * carry: a send with pills still closed carries everything they hold.
+ */
+declare function useInlinePaste({ pasteThreshold, pasteImages, previewChars, renderPastePreview, classNames, disabled, heldPastes: controlledHeldPastes, onHeldPastesChange, heldImages: controlledHeldImages, onHeldImagesChange, editorRef, blockText, }: UseInlinePasteOptions): {
+    pills: UsePastePillsResult;
+    heldPastes: HeldPaste[];
+    heldImages: HeldImage[];
+    known: Set<string>;
+    decidePaste: (data: DataTransfer | null) => PillToInsert[] | null;
+    prune: (next: string) => void;
+    onHostsChange: (next: ReadonlyMap<string, HTMLElement>) => void;
+    expand: (value: string) => string;
+    imagesIn: (value: string) => HeldImage[];
+    clear: () => void;
+    portals: (react.ReactPortal | null)[];
+};
+
+interface PastedFilesInputProps {
+    /** The form field name the files are submitted under. */
+    name: string;
+    /** The files to submit, in the order the message holds them. */
+    files: readonly File[];
+    /** Associate with a `<form id>` elsewhere in the document, as `<input form>` does. */
+    form?: string;
+}
+/**
+ * A hidden `<input type="file">` carrying the files pasted into a field, so a
+ * plain `<form>` submits them with everything else.
+ *
+ * A pasted file is not in any form field: the clipboard hands it to the paste
+ * handler and nowhere else. Held as a pill, it is attached as far as the person can
+ * see, and a native submit would then post the text without it. A file input is
+ * the one element a form posts files from, and its `files` can be set from a
+ * `DataTransfer`, so the pills keep it in step: delete a pill and its file leaves
+ * the input too.
+ *
+ * Hidden rather than visually hidden: `hidden` keeps it out of the tab order and
+ * the accessibility tree, where the pills already represent it, and does not stop
+ * a form submitting it.
+ */
+declare function PastedFilesInput({ name, files, form }: PastedFilesInputProps): react.JSX.Element;
+
+export { HOST_ATTR as H, InlinePasteEditor as I, PastedFilesInput as P, type UseInlinePasteOptions as U, type InlinePasteEditorHandle as a, type PastedFilesInputProps as b, type PillToInsert as c, useInlinePaste as u };