@eocrm/design-system 0.0.0-stage → 0.6.17

package/src/components/RichTextEditor/commands.ts

@@ -0,0 +1,300 @@
+// commands.ts — pure active-state derivation + command runners for the toolbar.
+// Every runner composes the existing engine transforms; no new model logic.
+import type {
+  RichDoc,
+  Block,
+  Mark,
+  MarkType,
+  BlockType,
+  Point,
+  Range,
+} from '../RichText/engine/model';
+import { toggleMark, setBlockType, applyMark, removeMark } from '../RichText/engine/transforms';
+import {
+  orderedRange,
+  findBlockIndex,
+  blockLength,
+  isCollapsed,
+  marksBeforeCaret,
+} from '../RichText/engine/position';
+import { hasMark } from '../RichText/engine/marks';
+
+/** The `{ doc, selection }` pair returned by every command runner. */
+export type CommandResult = { doc: RichDoc; selection: Range };
+
+const MARK_TYPES: MarkType[] = ['bold', 'italic', 'underline', 'strike', 'code', 'link'];
+
+// Value-carrying color marks. Kept SEPARATE from MARK_TYPES (which drives the
+// toolbar pressed-state path, where color must not appear) but flushed alongside
+// them in applyExactMarks so a pending color survives the next keystroke.
+const COLOR_FLUSH: MarkType[] = ['textColor', 'bgColor'];
+
+function blocksInRange(doc: RichDoc, range: Range): { si: number; ei: number } {
+  const { start, end } = orderedRange(doc, range);
+  return { si: findBlockIndex(doc, start.blockId), ei: findBlockIndex(doc, end.blockId) };
+}
+
+/** Mark types of the character immediately before the caret (none at a block start). */
+function marksAtCaret(doc: RichDoc, caret: Point): MarkType[] {
+  return marksBeforeCaret(doc, caret).map((m) => m.type);
+}
+
+/**
+ * Derives the set of mark types active across the selection (for toolbar pressed
+ * state). Returns the intersection — only marks present on every character in
+ * the range are considered "active."
+ *
+ * When the range is collapsed the function returns the marks of the character
+ * immediately before the caret (what the next typed character would inherit).
+ * When `pending` marks are supplied they override the caret-based look-up —
+ * the user has toggled a mark at a collapsed caret before typing.
+ *
+ * @example
+ * const marks = activeMarks(doc, range, null); // ['bold'] when all chars are bold
+ * const marks = activeMarks(doc, range, [{ type: 'bold' }]); // pending override
+ */
+export function activeMarks(doc: RichDoc, range: Range, pending: Mark[] | null): MarkType[] {
+  if (isCollapsed(range)) {
+    return pending ? pending.map((m) => m.type) : marksAtCaret(doc, range.anchor);
+  }
+  const { start, end } = orderedRange(doc, range);
+  const { si, ei } = blocksInRange(doc, range);
+  if (si === -1 || ei === -1) return [];
+  const out: MarkType[] = [];
+  for (const type of MARK_TYPES) {
+    let any = false;
+    let all = true;
+    for (let i = si; i <= ei && all; i += 1) {
+      const block = doc.blocks[i];
+      const from = i === si ? start.offset : 0;
+      const to = i === ei ? end.offset : blockLength(block);
+      // Skip a zero-length slice — incl. a void `attachment` (no `inlines`), which
+      // would otherwise crash iterating undefined. Mirrors the transforms guard.
+      if (to <= from) continue;
+      let pos = 0;
+      // `?? []` so the iteration is safe even if a caller hands a void block a
+      // non-zero end offset (the `to <= from` skip already covers the editor path).
+      for (const run of block.inlines ?? []) {
+        const rs = pos;
+        const re = pos + run.text.length;
+        pos = re;
+        const f = Math.max(from, rs);
+        const t = Math.min(to, re);
+        if (t > f) {
+          any = true;
+          if (!hasMark(run.marks, type)) {
+            all = false;
+            break;
+          }
+        }
+      }
+    }
+    if (any && all) out.push(type);
+  }
+  return out;
+}
+
+/** The single color KEY active per color type across a selection. */
+export interface ActiveColors {
+  /** Palette key (e.g. `'red'`) shared by every char's `textColor`, else absent. */
+  textColor?: string;
+  /** Palette key shared by every char's `bgColor`, else absent. */
+  bgColor?: string;
+}
+
+const COLOR_TYPES = ['textColor', 'bgColor'] as const;
+
+/** The color KEY of `type` carried by `marks`, if any. */
+function colorOf(marks: Mark[], type: 'textColor' | 'bgColor'): string | undefined {
+  const m = marks.find((x) => x.type === type);
+  return m && 'color' in m ? m.color : undefined;
+}
+
+/**
+ * Derives the single color key active per color type across the selection (drives
+ * the active badge ring in the color menu). For each of `textColor` / `bgColor`,
+ * returns the key only when EVERY character in the range carries that type with
+ * the SAME key — a mixed or partial color is omitted (so the menu shows "none
+ * active").
+ *
+ * When the range is collapsed the function reads the marks of the character
+ * immediately before the caret. When `pending` marks are supplied they override
+ * the caret look-up — the user has staged a color at a collapsed caret before
+ * typing. Mirrors {@link activeMarks}, but tracks the color value rather than
+ * just mark presence.
+ *
+ * @example
+ * activeColors(doc, range, null); // { textColor: 'red' } when all chars are red
+ * activeColors(doc, range, [{ type: 'bgColor', color: 'blue' }]); // pending override
+ */
+export function activeColors(doc: RichDoc, range: Range, pending: Mark[] | null): ActiveColors {
+  if (isCollapsed(range)) {
+    const marks = pending ?? marksBeforeCaret(doc, range.anchor);
+    const out: ActiveColors = {};
+    for (const type of COLOR_TYPES) {
+      const c = colorOf(marks, type);
+      if (c !== undefined) out[type] = c;
+    }
+    return out;
+  }
+  const { start, end } = orderedRange(doc, range);
+  const { si, ei } = blocksInRange(doc, range);
+  if (si === -1 || ei === -1) return {};
+  const out: ActiveColors = {};
+  for (const type of COLOR_TYPES) {
+    let any = false;
+    let all = true;
+    let color: string | undefined;
+    for (let i = si; i <= ei && all; i += 1) {
+      const block = doc.blocks[i];
+      const from = i === si ? start.offset : 0;
+      const to = i === ei ? end.offset : blockLength(block);
+      // Skip a zero-length slice — incl. a void `attachment` (no `inlines`), which
+      // would otherwise crash iterating undefined. Mirrors the transforms guard.
+      if (to <= from) continue;
+      let pos = 0;
+      // `?? []` so the iteration is safe even if a caller hands a void block a
+      // non-zero end offset (the `to <= from` skip already covers the editor path).
+      for (const run of block.inlines ?? []) {
+        const rs = pos;
+        const re = pos + run.text.length;
+        pos = re;
+        const f = Math.max(from, rs);
+        const t = Math.min(to, re);
+        if (t > f) {
+          any = true;
+          const c = colorOf(run.marks, type);
+          if (c === undefined || (color !== undefined && c !== color)) {
+            all = false;
+            break;
+          }
+          color = c;
+        }
+      }
+    }
+    if (any && all && color !== undefined) out[type] = color;
+  }
+  return out;
+}
+
+/**
+ * Returns the block type (and heading level) shared by all blocks in the
+ * selection, or `null` when the selection spans blocks of different types.
+ *
+ * @example
+ * currentBlock(doc, range); // { type: 'heading', level: 2 }
+ * currentBlock(doc, mixedRange); // null
+ */
+export function currentBlock(
+  doc: RichDoc,
+  range: Range,
+): { type: BlockType; level?: 1 | 2 | 3 } | null {
+  const { si, ei } = blocksInRange(doc, range);
+  if (si === -1 || ei === -1) return null;
+  const first = doc.blocks[si];
+  for (let i = si; i <= ei; i += 1) {
+    if (doc.blocks[i].type !== first.type || doc.blocks[i].level !== first.level) return null;
+  }
+  return first.level !== undefined
+    ? { type: first.type, level: first.level }
+    : { type: first.type };
+}
+
+/**
+ * Toggle `mark` on/off over `range` using the engine's `toggleMark` transform.
+ *
+ * @example
+ * const { doc, selection } = runToggleMark(doc, range, { type: 'bold' });
+ */
+export function runToggleMark(doc: RichDoc, range: Range, mark: Mark): CommandResult {
+  return toggleMark(doc, range, mark);
+}
+
+/**
+ * Apply `patch` (type / level / depth) to every block spanned by `range`,
+ * preserving the original selection. Used by the block-type dropdown and
+ * `runToggleList` / `runIndent`.
+ *
+ * @example
+ * const { doc } = runSetBlock(doc, range, { type: 'heading', level: 2 });
+ */
+export function runSetBlock(
+  doc: RichDoc,
+  range: Range,
+  patch: Partial<Pick<Block, 'type' | 'level' | 'depth'>>,
+): CommandResult {
+  const { si, ei } = blocksInRange(doc, range);
+  if (si === -1 || ei === -1) return { doc, selection: range };
+  let d = doc;
+  for (let i = si; i <= ei; i += 1) {
+    d = setBlockType(d, d.blocks[i].id, patch).doc;
+  }
+  return { doc: d, selection: range };
+}
+
+/**
+ * Toggle a list type on/off for the selection. If every block in the range is
+ * already `listType`, converts them all to `paragraph`; otherwise converts them
+ * all to `listType` at depth 0.
+ *
+ * @example
+ * const { doc } = runToggleList(doc, range, 'bullet_item');
+ */
+export function runToggleList(
+  doc: RichDoc,
+  range: Range,
+  listType: 'bullet_item' | 'ordered_item',
+): CommandResult {
+  const { si, ei } = blocksInRange(doc, range);
+  if (si === -1 || ei === -1) return { doc, selection: range };
+  let allList = true;
+  for (let i = si; i <= ei; i += 1) {
+    if (doc.blocks[i].type !== listType) {
+      allList = false;
+      break;
+    }
+  }
+  return runSetBlock(doc, range, allList ? { type: 'paragraph' } : { type: listType, depth: 0 });
+}
+
+/**
+ * Indent (`dir: 'in'`) or outdent (`dir: 'out'`) every list item in the
+ * selection by one level. Depth is clamped to a minimum of 0. Non-list blocks
+ * are skipped silently.
+ *
+ * @example
+ * const { doc } = runIndent(doc, range, 'in');  // increases nesting
+ * const { doc } = runIndent(doc, range, 'out'); // decreases nesting (floor 0)
+ */
+export function runIndent(doc: RichDoc, range: Range, dir: 'in' | 'out'): CommandResult {
+  const { si, ei } = blocksInRange(doc, range);
+  if (si === -1 || ei === -1) return { doc, selection: range };
+  let d = doc;
+  for (let i = si; i <= ei; i += 1) {
+    const b = d.blocks[i];
+    if (b.type !== 'bullet_item' && b.type !== 'ordered_item') continue;
+    const depth = Math.max(0, (b.depth ?? 0) + (dir === 'in' ? 1 : -1));
+    d = setBlockType(d, b.id, { depth }).doc;
+  }
+  return { doc: d, selection: range };
+}
+
+/**
+ * Force the marks of every character in `range` to exactly `marks`, used when
+ * flushing pending marks on the next typed character. Each known mark type —
+ * including the value-carrying `textColor`/`bgColor` — is applied if present in
+ * `marks`, or removed if absent.
+ *
+ * @example
+ * const newDoc = applyExactMarks(doc, span, [{ type: 'bold' }]);
+ * // Pending color survives the next keystroke:
+ * const colored = applyExactMarks(doc, span, [{ type: 'textColor', color: 'red' }]);
+ */
+export function applyExactMarks(doc: RichDoc, range: Range, marks: Mark[]): RichDoc {
+  let d = doc;
+  for (const type of [...MARK_TYPES, ...COLOR_FLUSH]) {
+    const mark = marks.find((m) => m.type === type);
+    d = mark ? applyMark(d, range, mark).doc : removeMark(d, range, type).doc;
+  }
+  return d;
+}

