MarkdownEditor

import { TxMarkdownEditor } from '@talex-touch/tuffex/markdown-editor'
import '@talex-touch/tuffex/markdown-editor/style.css'
// It renders these components, whose sheets are separate
import '@talex-touch/tuffex/base-anchor/style.css'
import '@talex-touch/tuffex/base-surface/style.css'
import '@talex-touch/tuffex/card/style.css'
import '@talex-touch/tuffex/flow-light/style.css'
import '@talex-touch/tuffex/glass-surface/style.css'
import '@talex-touch/tuffex/icon/style.css'
import '@talex-touch/tuffex/spinner/style.css'
import '@talex-touch/tuffex/stream-text/style.css'
import 'katex/dist/katex.min.css' // optional: KaTeX typesets formulas, MathML otherwise
import '@talex-touch/tuffex/base.css' // tokens + resets, once per app

type MarkdownEditorMode = 'wysiwyg' | 'source' | 'preview'

type MarkdownEditorToolbarActionKey =
  | 'heading' | 'bold' | 'italic' | 'strike' | 'code' | 'highlight' | 'quote'
  | 'bulletList' | 'orderedList' | 'taskList' | 'link' | 'image' | 'table'
  | 'codeBlock' | 'math' | 'divider' | 'emoji' | 'undo' | 'redo'

type MarkdownEditorCodeTheme = 'github' | 'one' | 'vitesse' | 'catppuccin' | 'solarized' | 'none'

interface MarkdownEditorAiRequest {
  action: 'improve' | 'shorten' | 'expand' | 'fix' | 'translate' | 'custom'
  instruction: string // what the user typed, for custom
  text: string // the selected Markdown, which the answer replaces
  before: string // up to 2,000 characters of context on each side
  after: string
  signal: AbortSignal // aborts on stop, retry or discard
}
type MarkdownEditorAi = (request: MarkdownEditorAiRequest) => string | Promise<string> | AsyncIterable<string>

type MarkdownEditorUploadImage = (
  file: File,
  context: { onProgress: (percent: number) => void, signal: AbortSignal },
) => Promise<string | { url: string, alt?: string, title?: string }>

interface MarkdownEditorUser { id: string, name: string, color?: string, avatar?: string }

interface MarkdownEditorComment {
  id: string
  from: number // a source range that moves with edits
  to: number
  quote: string // relocates the range when it no longer matches
  author: MarkdownEditorUser
  body: string
  createdAt: number
  resolved?: boolean
  replies?: MarkdownEditorCommentReply[]
}

// One replacement; every offset in a change set is against the document before it
interface MarkdownTextChange { from: number, to: number, insert: string }

interface MarkdownEditorCollaboration {
  send: (changes: MarkdownTextChange[]) => void
  sendPresence?: (presence: { selection: MarkdownEditorSelection | null, mode: MarkdownEditorMode }) => void
  subscribe: (handlers: {
    onChanges: (changes: MarkdownTextChange[]) => void // against the editor's current document
    onPeers?: (peers: MarkdownEditorPeer[]) => void
  }) => () => void
}