package/src/components/RichTextEditor/history.ts

@@ -0,0 +1,93 @@
+// history.ts — pure undo/redo history for <RichTextEditor>. Snapshots of
+// { doc, selection }; consecutive same-kind edits (typing, deleting) coalesce
+// into one step within a short window. `now` is injected so this module stays
+// pure and deterministically testable.
+import type { RichDoc, Range } from '../RichText/engine/model';
+
+export interface Snapshot {
+  doc: RichDoc;
+  selection: Range | null;
+}
+
+/**
+ * The kind of edit that produced a snapshot — drives coalescing. Same-kind
+ * non-`other` edits within {@link COALESCE_MS} merge into one undo step: `type`
+ * and `delete` for keystroke bursts, `resize` for a continuous image-width drag
+ * (slider or handle) so the whole drag reverts in a single undo.
+ */
+export type EditKind = 'type' | 'delete' | 'resize' | 'other';
+
+export interface History {
+  past: Snapshot[];
+  present: Snapshot;
+  future: Snapshot[];
+  /** Kind of the last recorded step (for coalescing); null after reset/undo/redo. */
+  lastKind: EditKind | null;
+  /** Timestamp of the last record (for the pause-based coalescing break). */
+  lastAt: number;
+}
+
+/** Consecutive same-kind edits within this many ms merge into one undo step. */
+const COALESCE_MS = 600;
+/** Max retained past entries (immutable snapshots structurally share blocks). */
+const CAP = 200;
+
+/** A fresh history whose only state is `present` (mount + external value replace). */
+export function reset(present: Snapshot): History {
+  return { past: [], present, future: [], lastKind: null, lastAt: 0 };
+}
+
+/**
+ * Record a newly committed state. Coalesces with the previous step when it's the
+ * same non-`other` kind within `COALESCE_MS`; otherwise pushes the prior present
+ * onto `past` (capped) and clears `future`. A no-op (same doc) returns `h`.
+ */
+export function record(h: History, next: Snapshot, kind: EditKind, now: number): History {
+  if (next.doc === h.present.doc) return h;
+  const coalesce = kind !== 'other' && kind === h.lastKind && now - h.lastAt < COALESCE_MS;
+  if (coalesce) {
+    // Extend the current step: keep `past`/`future` (the burst's single boundary
+    // already sits on top of `past`). The new value shares those arrays with `h`
+    // — safe because arrays are never mutated and no caller compares them by ref.
+    return { ...h, present: next, lastAt: now };
+  }
+  return {
+    past: [...h.past, h.present].slice(-CAP),
+    present: next,
+    future: [],
+    lastKind: kind,
+    lastAt: now,
+  };
+}
+
+/** Move one step back. No-op when there's nothing to undo. */
+export function undo(h: History): History {
+  if (h.past.length === 0) return h;
+  return {
+    past: h.past.slice(0, -1),
+    present: h.past[h.past.length - 1],
+    future: [h.present, ...h.future],
+    lastKind: null,
+    lastAt: 0,
+  };
+}
+
+/** Move one step forward. No-op when there's nothing to redo. */
+export function redo(h: History): History {
+  if (h.future.length === 0) return h;
+  return {
+    past: [...h.past, h.present],
+    present: h.future[0],
+    future: h.future.slice(1),
+    lastKind: null,
+    lastAt: 0,
+  };
+}
+
+export function canUndo(h: History): boolean {
+  return h.past.length > 0;
+}
+
+export function canRedo(h: History): boolean {
+  return h.future.length > 0;
+}

package/src/components/RichTextEditor/icons.tsx

@@ -0,0 +1,152 @@
+// icons.tsx — minimal inline SVG icons for the toolbar (the library ships no
+// icon dependency). Sized 1em / currentColor so they inherit the Button.
+import type { SVGProps } from 'react';
+
+const base: SVGProps<SVGSVGElement> = {
+  width: '1em',
+  height: '1em',
+  viewBox: '0 0 24 24',
+  fill: 'none',
+  stroke: 'currentColor',
+  strokeWidth: 2,
+  strokeLinecap: 'round',
+  strokeLinejoin: 'round',
+  'aria-hidden': true,
+  focusable: false,
+};
+
+export function BoldIcon() {
+  return (
+    <svg {...base}>
+      <path d="M6 4h8a4 4 0 0 1 0 8H6zM6 12h9a4 4 0 0 1 0 8H6z" />
+    </svg>
+  );
+}
+export function ItalicIcon() {
+  return (
+    <svg {...base}>
+      <line x1="19" y1="4" x2="10" y2="4" />
+      <line x1="14" y1="20" x2="5" y2="20" />
+      <line x1="15" y1="4" x2="9" y2="20" />
+    </svg>
+  );
+}
+export function UnderlineIcon() {
+  return (
+    <svg {...base}>
+      <path d="M6 3v7a6 6 0 0 0 12 0V3" />
+      <line x1="4" y1="21" x2="20" y2="21" />
+    </svg>
+  );
+}
+export function StrikeIcon() {
+  return (
+    <svg {...base}>
+      <line x1="4" y1="12" x2="20" y2="12" />
+      <path d="M7.5 7a4 4 0 0 1 6.5-1.5M16.5 17a4 4 0 0 1-6.5 1.5" />
+    </svg>
+  );
+}
+export function BulletListIcon() {
+  return (
+    <svg {...base}>
+      <line x1="9" y1="6" x2="20" y2="6" />
+      <line x1="9" y1="12" x2="20" y2="12" />
+      <line x1="9" y1="18" x2="20" y2="18" />
+      <circle cx="4.5" cy="6" r="1" fill="currentColor" stroke="none" />
+      <circle cx="4.5" cy="12" r="1" fill="currentColor" stroke="none" />
+      <circle cx="4.5" cy="18" r="1" fill="currentColor" stroke="none" />
+    </svg>
+  );
+}
+export function OrderedListIcon() {
+  return (
+    <svg {...base}>
+      <line x1="10" y1="6" x2="20" y2="6" />
+      <line x1="10" y1="12" x2="20" y2="12" />
+      <line x1="10" y1="18" x2="20" y2="18" />
+      <path d="M4 6h1v3M4 9h2" strokeWidth="1.5" />
+      <path d="M4 15h2v1l-2 2h2" strokeWidth="1.5" />
+    </svg>
+  );
+}
+export function LinkIcon() {
+  return (
+    <svg {...base}>
+      <path d="M10 13a5 5 0 0 0 7.07 0l2.83-2.83a5 5 0 0 0-7.07-7.07l-1.41 1.41" />
+      <path d="M14 11a5 5 0 0 0-7.07 0L4.1 13.83a5 5 0 0 0 7.07 7.07l1.41-1.41" />
+    </svg>
+  );
+}
+export function UndoIcon() {
+  return (
+    <svg {...base}>
+      <path d="M9 14 4 9l5-5" />
+      <path d="M4 9h11a5 5 0 0 1 0 10h-2" />
+    </svg>
+  );
+}
+export function RedoIcon() {
+  return (
+    <svg {...base}>
+      <path d="m15 14 5-5-5-5" />
+      <path d="M20 9H9a5 5 0 0 0 0 10h2" />
+    </svg>
+  );
+}
+export function PlusIcon() {
+  return (
+    <svg {...base}>
+      <line x1="12" y1="5" x2="12" y2="19" />
+      <line x1="5" y1="12" x2="19" y2="12" />
+    </svg>
+  );
+}
+export function GripIcon() {
+  return (
+    <svg {...base}>
+      <circle cx="9" cy="6" r="1" fill="currentColor" stroke="none" />
+      <circle cx="9" cy="12" r="1" fill="currentColor" stroke="none" />
+      <circle cx="9" cy="18" r="1" fill="currentColor" stroke="none" />
+      <circle cx="15" cy="6" r="1" fill="currentColor" stroke="none" />
+      <circle cx="15" cy="12" r="1" fill="currentColor" stroke="none" />
+      <circle cx="15" cy="18" r="1" fill="currentColor" stroke="none" />
+    </svg>
+  );
+}
+export function SmileIcon() {
+  return (
+    <svg {...base}>
+      <circle cx="12" cy="12" r="10" />
+      <path d="M8 14s1.5 2 4 2 4-2 4-2" />
+      <line x1="9" y1="9" x2="9.01" y2="9" />
+      <line x1="15" y1="9" x2="15.01" y2="9" />
+    </svg>
+  );
+}
+// An "A" glyph above a solid color bar — the conventional text-color affordance.
+export function TextColorIcon() {
+  return (
+    <svg {...base}>
+      <path d="M5 17 12 5l7 12" />
+      <line x1="8" y1="13" x2="16" y2="13" />
+      <rect x="4" y="20" width="16" height="2.5" rx="1" fill="currentColor" stroke="none" />
+    </svg>
+  );
+}
+// A marker/highlighter nib stroking a baseline — the conventional highlight
+// affordance (pairs with the solid color bar at the bottom).
+export function HighlightIcon() {
+  return (
+    <svg {...base}>
+      <path d="M14 4 9 9l-3 6 3 3 6-3 5-5z" />
+      <path d="m9 9 6 6" />
+      <rect x="4" y="20" width="16" height="2.5" rx="1" fill="currentColor" stroke="none" />
+    </svg>
+  );
+}
+
+// Lives in RichText because RichTextAttachment — which renders in the read-only
+// viewer too — needs it, and RichText must not import from RichTextEditor
+// (#509). Re-exported here so the toolbar's import site is unchanged.
+export { AttachFileIcon } from '../RichText/attachmentIcon';

package/src/components/RichTextEditor/imageSize.ts

@@ -0,0 +1,70 @@
+// imageSize.ts — pure display-size math + a thin browser image-measurement adapter
+// for RichTextEditor uploads. A newly-uploaded image is laid out at its PERCEIVED
+// size (natural device pixels ÷ devicePixelRatio), capped to the editor's content
+// width, instead of its raw natural-pixel size (which renders a retina screenshot
+// at 2× the size you saw). See the upload flow in useUpload.ts.
+
+/** Natural (intrinsic) pixel dimensions of an image. */
+export interface NaturalSize {
+  width: number;
+  height: number;
+}
+
+/**
+ * The on-screen display size for an image given its NATURAL pixel dimensions, the
+ * current device pixel ratio, and the editor's content width. Returns `undefined`
+ * when natural dimensions are unknown/invalid (caller leaves the block unsized —
+ * the renderer falls back to intrinsic size capped by CSS `max-width: 100%`).
+ *
+ * `width = round(min(naturalWidth / dpr, capWidth))`, height scaled to preserve
+ * the natural aspect ratio. A non-positive `dpr` is treated as `1`; a
+ * non-positive `capWidth` means "no cap".
+ */
+export function computeDisplaySize(
+  naturalWidth: number | undefined,
+  naturalHeight: number | undefined,
+  dpr: number,
+  capWidth: number,
+): NaturalSize | undefined {
+  if (!naturalWidth || !naturalHeight || naturalWidth <= 0 || naturalHeight <= 0) return undefined;
+  const ratio = dpr > 0 ? dpr : 1;
+  const perceived = naturalWidth / ratio;
+  const target = capWidth > 0 ? Math.min(perceived, capWidth) : perceived;
+  const width = Math.max(1, Math.round(target));
+  const height = Math.max(1, Math.round((width / naturalWidth) * naturalHeight));
+  return { width, height };
+}
+
+/**
+ * Limit a resize `maxWidth` so the image's rendered HEIGHT stays within its
+ * display cap (#644): `min(maxWidth, capHeight × naturalWidth / naturalHeight)`.
+ * Returns `maxWidth` unchanged when the natural size is unknown (not yet loaded)
+ * or `capHeight` is not a positive number (e.g. jsdom applies no stylesheet).
+ */
+export function capWidthToHeight(
+  maxWidth: number,
+  naturalWidth: number | undefined,
+  naturalHeight: number | undefined,
+  capHeight: number,
+): number {
+  if (!naturalWidth || !naturalHeight || !(capHeight > 0)) return maxWidth;
+  return Math.min(maxWidth, (capHeight * naturalWidth) / naturalHeight);
+}
+
+/**
+ * Measure an image File's natural pixel dimensions in the browser via
+ * `createImageBitmap`. Resolves `null` for non-images, when the API is
+ * unavailable (e.g. jsdom — so unit tests never block on image decoding), or on
+ * any decode error. Injected into `useUpload` so it can be stubbed in tests.
+ */
+export async function measureImageFromFile(file: File): Promise<NaturalSize | null> {
+  if (!file.type?.startsWith('image/') || typeof createImageBitmap !== 'function') return null;
+  try {
+    const bitmap = await createImageBitmap(file);
+    const size = { width: bitmap.width, height: bitmap.height };
+    bitmap.close?.();
+    return size.width > 0 && size.height > 0 ? size : null;
+  } catch {
+    return null;
+  }
+}

package/src/components/RichTextEditor/index.ts

@@ -0,0 +1,5 @@
+export { RichTextEditor } from './RichTextEditor';
+export type { RichTextEditorProps } from './RichTextEditor';
+export type { MentionItem, MentionsConfig } from './mentions';
+export { UploadError } from './useUpload';
+export type { UploadConfig, UploadResult } from './useUpload';