@bikdotai/bik-component-library 0.0.853 → 0.0.855

package/dist/esm/editor/BikEditor.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"BikEditor.types.js","sources":["../../../src/editor/BikEditor.types.ts"],"sourcesContent":["/**\n * ┌─────────────────────────────────────────────────────────────────────────┐\n * │  PUBLIC API LAYER — zero editor-framework imports                        │\n * │                                                                           │\n * │  This file is the consumer contract for BikEditor. It has NO dependency  │\n * │  on TipTap, Lexical, Slate, or any other rich-text library.              │\n * │                                                                           │\n * │  If the underlying editor is ever swapped, ONLY the implementation files  │\n * │  change — this file, src/editor/index.ts, and all consumer code stay as- │\n * │  is. The files that would change are:                                     │\n * │    • BikEditor.tsx        — wires props into the editor instance          │\n * │    • BikEditor.utils.ts   — HTML / document-state adapters               │\n * │    • extensions/          — extension / plugin layer                      │\n * └─────────────────────────────────────────────────────────────────────────┘\n */\nimport React from 'react';\n\n/**\n * Opt in to specific editor capabilities. Both default to `false`.\n *\n * @example\n * // Email editor with full rich text support\n * <BikEditor features={{ richPaste: true, richTypography: true }} />\n */\nexport interface EditorFeatures {\n\t/** Preserve HTML formatting on paste. Default: `false`. */\n\trichPaste?: boolean;\n\t/** Enable font family, font size, text alignment, highlight, subscript, superscript, and image. Default: `false`. */\n\trichTypography?: boolean;\n\t/**\n\t * Restrict which inline marks are active in the editor.\n\t * When set, only the listed marks are registered — all others are disabled\n\t * (no rendering, no keyboard shortcuts, no paste preservation).\n\t * Omit to allow all marks (default).\n\t *\n\t * @example\n\t * // LiveChat: bold only, no italic / underline / strike\n\t * features={{ allowedMarks: ['bold'] }}\n\t */\n\tallowedMarks?: Array<'bold' | 'italic' | 'strike' | 'underline' | 'code'>;\n\t/**\n\t * Turn the editor into a Postman-style JSON body editor: the whole document\n\t * becomes one syntax-highlighted JSON code block. Disables the rich-text stack\n\t * (mentions, typography, rich paste, sections). Drive it via `ref.json.*`.\n\t * Default: `false`.\n\t *\n\t * @example\n\t * <BikEditor features={{ jsonMode: true }} initialContent='{ \"id\": 1 }' />\n\t */\n\tjsonMode?: boolean;\n}\n\n/**\n * A named content section placed below the main body, separated by an invisible divider.\n *\n * Sections let you split a single editor instance into independently readable\n * and writable zones — for example: body / signature / forwarded mail.\n *\n * @example\n * sections={[\n *   { id: 'signature', content: '<p>Best regards,<br/>Alice</p>' },\n *   { id: 'forwarded', content: '<p>--- Forwarded message ---</p>' },\n * ]}\n */\nexport interface EditorSection {\n\t/**\n\t * Unique identifier. Used in ref methods: `getSectionContent(id)`,\n\t * `setSectionContent(id, html)`, `focusSection(id)`, `clearSection(id)`.\n\t * The string `'body'` is reserved for the main content above all dividers.\n\t */\n\tid: string;\n\t/** Initial HTML content of this section. */\n\tcontent: string;\n}\n\n/**\n * Data passed to the `onPaste` callback.\n * Return `true` from your handler to suppress BikEditor's default paste handling\n * (rich-paste and plain-text stripping won't run for that event).\n */\nexport interface PasteData {\n\t/** All files in the clipboard (images, PDFs, etc.). */\n\tfiles: File[];\n\t/** Image files only — a filtered subset of `files`. */\n\timages: File[];\n\t/** Plain text from the clipboard. */\n\ttext: string;\n\t/** HTML from the clipboard (empty string if the source doesn't provide HTML). */\n\thtml: string;\n\t/** The raw browser ClipboardEvent — for advanced use. */\n\tevent: ClipboardEvent;\n}\n\n/**\n * A custom keyboard shortcut registered with the editor.\n *\n * @example\n * shortcuts={[\n *   // Mod = Cmd on Mac, Ctrl on Windows/Linux\n *   { key: 'Enter', modifiers: ['mod'], handler: handleSend },\n *   { key: 's',     modifiers: ['mod'], handler: handleSave },\n *   { key: 'k',     modifiers: ['mod', 'shift'], handler: openLinkModal },\n * ]}\n */\nexport interface KeyboardShortcut {\n\t/** Key name. Use the same strings as KeyboardEvent.key, e.g. `'Enter'`, `'s'`, `'k'`. */\n\tkey: string;\n\t/**\n\t * Modifier keys.\n\t * `'mod'` maps to Cmd on macOS and Ctrl on Windows/Linux — prefer it over\n\t * `'ctrl'` for cross-platform shortcuts.\n\t */\n\tmodifiers?: Array<'mod' | 'ctrl' | 'shift' | 'alt'>;\n\t/** Called when the shortcut fires. Returning nothing is fine. */\n\thandler: () => void;\n}\n\n/** Content object returned by onChange, onSend, getContent(), and getSectionContent(). */\nexport interface EditorSnapshot {\n\t/** Serialised HTML. Safe to pass back to setContent() or setSectionContent(). */\n\thtml: string;\n\t/** Plain text, stripped of all marks and block nodes. */\n\ttext: string;\n\t/** True when the document contains no user-visible content. */\n\tisEmpty: boolean;\n\t/** Character count at this point in time. */\n\tcharacterCount: number;\n}\n\n/**\n * Result of parsing the JSON body (features.jsonMode). Returned by `ref.json.parse()`.\n * Empty / whitespace-only content is treated as valid with a `null` value.\n */\nexport interface JsonParseResult {\n\t/** True when the current text is valid JSON. */\n\tvalid: boolean;\n\t/** The parsed value (`null` when empty or invalid). */\n\tvalue: unknown;\n\t/**\n\t * Human-readable error message, cleaned of the raw parser noise\n\t * (e.g. `\"Bad control character in string literal\"` instead of\n\t * `\"… in JSON at position 94 (line 7 column 9)\"`). `null` when valid.\n\t */\n\terror: string | null;\n\t/** 1-based line of the error, or `null` when valid / not locatable. */\n\tline: number | null;\n\t/** 1-based column of the error, or `null` when valid / not locatable. */\n\tcolumn: number | null;\n}\n\n/**\n * JSON body controls, available on the ref when `features.jsonMode` is on.\n * Access via `editorRef.current.json`.\n *\n * @example\n * editorRef.current?.json?.format();          // pretty-print (2-space indent)\n * const { valid, value } = editorRef.current!.json!.parse();\n */\nexport interface JsonBodyApi {\n\t/** Current raw text of the JSON body. */\n\tgetText: () => string;\n\t/** Replace the whole JSON body with `raw` and fire onChange. */\n\tsetText: (raw: string) => void;\n\t/** Parse the current text without throwing — see JsonParseResult. */\n\tparse: () => JsonParseResult;\n\t/** True when the current text is valid JSON. */\n\tisValid: () => boolean;\n\t/**\n\t * Pretty-print the current text in place. No-op when the text is invalid.\n\t * @param indent Number of spaces per level. Default `2`.\n\t */\n\tformat: (indent?: number) => void;\n\t/** Collapse the current text to a single line. No-op when invalid. */\n\tminify: () => void;\n}\n\n/** One item shown in the @agent or #team mention dropdown. */\nexport interface MentionItem {\n\t/** Unique identifier stored as a node attribute. Used to look up the item later. */\n\tid: string | number;\n\t/** Display name shown in the dropdown and inserted into the document. */\n\tlabel: string;\n\t/** Avatar image URL. Shown in the built-in row when renderMentionItem is not provided. */\n\tavatarUrl?: string;\n\t/** When true, a green presence dot appears in the built-in row. */\n\tisOnline?: boolean;\n\t/** Any extra data your app needs. Passed back as-is in onMentionSelected. */\n\tmeta?: Record<string, unknown>;\n}\n\n/** One item shown in the / slash-command dropdown. */\nexport interface SlashCommandItem {\n\t/** Unique identifier. */\n\tid: string;\n\t/** Short command name shown as the primary label in the menu. */\n\tlabel: string;\n\t/** Optional one-line description shown below the label in the built-in row. */\n\tdescription?: string;\n}\n\n// ---------------------------------------------------------------------------\n// Feature config objects — pass one object per feature instead of N flat props\n// ---------------------------------------------------------------------------\n\n/**\n * Props passed to the `renderDropdown` function in `MentionConfig`.\n * `activeIndex` is the keyboard-navigated row — highlight it in your UI.\n * Call `onSelect(item)` when the user picks one.\n */\nexport interface MentionDropdownRenderProps {\n\titems: MentionItem[];\n\t/** The text the user typed after the `@` or `#` trigger. */\n\tquery: string;\n\t/**\n\t * Index of the currently highlighted row (arrow-key navigation).\n\t * The editor manages this automatically — just use it for visual highlighting.\n\t */\n\tactiveIndex: number;\n\t/** Call this when the user selects an item (click, touch, etc.). */\n\tonSelect: (item: MentionItem) => void;\n\t/**\n\t * Register a keyboard handler so a CUSTOM dropdown can own arrow-key / Enter\n\t * navigation (e.g. a multi-level picker whose visible rows differ from the\n\t * flat `items` list). Return `true` from the handler to consume the key.\n\t * Pass `null` to unregister. When not registered, the editor falls back to\n\t * navigating the flat `items` list.\n\t */\n\tregisterKeyHandler?: (\n\t\thandler: ((event: KeyboardEvent) => boolean) | null,\n\t) => void;\n\t/**\n\t * Dismiss the dropdown WITHOUT selecting an item: closes the menu and strips\n\t * the typed `@`/`#` trigger + query. Use for custom actions in a multi-level\n\t * picker (e.g. a \"Create new\" row that opens a drawer instead of inserting a\n\t * mention).\n\t */\n\tonClose?: () => void;\n}\n\n/**\n * Everything related to @ and # mention dropdowns, in one place.\n *\n * @example\n * mentions={{\n *   agents: [{ id: 1, label: 'Alice', avatarUrl: '...' }],\n *   teams:  [{ id: 't1', label: 'Support' }],\n *   onSelect: (item, char) => console.log(char, item),\n * }}\n */\nexport interface MentionConfig {\n\t/** Items shown when the user types `@`. */\n\tagents?: MentionItem[];\n\t/** Items shown when the user types `#`. */\n\tteams?: MentionItem[];\n\t/** Called when the user picks an item. `char` is `'@'` or `'#'`. */\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void;\n\t/**\n\t * Custom renderer for each row in the dropdown.\n\t * `isActive` is `true` when that row is currently highlighted by keyboard\n\t * navigation (arrows move it, Enter selects it). Use it to apply a highlight\n\t * style so the user can see which item they're about to select.\n\t * Omit to use the built-in avatar + name row.\n\t *\n\t * Use `renderDropdown` instead when you need a completely different structure.\n\t *\n\t * @example\n\t * renderItem={(item, isActive) => (\n\t *   <div style={{ background: isActive ? '#f0f0f0' : undefined }}>\n\t *     {item.label}\n\t *   </div>\n\t * )}\n\t */\n\trenderItem?: (item: MentionItem, isActive: boolean) => React.ReactNode;\n\t/**\n\t * Render the entire dropdown yourself instead of individual rows.\n\t * The editor still manages keyboard navigation — `activeIndex` tells you\n\t * which row is highlighted, and `onSelect(item)` confirms the selection.\n\t * Takes priority over `renderItem` when both are provided.\n\t *\n\t * @example\n\t * renderDropdown={({ items, query, activeIndex, onSelect }) => (\n\t *   <MyDropdown\n\t *     items={items}\n\t *     highlightedIndex={activeIndex}\n\t *     onPick={onSelect}\n\t *   />\n\t * )}\n\t */\n\trenderDropdown?: (props: MentionDropdownRenderProps) => React.ReactNode;\n\t/**\n\t * When true, a typed trigger char (`@` / `#`) and its query are removed if the\n\t * suggestion menu closes without a selection (click-outside / no match). Default\n\t * false — the typed text is kept.\n\t */\n\tremoveTriggerOnDismiss?: boolean;\n\t/**\n\t * Optional leading glyph rendered inside an `@` mention chip, before the label\n\t * (e.g. a tool's source icon). Receives the chip's `source` / `kind` attrs.\n\t * Providing this switches the agent chips to a React node view; omit to keep\n\t * the plain chip. `source` is only set on chips inserted with a `meta.source`.\n\t */\n\trenderChipIcon?: (\n\t\tsource: string | null,\n\t\tkind: string | null,\n\t) => React.ReactNode;\n}\n\n/**\n * Props passed to the `renderDropdown` function in `SlashCommandConfig`.\n */\nexport interface SlashCommandDropdownRenderProps {\n\titems: SlashCommandItem[];\n\t/** The text the user typed after `/`. */\n\tquery: string;\n\t/** Index of the currently highlighted row. Use for visual highlighting. */\n\tactiveIndex: number;\n\t/** Call this when the user selects an item. */\n\tonSelect: (item: SlashCommandItem) => void;\n}\n\n/**\n * Everything related to the `/` slash-command menu, in one place.\n *\n * @example\n * slashCommands={{\n *   items: [{ id: 'ai-reply', label: 'AI Reply', description: 'Generate a reply' }],\n *   onSelect: (cmd) => triggerAI(cmd.id),\n * }}\n */\nexport interface SlashCommandConfig {\n\t/** The list of commands. Filtered client-side as the user types after `/`. */\n\titems: SlashCommandItem[];\n\t/** Called when the user selects a command. The `/` trigger is removed from the doc. */\n\tonSelect?: (command: SlashCommandItem) => void;\n\t/**\n\t * Custom renderer for each row.\n\t * `isActive` is `true` when that row is highlighted by keyboard navigation.\n\t * Omit to use the built-in label + description row.\n\t *\n\t * Use `renderDropdown` instead when you need a completely different structure.\n\t */\n\trenderItem?: (item: SlashCommandItem, isActive: boolean) => React.ReactNode;\n\t/**\n\t * Render the entire slash-command dropdown yourself.\n\t * The editor manages keyboard navigation — use `activeIndex` to highlight\n\t * the active row and call `onSelect(item)` to confirm selection.\n\t * Takes priority over `renderItem` when both are provided.\n\t *\n\t * @example\n\t * renderDropdown={({ items, activeIndex, onSelect }) => (\n\t *   <MyCmdPalette commands={items} active={activeIndex} onPick={onSelect} />\n\t * )}\n\t */\n\trenderDropdown?: (props: SlashCommandDropdownRenderProps) => React.ReactNode;\n}\n\n/**\n * Configuration for how hyperlinks behave in the editor.\n *\n * @example\n * link={{ renderTooltip: ({ href, text, onOpen, onRemove }) => (\n *   <MyLinkPopover href={href} onOpen={onOpen} onRemove={onRemove} />\n * )}}\n */\nexport interface LinkConfig {\n\t/**\n\t * Custom tooltip rendered when the user clicks a link.\n\t * Receives the href, display text, bounding rect (for positioning),\n\t * and ready-to-call action handlers.\n\t * Omit to use the minimal built-in tooltip.\n\t */\n\trenderTooltip?: (props: LinkTooltipProps) => React.ReactNode;\n}\n\n/**\n * Snapshot of all active marks and block types at the current cursor or selection.\n * Returned by onSelectionChange and ref.getActiveFormats().\n *\n * Keep this in component state and pass it to BikEditorToolbar (or your own toolbar)\n * to keep button active-states in sync.\n *\n * @example\n * const [formats, setFormats] = useState(DEFAULT_ACTIVE_FORMATS);\n * <BikEditor onSelectionChange={setFormats} ... />\n * <BikEditorToolbar activeFormats={formats} ... />\n */\nexport interface FormatState {\n\tbold: boolean;\n\titalic: boolean;\n\tunderline: boolean;\n\tstrike: boolean;\n\tbulletList: boolean;\n\torderedList: boolean;\n\tblockquote: boolean;\n\tcodeBlock: boolean;\n\t/** Non-null when the cursor is inside (or selection spans) a hyperlink. */\n\tlink: { href: string } | null;\n\ttextAlign: 'left' | 'center' | 'right' | 'justify' | null;\n\tfontFamily: string | null;\n\tfontSize: string | null;\n\t/** Active text colour as a CSS colour string, or null if none. */\n\tcolor: string | null;\n\t/** Active highlight (background) colour, or null if none. */\n\thighlight: string | null;\n\t/** True when the cursor/selection is in a superscript. */\n\tsuperscript: boolean;\n\t/** True when the cursor/selection is in a subscript. */\n\tsubscript: boolean;\n}\n\nexport const DEFAULT_FORMAT_STATE: FormatState = {\n\tbold: false,\n\titalic: false,\n\tunderline: false,\n\tstrike: false,\n\tbulletList: false,\n\torderedList: false,\n\tblockquote: false,\n\tcodeBlock: false,\n\tlink: null,\n\ttextAlign: null,\n\tfontFamily: null,\n\tfontSize: null,\n\tcolor: null,\n\thighlight: null,\n\tsuperscript: false,\n\tsubscript: false,\n};\n\n/**\n * All formatting and insertion commands. Access via `editorRef.current.actions`.\n *\n * Every method focuses the editor internally — no need to call `.focus()` first.\n *\n * @example\n * editorRef.current?.actions.toggleBold();\n * editorRef.current?.actions.setLink('https://example.com', 'Visit example');\n */\nexport interface EditorActions {\n\t// ── Basic marks ───────────────────────────────────────────────────────────\n\ttoggleBold: () => void;\n\ttoggleItalic: () => void;\n\ttoggleUnderline: () => void;\n\ttoggleStrike: () => void;\n\n\t// ── Blocks ────────────────────────────────────────────────────────────────\n\ttoggleBulletList: () => void;\n\ttoggleOrderedList: () => void;\n\ttoggleBlockquote: () => void;\n\ttoggleCodeBlock: () => void;\n\n\t// ── Alignment & typography ────────────────────────────────────────────────\n\tsetTextAlign: (align: 'left' | 'center' | 'right' | 'justify') => void;\n\t/** Pass a CSS font-family value, e.g. `'Inter, sans-serif'`. Only works when richTypography is on. */\n\tsetFontFamily: (font: string) => void;\n\t/** Pass a CSS size value, e.g. `'16px'` or `'1.25rem'`. Only works when richTypography is on. */\n\tsetFontSize: (size: string) => void;\n\n\t// ── Colour ────────────────────────────────────────────────────────────────\n\t/** Sets the text colour. Pass any CSS colour value, e.g. `'#e53e3e'`. */\n\tsetColor: (color: string) => void;\n\t/** Sets the highlight (background) colour. */\n\tsetHighlight: (color: string) => void;\n\t/** Removes the text colour mark from the current selection. */\n\tunsetColor: () => void;\n\t/** Removes the highlight mark from the current selection. */\n\tunsetHighlight: () => void;\n\n\t// ── Links ─────────────────────────────────────────────────────────────────\n\t/**\n\t * Applies a hyperlink to the current selection, or updates the link the\n\t * cursor is already inside.\n\t *\n\t * @param href  The URL.\n\t * @param text  Optional display text. When provided, the visible text of the\n\t *              linked range is replaced atomically in the same undo step.\n\t *\n\t * @example\n\t * actions.setLink('https://example.com');\n\t * actions.setLink('https://example.com', 'Visit example');\n\t */\n\tsetLink: (href: string, text?: string) => void;\n\t/** Updates only the href of the link at the current cursor. */\n\tupdateLink: (href: string) => void;\n\t/** Removes the link mark but keeps the visible text. */\n\tremoveLink: () => void;\n\n\t// ── Insertions ────────────────────────────────────────────────────────────\n\t/** Inserts an emoji character at the cursor. */\n\tinsertEmoji: (emoji: string) => void;\n\t/**\n\t * Inserts a `{{variableName}}` token at the cursor.\n\t * The token renders with a distinct highlight inside the editor.\n\t */\n\tinsertVariable: (variableName: string) => void;\n\t/** Inserts arbitrary HTML at the current cursor position. */\n\tinsertHtml: (html: string) => void;\n\n\t// ── History ───────────────────────────────────────────────────────────────\n\tundo: () => void;\n\tredo: () => void;\n\tcanUndo: () => boolean;\n\tcanRedo: () => boolean;\n\n\t// ── Rich typography (richTypography feature required) ─────────────────────\n\t/** Toggles superscript on the selection. Only works when richTypography is on. */\n\ttoggleSuperscript: () => void;\n\t/** Toggles subscript on the selection. Only works when richTypography is on. */\n\ttoggleSubscript: () => void;\n\t/** Inserts an inline image at the cursor. Only works when richTypography is on. */\n\tinsertImage: (src: string) => void;\n}\n\n/** Props passed to your renderLinkTooltip render prop. */\nexport interface LinkTooltipProps {\n\t/** The href of the active link. */\n\thref: string;\n\t/** The display text of the link. */\n\ttext: string;\n\t/** Bounding rect of the link element — use this to position your popover. */\n\trect: DOMRect;\n\t/** Opens the link in a new tab. */\n\tonOpen: () => void;\n\t/** Removes the link mark but keeps the visible text. */\n\tonRemove: () => void;\n\t/** Hides the bubble menu. Call this before opening an edit modal so the tooltip doesn't linger. */\n\tonHide: () => void;\n}\n\n/**\n * Imperative handle exposed by BikEditor.\n *\n * Obtain via `useRef<BikEditorRef>()` and pass to `<BikEditor ref={...} />`.\n * All methods are safe to call after the first render.\n *\n * @example\n * const ref = useRef<BikEditorRef>(null);\n * <BikEditor ref={ref} ... />\n * ref.current?.clearContent();\n * ref.current?.actions.toggleBold();\n */\nexport interface BikEditorRef {\n\t// ── Focus ─────────────────────────────────────────────────────────────────\n\t/** Moves focus into the editor. Optionally pass a position: 'start', 'end', 'all', or a numeric offset. */\n\tfocus: (position?: 'start' | 'end' | 'all' | number | boolean | null) => void;\n\t/** Removes focus from the editor. */\n\tblur: () => void;\n\n\t// ── Content ───────────────────────────────────────────────────────────────\n\t/** Clears the entire document and fires onChange. */\n\tclearContent: () => void;\n\t/**\n\t * Replaces the full document with the given HTML and fires onChange.\n\t * Overwrites all sections. Use setSectionContent() / setBodyContent() to\n\t * update a single section without touching the others.\n\t */\n\tsetContent: (html: string) => void;\n\t/** Inserts HTML at the current cursor position without replacing anything. */\n\tinsertContent: (html: string) => void;\n\t/**\n\t * Inserts HTML inline at the current cursor position, unwrapping block\n\t * wrappers (e.g. `<p>`) so the content merges into the surrounding paragraph\n\t * instead of creating new blocks. Use for macros, quick replies, etc.\n\t */\n\tinsertInlineContent: (html: string) => void;\n\t/** Inserts HTML at the very start of the document. */\n\tinsertAtStart: (html: string) => void;\n\t/** Inserts HTML as a new block at the end of the document. */\n\tinsertBlock: (html: string) => void;\n\t/**\n\t * Appends HTML inline inside the last paragraph of the document.\n\t * Ideal for streaming — call repeatedly with each text chunk.\n\t * Use `appendBodyContent` instead if the editor has named sections.\n\t */\n\tappendInline: (html: string) => void;\n\t/** @deprecated Use `insertBlock` */\n\tinsertAtEnd: (html: string) => void;\n\t/** @deprecated Use `appendInline` */\n\tappendContent: (html: string) => void;\n\t/** Returns the full document as `{ html, text, isEmpty, characterCount }`. */\n\tgetContent: () => EditorSnapshot;\n\t/**\n\t * Returns the raw TipTap document as a plain JSON object.\n\t * Returns `null` when the editor is not yet mounted.\n\t */\n\tgetJSON: () => Record<string, unknown> | null;\n\t/**\n\t * Walks the document and returns all mention IDs currently in the editor,\n\t * split by type. IDs are deduplicated and returned as arrays.\n\t *\n\t * @example\n\t * const { agentIds, teamIds } = ref.current?.getMentions() ?? { agentIds: [], teamIds: [] };\n\t */\n\tgetMentions: () => { agentIds: string[]; teamIds: string[] };\n\n\t// ── Selection ─────────────────────────────────────────────────────────────\n\t/**\n\t * Returns the current cursor / selection position as a `{ from, to }` pair.\n\t * When nothing is selected, `from === to` (a collapsed cursor).\n\t * Pass the returned value to `insertAtPosition()` to insert at an exact spot.\n\t *\n\t * @example\n\t * const { from } = ref.current?.getCursorPosition() ?? { from: 0, to: 0 };\n\t * ref.current?.insertAtPosition(from, '<strong>inserted</strong>');\n\t */\n\tgetCursorPosition: () => { from: number; to: number };\n\t/**\n\t * Inserts HTML at an explicit document position rather than at the current cursor.\n\t * Use `getCursorPosition()` to get the position, or any value from\n\t * `findSectionStartPos` / `findSectionEndPos` if you need section-relative insertion.\n\t *\n\t * @example\n\t * const { from } = ref.current!.getCursorPosition();\n\t * ref.current?.insertAtPosition(from, '<em>hello</em>');\n\t */\n\tinsertAtPosition: (pos: number, html: string) => void;\n\t/**\n\t * Returns the currently selected plain text.\n\t * When the cursor is inside a link with nothing selected, returns the full\n\t * link text — useful for pre-filling a link modal's text field.\n\t */\n\tgetSelectedText: () => string;\n\n\t// ── Character count ───────────────────────────────────────────────────────\n\t/**\n\t * Returns the current character count and the configured limit (or null).\n\t * Use this to render your own character counter anywhere you like.\n\t *\n\t * @example\n\t * const { count, limit } = ref.current?.getCharacterCount() ?? { count: 0, limit: null };\n\t * <span style={{ color: count >= (limit ?? Infinity) ? 'red' : 'inherit' }}>\n\t *   {count}{limit != null ? ` / ${limit}` : ''}\n\t * </span>\n\t */\n\tgetCharacterCount: () => { count: number; limit: number | null };\n\n\t// ── Sections ─────────────────────────────────────────────────────────────\n\t/**\n\t * Returns content for a named section.\n\t * Use `'body'` to get the main content above all section dividers.\n\t *\n\t * @example\n\t * const sig = ref.current?.getSectionContent('signature');\n\t */\n\tgetSectionContent: (sectionId: string) => EditorSnapshot;\n\t/**\n\t * Replaces the content of a named section without touching other sections.\n\t * If the section doesn't exist yet it is appended at the end.\n\t *\n\t * @example\n\t * ref.current?.setSectionContent('signature', '<p>New signature</p>');\n\t * ref.current?.setSectionContent('body', rephrased); // same as setBodyContent\n\t */\n\tsetSectionContent: (sectionId: string, html: string) => void;\n\t/**\n\t * Moves the cursor to the start of a named section.\n\t * Use `'body'` to focus the main content area.\n\t */\n\tfocusSection: (sectionId: string) => void;\n\t/** Clears all content in a named section (replaces with an empty paragraph). */\n\tclearSection: (sectionId: string) => void;\n\n\t// ── Convenience body shorthands ───────────────────────────────────────────\n\t/** Shorthand for `getSectionContent('body')`. */\n\tgetBodyContent: () => EditorSnapshot;\n\t/** Shorthand for `setSectionContent('body', html)`. */\n\tsetBodyContent: (html: string) => void;\n\t/**\n\t * Atomically sets the body AND all sections in a single editor update.\n\t * Sections are laid out in the exact order supplied — use this instead of\n\t * multiple `setSectionContent()` calls whenever order matters (e.g. forward\n\t * mail where signature must appear before the forwarded thread).\n\t *\n\t * @example\n\t * ref.current?.setBodyAndSections('<p></p>', [\n\t *   { id: 'signature', content: '<p>Alice</p>' },\n\t *   { id: 'forwarded', content: '<p>--- Forwarded ---</p>' },\n\t * ]);\n\t */\n\tsetBodyAndSections: (\n\t\tbody: string,\n\t\tsections: Array<{ id: string; content: string }>,\n\t) => void;\n\t/**\n\t * Appends HTML to the end of the body section without moving the cursor.\n\t * Ideal for streaming AI-generated content — call repeatedly with each chunk.\n\t * Does NOT clear existing content; call `setBodyContent('')` first if needed.\n\t *\n\t * @example\n\t * // Stream AI response chunk-by-chunk\n\t * ref.current?.setBodyContent('');\n\t * for await (const chunk of aiStream) {\n\t *   ref.current?.appendBodyContent(chunk);\n\t * }\n\t */\n\tappendBodyContent: (html: string) => void;\n\n\t/**\n\t * Inserts HTML at the start of a named section (or `'body'`).\n\t * Inserts at the very start of the document when `sectionId` is `'body'`.\n\t */\n\tinsertAtSectionStart: (sectionId: string, html: string) => void;\n\t/**\n\t * Inserts HTML at the end of a named section (or `'body'`).\n\t * For `'body'`, inserts just before the first section divider (or at end of doc).\n\t */\n\tinsertAtSectionEnd: (sectionId: string, html: string) => void;\n\n\t// ── Formats & actions ─────────────────────────────────────────────────────\n\t/** Returns a snapshot of all active marks at the current cursor or selection. */\n\tgetActiveFormats: () => FormatState;\n\t/** All formatting and insertion commands. See EditorActions. */\n\tactions: EditorActions;\n\n\t// ── JSON body (features.jsonMode required) ─────────────────────────────────\n\t/**\n\t * JSON body controls. Present only when `features.jsonMode` is on\n\t * (`undefined` otherwise). See JsonBodyApi.\n\t *\n\t * @example\n\t * editorRef.current?.json?.format();\n\t */\n\tjson?: JsonBodyApi;\n}\n\n/**\n * Props for `<BikEditor />`. All props are optional.\n */\nexport interface BikEditorProps {\n\t// ── Features ──────────────────────────────────────────────────────────────\n\t/**\n\t * Opt in to specific editor capabilities. Both default to `false`.\n\t *\n\t * @example\n\t * <BikEditor features={{ richPaste: true, richTypography: true }} />\n\t */\n\tfeatures?: EditorFeatures;\n\n\t// ── Content ───────────────────────────────────────────────────────────────\n\t/**\n\t * HTML loaded on mount. Ignored after first render.\n\t * Use `ref.setContent()` to change content imperatively later.\n\t */\n\tinitialContent?: string;\n\t/**\n\t * Named sections placed below the main body.\n\t * Each section is separated from the previous one by an invisible divider node.\n\t * The array order determines the visual order in the document.\n\t *\n\t * These are only the INITIAL values — use `ref.setSectionContent()` to update\n\t * a section after mount without re-mounting the editor.\n\t *\n\t * @example\n\t * sections={[\n\t *   { id: 'signature', content: '<p>Best regards, Alice</p>' },\n\t *   { id: 'forwarded', content: '<p>--- Forwarded message ---</p>' },\n\t * ]}\n\t */\n\tsections?: EditorSection[];\n\t/** Placeholder text shown when the editor is empty. */\n\tplaceholder?: string;\n\n\t// ── Behaviour ─────────────────────────────────────────────────────────────\n\t/** Makes the editor read-only. The toolbar still renders but actions are no-ops. */\n\tdisabled?: boolean;\n\t/**\n\t * Hard character limit. The editor refuses to accept input beyond this point.\n\t * The limit is enforced silently — no UI is rendered. Use\n\t * `ref.getCharacterCount()` or `onChange.characterCount` to display it yourself.\n\t */\n\tmaxCharacters?: number;\n\t/**\n\t * Soft character limit. Unlike `maxCharacters`, this does NOT hard-block\n\t * input: typing is prevented once at/over the limit, but paste is allowed to\n\t * overflow and the excess characters render greyed (`.bik-editor-overflow`).\n\t * The count/error UI and send-gating are the consumer's responsibility — use\n\t * `onChange.characterCount`.\n\t */\n\tcharacterLimit?: number;\n\t/**\n\t * Turn {@link characterLimit} into a HARD cap. Like the soft limit it blocks\n\t * typing and keeps the same count metric, but additionally rejects EVERY edit\n\t * that would grow the content past the limit (Enter, drop, paste the consumer\n\t * didn't pre-trim), so the user can never add beyond it. Content already loaded\n\t * over the limit is preserved and can only be trimmed down. Prefer this over\n\t * `maxCharacters` when the shown count must line up with the cap (paragraph\n\t * breaks count as 2), and to avoid `maxCharacters`' load-time auto-trim.\n\t */\n\tcharacterLimitHard?: boolean;\n\n\t// ── Keyboard shortcuts ────────────────────────────────────────────────────\n\t/**\n\t * Custom keyboard shortcuts. BikEditor registers no shortcuts of its own —\n\t * every shortcut must be explicitly listed here.\n\t *\n\t * @example\n\t * shortcuts={[\n\t *   { key: 'Enter', modifiers: ['mod'], handler: handleSend },\n\t *   { key: 's', modifiers: ['mod', 'shift'], handler: handleDraft },\n\t * ]}\n\t */\n\tshortcuts?: KeyboardShortcut[];\n\t/**\n\t * Shortcut key that fires `onSend`. No key is bound to `onSend` unless you\n\t * set this explicitly. Requires `onSend` to also be provided.\n\t *\n\t * `'mod'` maps to Cmd on macOS and Ctrl on Windows/Linux.\n\t *\n\t * @example\n\t * // Single shortcut\n\t * sendShortcut={{ key: 'Enter', modifiers: ['mod'] }}\n\t * // Multiple shortcuts\n\t * sendShortcut={[\n\t *   { key: 'Enter', modifiers: ['mod'] },\n\t *   { key: 's', modifiers: ['mod'] },\n\t * ]}\n\t */\n\tsendShortcut?:\n\t\t| { key: string; modifiers?: Array<'mod' | 'ctrl' | 'shift' | 'alt'> }\n\t\t| Array<{\n\t\t\t\tkey: string;\n\t\t\t\tmodifiers?: Array<'mod' | 'ctrl' | 'shift' | 'alt'>;\n\t\t  }>;\n\n\t// ── Mentions ─────────────────────────────────────────────────────────────\n\t/**\n\t * Enables `@` (agent) and `#` (team) mention dropdowns.\n\t * Bundle all mention-related config in one object so it's easy to find.\n\t *\n\t * @example\n\t * mentions={{\n\t *   agents: myAgents,\n\t *   teams:  myTeams,\n\t *   onSelect: (item, char) => track(char, item.id),\n\t * }}\n\t */\n\tmentions?: MentionConfig;\n\n\t// ── Slash commands ────────────────────────────────────────────────────────\n\t/**\n\t * Enables the `/` slash-command menu.\n\t * Bundle all slash-command config in one object.\n\t *\n\t * @example\n\t * slashCommands={{\n\t *   items: MY_COMMANDS,\n\t *   onSelect: (cmd) => handleCommand(cmd.id),\n\t * }}\n\t */\n\tslashCommands?: SlashCommandConfig;\n\n\t// ── Link ─────────────────────────────────────────────────────────────────\n\t/**\n\t * Link-related configuration — currently just the click tooltip.\n\t *\n\t * @example\n\t * link={{ renderTooltip: ({ href, onOpen, onRemove }) => (\n\t *   <MyTooltip href={href} onOpen={onOpen} onRemove={onRemove} />\n\t * )}}\n\t */\n\tlink?: LinkConfig;\n\n\t// ── JSON body (features.jsonMode) ──────────────────────────────────────────\n\t/**\n\t * Custom renderer for the JSON parse error shown below the editor in\n\t * `features.jsonMode`. Receives the current {@link JsonParseResult} (always\n\t * an invalid one — it's only called when the JSON is broken). Omit to use the\n\t * built-in inline error banner; the error is never rendered when the JSON is\n\t * valid or when `jsonMode` is off.\n\t *\n\t * @example\n\t * renderJsonError={(err) => (\n\t *   <MyBanner>Line {err.line}: {err.error}</MyBanner>\n\t * )}\n\t */\n\trenderJsonError?: (error: JsonParseResult) => React.ReactNode;\n\n\t// ── Callbacks ─────────────────────────────────────────────────────────────\n\t/**\n\t * Called once, immediately after the editor finishes initializing.\n\t * Any imperative ref methods called before this fires are queued internally\n\t * and executed automatically once the editor is ready — consumers do not\n\t * need timers or readiness guards.\n\t *\n\t * @example\n\t * <BikEditor\n\t *   ref={editorRef}\n\t *   onReady={() => editorRef.current?.setContent(savedDraft)}\n\t * />\n\t */\n\tonReady?: () => void;\n\t/** Called on every document change. */\n\tonChange?: (content: EditorSnapshot) => void;\n\t/**\n\t * Called when the user presses the key combo defined by `sendShortcut`.\n\t * Only fires when both `onSend` and `sendShortcut` are provided.\n\t */\n\tonSend?: (content: EditorSnapshot) => void;\n\t/** Called when the editor gains focus. */\n\tonFocus?: () => void;\n\t/** Called when the editor loses focus. */\n\tonBlur?: () => void;\n\t/**\n\t * Called on every paste event. Return `true` to fully suppress BikEditor's\n\t * own paste handling (useful when you want to handle images or HTML yourself).\n\t *\n\t * @example\n\t * onPaste={({ images }) => {\n\t *   if (images.length) {\n\t *     uploadImages(images).then(urls => {\n\t *       urls.forEach(url => ref.current?.actions.insertHtml(`<img src=\"${url}\" />`));\n\t *     });\n\t *     return true; // suppress default — don't embed the raw image data\n\t *   }\n\t * }}\n\t */\n\tonPaste?: (data: PasteData) => boolean | void;\n\t/**\n\t * Called on every cursor move or selection change with a snapshot of all\n\t * active marks. Keep in state and pass to your toolbar to sync button states.\n\t */\n\tonSelectionChange?: (activeFormats: FormatState) => void;\n\n\t// ── Styling ───────────────────────────────────────────────────────────────\n\t// Outer wrapper — use these to control the shell (border, border-radius,\n\t// background, shadow, etc.).\n\t/** Extra class name applied to the outer wrapper div. */\n\tclassName?: string;\n\t/** Inline styles applied to the outer wrapper div. */\n\tstyle?: React.CSSProperties;\n\n\t// Inner editable area — use these to control the content div itself\n\t// (padding, font, line-height, etc.).\n\t/** Extra class name applied to the content-editable area (`.ProseMirror` in TipTap). */\n\teditorClassName?: string;\n\t/** Inline styles applied to the content-editable area. */\n\teditorStyle?: React.CSSProperties;\n\n\t// Sizing — applied to the content-editable area.\n\t/** Minimum height of the editable area. CSS value, e.g. `'80px'`. */\n\tminHeight?: string;\n\t/** Maximum height. The editor scrolls internally when exceeded. CSS value, e.g. `'400px'`. */\n\tmaxHeight?: string;\n}\n"],"names":["DEFAULT_FORMAT_STATE"],"mappings":"AA0ZO,MAAMA,IAAoC;AAAA,EAChD,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,MAAM;AAAA,EACN,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,OAAO;AAAA,EACP,WAAW;AAAA,EACX,aAAa;AAAA,EACb,WAAW;AACZ;"}
+{"version":3,"file":"BikEditor.types.js","sources":["../../../src/editor/BikEditor.types.ts"],"sourcesContent":["/**\n * ┌─────────────────────────────────────────────────────────────────────────┐\n * │  PUBLIC API LAYER — zero editor-framework imports                        │\n * │                                                                           │\n * │  This file is the consumer contract for BikEditor. It has NO dependency  │\n * │  on TipTap, Lexical, Slate, or any other rich-text library.              │\n * │                                                                           │\n * │  If the underlying editor is ever swapped, ONLY the implementation files  │\n * │  change — this file, src/editor/index.ts, and all consumer code stay as- │\n * │  is. The files that would change are:                                     │\n * │    • BikEditor.tsx        — wires props into the editor instance          │\n * │    • BikEditor.utils.ts   — HTML / document-state adapters               │\n * │    • extensions/          — extension / plugin layer                      │\n * └─────────────────────────────────────────────────────────────────────────┘\n */\nimport React from 'react';\n\n/**\n * Opt in to specific editor capabilities. Both default to `false`.\n *\n * @example\n * // Email editor with full rich text support\n * <BikEditor features={{ richPaste: true, richTypography: true }} />\n */\nexport interface EditorFeatures {\n\t/** Preserve HTML formatting on paste. Default: `false`. */\n\trichPaste?: boolean;\n\t/** Enable font family, font size, text alignment, highlight, subscript, superscript, and image. Default: `false`. */\n\trichTypography?: boolean;\n\t/**\n\t * Restrict which inline marks are active in the editor.\n\t * When set, only the listed marks are registered — all others are disabled\n\t * (no rendering, no keyboard shortcuts, no paste preservation).\n\t * Omit to allow all marks (default).\n\t *\n\t * @example\n\t * // LiveChat: bold only, no italic / underline / strike\n\t * features={{ allowedMarks: ['bold'] }}\n\t */\n\tallowedMarks?: Array<'bold' | 'italic' | 'strike' | 'underline' | 'code'>;\n\t/**\n\t * Turn the editor into a Postman-style JSON body editor: the whole document\n\t * becomes one syntax-highlighted JSON code block. Disables the rich-text stack\n\t * (mentions, typography, rich paste, sections). Drive it via `ref.json.*`.\n\t * Default: `false`.\n\t *\n\t * @example\n\t * <BikEditor features={{ jsonMode: true }} initialContent='{ \"id\": 1 }' />\n\t */\n\tjsonMode?: boolean;\n}\n\n/**\n * A named content section placed below the main body, separated by an invisible divider.\n *\n * Sections let you split a single editor instance into independently readable\n * and writable zones — for example: body / signature / forwarded mail.\n *\n * @example\n * sections={[\n *   { id: 'signature', content: '<p>Best regards,<br/>Alice</p>' },\n *   { id: 'forwarded', content: '<p>--- Forwarded message ---</p>' },\n * ]}\n */\nexport interface EditorSection {\n\t/**\n\t * Unique identifier. Used in ref methods: `getSectionContent(id)`,\n\t * `setSectionContent(id, html)`, `focusSection(id)`, `clearSection(id)`.\n\t * The string `'body'` is reserved for the main content above all dividers.\n\t */\n\tid: string;\n\t/** Initial HTML content of this section. */\n\tcontent: string;\n}\n\n/**\n * Data passed to the `onPaste` callback.\n * Return `true` from your handler to suppress BikEditor's default paste handling\n * (rich-paste and plain-text stripping won't run for that event).\n */\nexport interface PasteData {\n\t/** All files in the clipboard (images, PDFs, etc.). */\n\tfiles: File[];\n\t/** Image files only — a filtered subset of `files`. */\n\timages: File[];\n\t/** Plain text from the clipboard. */\n\ttext: string;\n\t/** HTML from the clipboard (empty string if the source doesn't provide HTML). */\n\thtml: string;\n\t/** The raw browser ClipboardEvent — for advanced use. */\n\tevent: ClipboardEvent;\n}\n\n/**\n * A custom keyboard shortcut registered with the editor.\n *\n * @example\n * shortcuts={[\n *   // Mod = Cmd on Mac, Ctrl on Windows/Linux\n *   { key: 'Enter', modifiers: ['mod'], handler: handleSend },\n *   { key: 's',     modifiers: ['mod'], handler: handleSave },\n *   { key: 'k',     modifiers: ['mod', 'shift'], handler: openLinkModal },\n * ]}\n */\nexport interface KeyboardShortcut {\n\t/** Key name. Use the same strings as KeyboardEvent.key, e.g. `'Enter'`, `'s'`, `'k'`. */\n\tkey: string;\n\t/**\n\t * Modifier keys.\n\t * `'mod'` maps to Cmd on macOS and Ctrl on Windows/Linux — prefer it over\n\t * `'ctrl'` for cross-platform shortcuts.\n\t */\n\tmodifiers?: Array<'mod' | 'ctrl' | 'shift' | 'alt'>;\n\t/** Called when the shortcut fires. Returning nothing is fine. */\n\thandler: () => void;\n}\n\n/** Content object returned by onChange, onSend, getContent(), and getSectionContent(). */\nexport interface EditorSnapshot {\n\t/** Serialised HTML. Safe to pass back to setContent() or setSectionContent(). */\n\thtml: string;\n\t/** Plain text, stripped of all marks and block nodes. */\n\ttext: string;\n\t/** True when the document contains no user-visible content. */\n\tisEmpty: boolean;\n\t/** Character count at this point in time. */\n\tcharacterCount: number;\n}\n\n/**\n * Result of parsing the JSON body (features.jsonMode). Returned by `ref.json.parse()`.\n * Empty / whitespace-only content is treated as valid with a `null` value.\n */\nexport interface JsonParseResult {\n\t/** True when the current text is valid JSON. */\n\tvalid: boolean;\n\t/** The parsed value (`null` when empty or invalid). */\n\tvalue: unknown;\n\t/**\n\t * Human-readable error message, cleaned of the raw parser noise\n\t * (e.g. `\"Bad control character in string literal\"` instead of\n\t * `\"… in JSON at position 94 (line 7 column 9)\"`). `null` when valid.\n\t */\n\terror: string | null;\n\t/** 1-based line of the error, or `null` when valid / not locatable. */\n\tline: number | null;\n\t/** 1-based column of the error, or `null` when valid / not locatable. */\n\tcolumn: number | null;\n}\n\n/**\n * JSON body controls, available on the ref when `features.jsonMode` is on.\n * Access via `editorRef.current.json`.\n *\n * @example\n * editorRef.current?.json?.format();          // pretty-print (2-space indent)\n * const { valid, value } = editorRef.current!.json!.parse();\n */\nexport interface JsonBodyApi {\n\t/** Current raw text of the JSON body. */\n\tgetText: () => string;\n\t/** Replace the whole JSON body with `raw` and fire onChange. */\n\tsetText: (raw: string) => void;\n\t/** Parse the current text without throwing — see JsonParseResult. */\n\tparse: () => JsonParseResult;\n\t/** True when the current text is valid JSON. */\n\tisValid: () => boolean;\n\t/**\n\t * Pretty-print the current text in place. No-op when the text is invalid.\n\t * @param indent Number of spaces per level. Default `2`.\n\t */\n\tformat: (indent?: number) => void;\n\t/** Collapse the current text to a single line. No-op when invalid. */\n\tminify: () => void;\n}\n\n/** One item shown in the @agent or #team mention dropdown. */\nexport interface MentionItem {\n\t/** Unique identifier stored as a node attribute. Used to look up the item later. */\n\tid: string | number;\n\t/** Display name shown in the dropdown and inserted into the document. */\n\tlabel: string;\n\t/** Avatar image URL. Shown in the built-in row when renderMentionItem is not provided. */\n\tavatarUrl?: string;\n\t/** When true, a green presence dot appears in the built-in row. */\n\tisOnline?: boolean;\n\t/** Any extra data your app needs. Passed back as-is in onMentionSelected. */\n\tmeta?: Record<string, unknown>;\n}\n\n/** One item shown in the / slash-command dropdown. */\nexport interface SlashCommandItem {\n\t/** Unique identifier. */\n\tid: string;\n\t/** Short command name shown as the primary label in the menu. */\n\tlabel: string;\n\t/** Optional one-line description shown below the label in the built-in row. */\n\tdescription?: string;\n}\n\n// ---------------------------------------------------------------------------\n// Feature config objects — pass one object per feature instead of N flat props\n// ---------------------------------------------------------------------------\n\n/**\n * Props passed to the `renderDropdown` function in `MentionConfig`.\n * `activeIndex` is the keyboard-navigated row — highlight it in your UI.\n * Call `onSelect(item)` when the user picks one.\n */\nexport interface MentionDropdownRenderProps {\n\titems: MentionItem[];\n\t/** The text the user typed after the `@` or `#` trigger. */\n\tquery: string;\n\t/**\n\t * Index of the currently highlighted row (arrow-key navigation).\n\t * The editor manages this automatically — just use it for visual highlighting.\n\t */\n\tactiveIndex: number;\n\t/** Call this when the user selects an item (click, touch, etc.). */\n\tonSelect: (item: MentionItem) => void;\n\t/**\n\t * Register a keyboard handler so a CUSTOM dropdown can own arrow-key / Enter\n\t * navigation (e.g. a multi-level picker whose visible rows differ from the\n\t * flat `items` list). Return `true` from the handler to consume the key.\n\t * Pass `null` to unregister. When not registered, the editor falls back to\n\t * navigating the flat `items` list.\n\t */\n\tregisterKeyHandler?: (\n\t\thandler: ((event: KeyboardEvent) => boolean) | null,\n\t) => void;\n\t/**\n\t * Dismiss the dropdown WITHOUT selecting an item: closes the menu and strips\n\t * the typed `@`/`#` trigger + query. Use for custom actions in a multi-level\n\t * picker (e.g. a \"Create new\" row that opens a drawer instead of inserting a\n\t * mention).\n\t */\n\tonClose?: () => void;\n}\n\n/**\n * Everything related to @ and # mention dropdowns, in one place.\n *\n * @example\n * mentions={{\n *   agents: [{ id: 1, label: 'Alice', avatarUrl: '...' }],\n *   teams:  [{ id: 't1', label: 'Support' }],\n *   onSelect: (item, char) => console.log(char, item),\n * }}\n */\nexport interface MentionConfig {\n\t/** Items shown when the user types `@`. */\n\tagents?: MentionItem[];\n\t/** Items shown when the user types `#`. */\n\tteams?: MentionItem[];\n\t/** Called when the user picks an item. `char` is `'@'` or `'#'`. */\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void;\n\t/**\n\t * Custom renderer for each row in the dropdown.\n\t * `isActive` is `true` when that row is currently highlighted by keyboard\n\t * navigation (arrows move it, Enter selects it). Use it to apply a highlight\n\t * style so the user can see which item they're about to select.\n\t * Omit to use the built-in avatar + name row.\n\t *\n\t * Use `renderDropdown` instead when you need a completely different structure.\n\t *\n\t * @example\n\t * renderItem={(item, isActive) => (\n\t *   <div style={{ background: isActive ? '#f0f0f0' : undefined }}>\n\t *     {item.label}\n\t *   </div>\n\t * )}\n\t */\n\trenderItem?: (item: MentionItem, isActive: boolean) => React.ReactNode;\n\t/**\n\t * Render the entire dropdown yourself instead of individual rows.\n\t * The editor still manages keyboard navigation — `activeIndex` tells you\n\t * which row is highlighted, and `onSelect(item)` confirms the selection.\n\t * Takes priority over `renderItem` when both are provided.\n\t *\n\t * @example\n\t * renderDropdown={({ items, query, activeIndex, onSelect }) => (\n\t *   <MyDropdown\n\t *     items={items}\n\t *     highlightedIndex={activeIndex}\n\t *     onPick={onSelect}\n\t *   />\n\t * )}\n\t */\n\trenderDropdown?: (props: MentionDropdownRenderProps) => React.ReactNode;\n\t/**\n\t * When true, a typed trigger char (`@` / `#`) and its query are removed if the\n\t * suggestion menu closes without a selection (click-outside / no match). Default\n\t * false — the typed text is kept.\n\t */\n\tremoveTriggerOnDismiss?: boolean;\n\t/**\n\t * Optional leading glyph rendered inside an `@` mention chip, before the label\n\t * (e.g. a tool's source icon). Receives the chip's `source` / `kind` attrs.\n\t * Providing this switches the agent chips to a React node view; omit to keep\n\t * the plain chip. `source` is only set on chips inserted with a `meta.source`.\n\t */\n\trenderChipIcon?: (\n\t\tsource: string | null,\n\t\tkind: string | null,\n\t) => React.ReactNode;\n}\n\n/**\n * Props passed to the `renderDropdown` function in `SlashCommandConfig`.\n */\nexport interface SlashCommandDropdownRenderProps {\n\titems: SlashCommandItem[];\n\t/** The text the user typed after `/`. */\n\tquery: string;\n\t/** Index of the currently highlighted row. Use for visual highlighting. */\n\tactiveIndex: number;\n\t/** Call this when the user selects an item. */\n\tonSelect: (item: SlashCommandItem) => void;\n}\n\n/**\n * Everything related to the `/` slash-command menu, in one place.\n *\n * @example\n * slashCommands={{\n *   items: [{ id: 'ai-reply', label: 'AI Reply', description: 'Generate a reply' }],\n *   onSelect: (cmd) => triggerAI(cmd.id),\n * }}\n */\nexport interface SlashCommandConfig {\n\t/** The list of commands. Filtered client-side as the user types after `/`. */\n\titems: SlashCommandItem[];\n\t/** Called when the user selects a command. The `/` trigger is removed from the doc. */\n\tonSelect?: (command: SlashCommandItem) => void;\n\t/**\n\t * Custom renderer for each row.\n\t * `isActive` is `true` when that row is highlighted by keyboard navigation.\n\t * Omit to use the built-in label + description row.\n\t *\n\t * Use `renderDropdown` instead when you need a completely different structure.\n\t */\n\trenderItem?: (item: SlashCommandItem, isActive: boolean) => React.ReactNode;\n\t/**\n\t * Render the entire slash-command dropdown yourself.\n\t * The editor manages keyboard navigation — use `activeIndex` to highlight\n\t * the active row and call `onSelect(item)` to confirm selection.\n\t * Takes priority over `renderItem` when both are provided.\n\t *\n\t * @example\n\t * renderDropdown={({ items, activeIndex, onSelect }) => (\n\t *   <MyCmdPalette commands={items} active={activeIndex} onPick={onSelect} />\n\t * )}\n\t */\n\trenderDropdown?: (props: SlashCommandDropdownRenderProps) => React.ReactNode;\n}\n\n/**\n * Configuration for how hyperlinks behave in the editor.\n *\n * @example\n * link={{ renderTooltip: ({ href, text, onOpen, onRemove }) => (\n *   <MyLinkPopover href={href} onOpen={onOpen} onRemove={onRemove} />\n * )}}\n */\nexport interface LinkConfig {\n\t/**\n\t * Custom tooltip rendered when the user clicks a link.\n\t * Receives the href, display text, bounding rect (for positioning),\n\t * and ready-to-call action handlers.\n\t * Omit to use the minimal built-in tooltip.\n\t */\n\trenderTooltip?: (props: LinkTooltipProps) => React.ReactNode;\n}\n\n/**\n * Snapshot of all active marks and block types at the current cursor or selection.\n * Returned by onSelectionChange and ref.getActiveFormats().\n *\n * Keep this in component state and pass it to BikEditorToolbar (or your own toolbar)\n * to keep button active-states in sync.\n *\n * @example\n * const [formats, setFormats] = useState(DEFAULT_ACTIVE_FORMATS);\n * <BikEditor onSelectionChange={setFormats} ... />\n * <BikEditorToolbar activeFormats={formats} ... />\n */\nexport interface FormatState {\n\tbold: boolean;\n\titalic: boolean;\n\tunderline: boolean;\n\tstrike: boolean;\n\tbulletList: boolean;\n\torderedList: boolean;\n\tblockquote: boolean;\n\tcodeBlock: boolean;\n\t/** Non-null when the cursor is inside (or selection spans) a hyperlink. */\n\tlink: { href: string } | null;\n\ttextAlign: 'left' | 'center' | 'right' | 'justify' | null;\n\tfontFamily: string | null;\n\tfontSize: string | null;\n\t/** Active text colour as a CSS colour string, or null if none. */\n\tcolor: string | null;\n\t/** Active highlight (background) colour, or null if none. */\n\thighlight: string | null;\n\t/** True when the cursor/selection is in a superscript. */\n\tsuperscript: boolean;\n\t/** True when the cursor/selection is in a subscript. */\n\tsubscript: boolean;\n}\n\nexport const DEFAULT_FORMAT_STATE: FormatState = {\n\tbold: false,\n\titalic: false,\n\tunderline: false,\n\tstrike: false,\n\tbulletList: false,\n\torderedList: false,\n\tblockquote: false,\n\tcodeBlock: false,\n\tlink: null,\n\ttextAlign: null,\n\tfontFamily: null,\n\tfontSize: null,\n\tcolor: null,\n\thighlight: null,\n\tsuperscript: false,\n\tsubscript: false,\n};\n\n/**\n * All formatting and insertion commands. Access via `editorRef.current.actions`.\n *\n * Every method focuses the editor internally — no need to call `.focus()` first.\n *\n * @example\n * editorRef.current?.actions.toggleBold();\n * editorRef.current?.actions.setLink('https://example.com', 'Visit example');\n */\nexport interface EditorActions {\n\t// ── Basic marks ───────────────────────────────────────────────────────────\n\ttoggleBold: () => void;\n\ttoggleItalic: () => void;\n\ttoggleUnderline: () => void;\n\ttoggleStrike: () => void;\n\n\t// ── Blocks ────────────────────────────────────────────────────────────────\n\ttoggleBulletList: () => void;\n\ttoggleOrderedList: () => void;\n\ttoggleBlockquote: () => void;\n\ttoggleCodeBlock: () => void;\n\n\t// ── Alignment & typography ────────────────────────────────────────────────\n\tsetTextAlign: (align: 'left' | 'center' | 'right' | 'justify') => void;\n\t/** Pass a CSS font-family value, e.g. `'Inter, sans-serif'`. Only works when richTypography is on. */\n\tsetFontFamily: (font: string) => void;\n\t/** Pass a CSS size value, e.g. `'16px'` or `'1.25rem'`. Only works when richTypography is on. */\n\tsetFontSize: (size: string) => void;\n\n\t// ── Colour ────────────────────────────────────────────────────────────────\n\t/** Sets the text colour. Pass any CSS colour value, e.g. `'#e53e3e'`. */\n\tsetColor: (color: string) => void;\n\t/** Sets the highlight (background) colour. */\n\tsetHighlight: (color: string) => void;\n\t/** Removes the text colour mark from the current selection. */\n\tunsetColor: () => void;\n\t/** Removes the highlight mark from the current selection. */\n\tunsetHighlight: () => void;\n\n\t// ── Links ─────────────────────────────────────────────────────────────────\n\t/**\n\t * Applies a hyperlink to the current selection, or updates the link the\n\t * cursor is already inside.\n\t *\n\t * @param href  The URL.\n\t * @param text  Optional display text. When provided, the visible text of the\n\t *              linked range is replaced atomically in the same undo step.\n\t *\n\t * @example\n\t * actions.setLink('https://example.com');\n\t * actions.setLink('https://example.com', 'Visit example');\n\t */\n\tsetLink: (href: string, text?: string) => void;\n\t/** Updates only the href of the link at the current cursor. */\n\tupdateLink: (href: string) => void;\n\t/** Removes the link mark but keeps the visible text. */\n\tremoveLink: () => void;\n\n\t// ── Insertions ────────────────────────────────────────────────────────────\n\t/** Inserts an emoji character at the cursor. */\n\tinsertEmoji: (emoji: string) => void;\n\t/**\n\t * Inserts a `{{variableName}}` token at the cursor.\n\t * The token renders with a distinct highlight inside the editor.\n\t */\n\tinsertVariable: (variableName: string) => void;\n\t/** Inserts arbitrary HTML at the current cursor position. */\n\tinsertHtml: (html: string) => void;\n\t/**\n\t * Opens the `@` / `#` mention menu at the cursor, exactly as if the user\n\t * typed the trigger character — the same dropdown, selection handling and\n\t * trigger-stripping apply. Inserts a leading space first when the cursor\n\t * sits directly after a non-space character (the suggestion plugin only\n\t * fires after whitespace). No-op when the matching mention list wasn't\n\t * configured.\n\t */\n\topenMentionMenu: (char?: '@' | '#') => void;\n\n\t// ── History ───────────────────────────────────────────────────────────────\n\tundo: () => void;\n\tredo: () => void;\n\tcanUndo: () => boolean;\n\tcanRedo: () => boolean;\n\n\t// ── Rich typography (richTypography feature required) ─────────────────────\n\t/** Toggles superscript on the selection. Only works when richTypography is on. */\n\ttoggleSuperscript: () => void;\n\t/** Toggles subscript on the selection. Only works when richTypography is on. */\n\ttoggleSubscript: () => void;\n\t/** Inserts an inline image at the cursor. Only works when richTypography is on. */\n\tinsertImage: (src: string) => void;\n}\n\n/** Props passed to your renderLinkTooltip render prop. */\nexport interface LinkTooltipProps {\n\t/** The href of the active link. */\n\thref: string;\n\t/** The display text of the link. */\n\ttext: string;\n\t/** Bounding rect of the link element — use this to position your popover. */\n\trect: DOMRect;\n\t/** Opens the link in a new tab. */\n\tonOpen: () => void;\n\t/** Removes the link mark but keeps the visible text. */\n\tonRemove: () => void;\n\t/** Hides the bubble menu. Call this before opening an edit modal so the tooltip doesn't linger. */\n\tonHide: () => void;\n}\n\n/**\n * Imperative handle exposed by BikEditor.\n *\n * Obtain via `useRef<BikEditorRef>()` and pass to `<BikEditor ref={...} />`.\n * All methods are safe to call after the first render.\n *\n * @example\n * const ref = useRef<BikEditorRef>(null);\n * <BikEditor ref={ref} ... />\n * ref.current?.clearContent();\n * ref.current?.actions.toggleBold();\n */\nexport interface BikEditorRef {\n\t// ── Focus ─────────────────────────────────────────────────────────────────\n\t/** Moves focus into the editor. Optionally pass a position: 'start', 'end', 'all', or a numeric offset. */\n\tfocus: (position?: 'start' | 'end' | 'all' | number | boolean | null) => void;\n\t/** Removes focus from the editor. */\n\tblur: () => void;\n\n\t// ── Content ───────────────────────────────────────────────────────────────\n\t/** Clears the entire document and fires onChange. */\n\tclearContent: () => void;\n\t/**\n\t * Replaces the full document with the given HTML and fires onChange.\n\t * Overwrites all sections. Use setSectionContent() / setBodyContent() to\n\t * update a single section without touching the others.\n\t */\n\tsetContent: (html: string) => void;\n\t/** Inserts HTML at the current cursor position without replacing anything. */\n\tinsertContent: (html: string) => void;\n\t/**\n\t * Inserts HTML inline at the current cursor position, unwrapping block\n\t * wrappers (e.g. `<p>`) so the content merges into the surrounding paragraph\n\t * instead of creating new blocks. Use for macros, quick replies, etc.\n\t */\n\tinsertInlineContent: (html: string) => void;\n\t/** Inserts HTML at the very start of the document. */\n\tinsertAtStart: (html: string) => void;\n\t/** Inserts HTML as a new block at the end of the document. */\n\tinsertBlock: (html: string) => void;\n\t/**\n\t * Appends HTML inline inside the last paragraph of the document.\n\t * Ideal for streaming — call repeatedly with each text chunk.\n\t * Use `appendBodyContent` instead if the editor has named sections.\n\t */\n\tappendInline: (html: string) => void;\n\t/** @deprecated Use `insertBlock` */\n\tinsertAtEnd: (html: string) => void;\n\t/** @deprecated Use `appendInline` */\n\tappendContent: (html: string) => void;\n\t/** Returns the full document as `{ html, text, isEmpty, characterCount }`. */\n\tgetContent: () => EditorSnapshot;\n\t/**\n\t * Returns the raw TipTap document as a plain JSON object.\n\t * Returns `null` when the editor is not yet mounted.\n\t */\n\tgetJSON: () => Record<string, unknown> | null;\n\t/**\n\t * Walks the document and returns all mention IDs currently in the editor,\n\t * split by type. IDs are deduplicated and returned as arrays.\n\t *\n\t * @example\n\t * const { agentIds, teamIds } = ref.current?.getMentions() ?? { agentIds: [], teamIds: [] };\n\t */\n\tgetMentions: () => { agentIds: string[]; teamIds: string[] };\n\n\t// ── Selection ─────────────────────────────────────────────────────────────\n\t/**\n\t * Returns the current cursor / selection position as a `{ from, to }` pair.\n\t * When nothing is selected, `from === to` (a collapsed cursor).\n\t * Pass the returned value to `insertAtPosition()` to insert at an exact spot.\n\t *\n\t * @example\n\t * const { from } = ref.current?.getCursorPosition() ?? { from: 0, to: 0 };\n\t * ref.current?.insertAtPosition(from, '<strong>inserted</strong>');\n\t */\n\tgetCursorPosition: () => { from: number; to: number };\n\t/**\n\t * Inserts HTML at an explicit document position rather than at the current cursor.\n\t * Use `getCursorPosition()` to get the position, or any value from\n\t * `findSectionStartPos` / `findSectionEndPos` if you need section-relative insertion.\n\t *\n\t * @example\n\t * const { from } = ref.current!.getCursorPosition();\n\t * ref.current?.insertAtPosition(from, '<em>hello</em>');\n\t */\n\tinsertAtPosition: (pos: number, html: string) => void;\n\t/**\n\t * Returns the currently selected plain text.\n\t * When the cursor is inside a link with nothing selected, returns the full\n\t * link text — useful for pre-filling a link modal's text field.\n\t */\n\tgetSelectedText: () => string;\n\n\t// ── Character count ───────────────────────────────────────────────────────\n\t/**\n\t * Returns the current character count and the configured limit (or null).\n\t * Use this to render your own character counter anywhere you like.\n\t *\n\t * @example\n\t * const { count, limit } = ref.current?.getCharacterCount() ?? { count: 0, limit: null };\n\t * <span style={{ color: count >= (limit ?? Infinity) ? 'red' : 'inherit' }}>\n\t *   {count}{limit != null ? ` / ${limit}` : ''}\n\t * </span>\n\t */\n\tgetCharacterCount: () => { count: number; limit: number | null };\n\n\t// ── Sections ─────────────────────────────────────────────────────────────\n\t/**\n\t * Returns content for a named section.\n\t * Use `'body'` to get the main content above all section dividers.\n\t *\n\t * @example\n\t * const sig = ref.current?.getSectionContent('signature');\n\t */\n\tgetSectionContent: (sectionId: string) => EditorSnapshot;\n\t/**\n\t * Replaces the content of a named section without touching other sections.\n\t * If the section doesn't exist yet it is appended at the end.\n\t *\n\t * @example\n\t * ref.current?.setSectionContent('signature', '<p>New signature</p>');\n\t * ref.current?.setSectionContent('body', rephrased); // same as setBodyContent\n\t */\n\tsetSectionContent: (sectionId: string, html: string) => void;\n\t/**\n\t * Moves the cursor to the start of a named section.\n\t * Use `'body'` to focus the main content area.\n\t */\n\tfocusSection: (sectionId: string) => void;\n\t/** Clears all content in a named section (replaces with an empty paragraph). */\n\tclearSection: (sectionId: string) => void;\n\n\t// ── Convenience body shorthands ───────────────────────────────────────────\n\t/** Shorthand for `getSectionContent('body')`. */\n\tgetBodyContent: () => EditorSnapshot;\n\t/** Shorthand for `setSectionContent('body', html)`. */\n\tsetBodyContent: (html: string) => void;\n\t/**\n\t * Atomically sets the body AND all sections in a single editor update.\n\t * Sections are laid out in the exact order supplied — use this instead of\n\t * multiple `setSectionContent()` calls whenever order matters (e.g. forward\n\t * mail where signature must appear before the forwarded thread).\n\t *\n\t * @example\n\t * ref.current?.setBodyAndSections('<p></p>', [\n\t *   { id: 'signature', content: '<p>Alice</p>' },\n\t *   { id: 'forwarded', content: '<p>--- Forwarded ---</p>' },\n\t * ]);\n\t */\n\tsetBodyAndSections: (\n\t\tbody: string,\n\t\tsections: Array<{ id: string; content: string }>,\n\t) => void;\n\t/**\n\t * Appends HTML to the end of the body section without moving the cursor.\n\t * Ideal for streaming AI-generated content — call repeatedly with each chunk.\n\t * Does NOT clear existing content; call `setBodyContent('')` first if needed.\n\t *\n\t * @example\n\t * // Stream AI response chunk-by-chunk\n\t * ref.current?.setBodyContent('');\n\t * for await (const chunk of aiStream) {\n\t *   ref.current?.appendBodyContent(chunk);\n\t * }\n\t */\n\tappendBodyContent: (html: string) => void;\n\n\t/**\n\t * Inserts HTML at the start of a named section (or `'body'`).\n\t * Inserts at the very start of the document when `sectionId` is `'body'`.\n\t */\n\tinsertAtSectionStart: (sectionId: string, html: string) => void;\n\t/**\n\t * Inserts HTML at the end of a named section (or `'body'`).\n\t * For `'body'`, inserts just before the first section divider (or at end of doc).\n\t */\n\tinsertAtSectionEnd: (sectionId: string, html: string) => void;\n\n\t// ── Formats & actions ─────────────────────────────────────────────────────\n\t/** Returns a snapshot of all active marks at the current cursor or selection. */\n\tgetActiveFormats: () => FormatState;\n\t/** All formatting and insertion commands. See EditorActions. */\n\tactions: EditorActions;\n\n\t// ── JSON body (features.jsonMode required) ─────────────────────────────────\n\t/**\n\t * JSON body controls. Present only when `features.jsonMode` is on\n\t * (`undefined` otherwise). See JsonBodyApi.\n\t *\n\t * @example\n\t * editorRef.current?.json?.format();\n\t */\n\tjson?: JsonBodyApi;\n}\n\n/**\n * Props for `<BikEditor />`. All props are optional.\n */\nexport interface BikEditorProps {\n\t// ── Features ──────────────────────────────────────────────────────────────\n\t/**\n\t * Opt in to specific editor capabilities. Both default to `false`.\n\t *\n\t * @example\n\t * <BikEditor features={{ richPaste: true, richTypography: true }} />\n\t */\n\tfeatures?: EditorFeatures;\n\n\t// ── Content ───────────────────────────────────────────────────────────────\n\t/**\n\t * HTML loaded on mount. Ignored after first render.\n\t * Use `ref.setContent()` to change content imperatively later.\n\t */\n\tinitialContent?: string;\n\t/**\n\t * Named sections placed below the main body.\n\t * Each section is separated from the previous one by an invisible divider node.\n\t * The array order determines the visual order in the document.\n\t *\n\t * These are only the INITIAL values — use `ref.setSectionContent()` to update\n\t * a section after mount without re-mounting the editor.\n\t *\n\t * @example\n\t * sections={[\n\t *   { id: 'signature', content: '<p>Best regards, Alice</p>' },\n\t *   { id: 'forwarded', content: '<p>--- Forwarded message ---</p>' },\n\t * ]}\n\t */\n\tsections?: EditorSection[];\n\t/** Placeholder text shown when the editor is empty. */\n\tplaceholder?: string;\n\n\t// ── Behaviour ─────────────────────────────────────────────────────────────\n\t/** Makes the editor read-only. The toolbar still renders but actions are no-ops. */\n\tdisabled?: boolean;\n\t/**\n\t * Hard character limit. The editor refuses to accept input beyond this point.\n\t * The limit is enforced silently — no UI is rendered. Use\n\t * `ref.getCharacterCount()` or `onChange.characterCount` to display it yourself.\n\t */\n\tmaxCharacters?: number;\n\t/**\n\t * Soft character limit. Unlike `maxCharacters`, this does NOT hard-block\n\t * input: typing is prevented once at/over the limit, but paste is allowed to\n\t * overflow and the excess characters render greyed (`.bik-editor-overflow`).\n\t * The count/error UI and send-gating are the consumer's responsibility — use\n\t * `onChange.characterCount`.\n\t */\n\tcharacterLimit?: number;\n\t/**\n\t * Turn {@link characterLimit} into a HARD cap. Like the soft limit it blocks\n\t * typing and keeps the same count metric, but additionally rejects EVERY edit\n\t * that would grow the content past the limit (Enter, drop, paste the consumer\n\t * didn't pre-trim), so the user can never add beyond it. Content already loaded\n\t * over the limit is preserved and can only be trimmed down. Prefer this over\n\t * `maxCharacters` when the shown count must line up with the cap (paragraph\n\t * breaks count as 2), and to avoid `maxCharacters`' load-time auto-trim.\n\t */\n\tcharacterLimitHard?: boolean;\n\n\t// ── Keyboard shortcuts ────────────────────────────────────────────────────\n\t/**\n\t * Custom keyboard shortcuts. BikEditor registers no shortcuts of its own —\n\t * every shortcut must be explicitly listed here.\n\t *\n\t * @example\n\t * shortcuts={[\n\t *   { key: 'Enter', modifiers: ['mod'], handler: handleSend },\n\t *   { key: 's', modifiers: ['mod', 'shift'], handler: handleDraft },\n\t * ]}\n\t */\n\tshortcuts?: KeyboardShortcut[];\n\t/**\n\t * Shortcut key that fires `onSend`. No key is bound to `onSend` unless you\n\t * set this explicitly. Requires `onSend` to also be provided.\n\t *\n\t * `'mod'` maps to Cmd on macOS and Ctrl on Windows/Linux.\n\t *\n\t * @example\n\t * // Single shortcut\n\t * sendShortcut={{ key: 'Enter', modifiers: ['mod'] }}\n\t * // Multiple shortcuts\n\t * sendShortcut={[\n\t *   { key: 'Enter', modifiers: ['mod'] },\n\t *   { key: 's', modifiers: ['mod'] },\n\t * ]}\n\t */\n\tsendShortcut?:\n\t\t| { key: string; modifiers?: Array<'mod' | 'ctrl' | 'shift' | 'alt'> }\n\t\t| Array<{\n\t\t\t\tkey: string;\n\t\t\t\tmodifiers?: Array<'mod' | 'ctrl' | 'shift' | 'alt'>;\n\t\t  }>;\n\n\t// ── Mentions ─────────────────────────────────────────────────────────────\n\t/**\n\t * Enables `@` (agent) and `#` (team) mention dropdowns.\n\t * Bundle all mention-related config in one object so it's easy to find.\n\t *\n\t * @example\n\t * mentions={{\n\t *   agents: myAgents,\n\t *   teams:  myTeams,\n\t *   onSelect: (item, char) => track(char, item.id),\n\t * }}\n\t */\n\tmentions?: MentionConfig;\n\n\t// ── Slash commands ────────────────────────────────────────────────────────\n\t/**\n\t * Enables the `/` slash-command menu.\n\t * Bundle all slash-command config in one object.\n\t *\n\t * @example\n\t * slashCommands={{\n\t *   items: MY_COMMANDS,\n\t *   onSelect: (cmd) => handleCommand(cmd.id),\n\t * }}\n\t */\n\tslashCommands?: SlashCommandConfig;\n\n\t// ── Link ─────────────────────────────────────────────────────────────────\n\t/**\n\t * Link-related configuration — currently just the click tooltip.\n\t *\n\t * @example\n\t * link={{ renderTooltip: ({ href, onOpen, onRemove }) => (\n\t *   <MyTooltip href={href} onOpen={onOpen} onRemove={onRemove} />\n\t * )}}\n\t */\n\tlink?: LinkConfig;\n\n\t// ── JSON body (features.jsonMode) ──────────────────────────────────────────\n\t/**\n\t * Custom renderer for the JSON parse error shown below the editor in\n\t * `features.jsonMode`. Receives the current {@link JsonParseResult} (always\n\t * an invalid one — it's only called when the JSON is broken). Omit to use the\n\t * built-in inline error banner; the error is never rendered when the JSON is\n\t * valid or when `jsonMode` is off.\n\t *\n\t * @example\n\t * renderJsonError={(err) => (\n\t *   <MyBanner>Line {err.line}: {err.error}</MyBanner>\n\t * )}\n\t */\n\trenderJsonError?: (error: JsonParseResult) => React.ReactNode;\n\n\t// ── Callbacks ─────────────────────────────────────────────────────────────\n\t/**\n\t * Called once, immediately after the editor finishes initializing.\n\t * Any imperative ref methods called before this fires are queued internally\n\t * and executed automatically once the editor is ready — consumers do not\n\t * need timers or readiness guards.\n\t *\n\t * @example\n\t * <BikEditor\n\t *   ref={editorRef}\n\t *   onReady={() => editorRef.current?.setContent(savedDraft)}\n\t * />\n\t */\n\tonReady?: () => void;\n\t/** Called on every document change. */\n\tonChange?: (content: EditorSnapshot) => void;\n\t/**\n\t * Called when the user presses the key combo defined by `sendShortcut`.\n\t * Only fires when both `onSend` and `sendShortcut` are provided.\n\t */\n\tonSend?: (content: EditorSnapshot) => void;\n\t/** Called when the editor gains focus. */\n\tonFocus?: () => void;\n\t/** Called when the editor loses focus. */\n\tonBlur?: () => void;\n\t/**\n\t * Called on every paste event. Return `true` to fully suppress BikEditor's\n\t * own paste handling (useful when you want to handle images or HTML yourself).\n\t *\n\t * @example\n\t * onPaste={({ images }) => {\n\t *   if (images.length) {\n\t *     uploadImages(images).then(urls => {\n\t *       urls.forEach(url => ref.current?.actions.insertHtml(`<img src=\"${url}\" />`));\n\t *     });\n\t *     return true; // suppress default — don't embed the raw image data\n\t *   }\n\t * }}\n\t */\n\tonPaste?: (data: PasteData) => boolean | void;\n\t/**\n\t * Called on every cursor move or selection change with a snapshot of all\n\t * active marks. Keep in state and pass to your toolbar to sync button states.\n\t */\n\tonSelectionChange?: (activeFormats: FormatState) => void;\n\n\t// ── Styling ───────────────────────────────────────────────────────────────\n\t// Outer wrapper — use these to control the shell (border, border-radius,\n\t// background, shadow, etc.).\n\t/** Extra class name applied to the outer wrapper div. */\n\tclassName?: string;\n\t/** Inline styles applied to the outer wrapper div. */\n\tstyle?: React.CSSProperties;\n\n\t// Inner editable area — use these to control the content div itself\n\t// (padding, font, line-height, etc.).\n\t/** Extra class name applied to the content-editable area (`.ProseMirror` in TipTap). */\n\teditorClassName?: string;\n\t/** Inline styles applied to the content-editable area. */\n\teditorStyle?: React.CSSProperties;\n\n\t// Sizing — applied to the content-editable area.\n\t/** Minimum height of the editable area. CSS value, e.g. `'80px'`. */\n\tminHeight?: string;\n\t/** Maximum height. The editor scrolls internally when exceeded. CSS value, e.g. `'400px'`. */\n\tmaxHeight?: string;\n}\n"],"names":["DEFAULT_FORMAT_STATE"],"mappings":"AA0ZO,MAAMA,IAAoC;AAAA,EAChD,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,MAAM;AAAA,EACN,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,OAAO;AAAA,EACP,WAAW;AAAA,EACX,aAAa;AAAA,EACb,WAAW;AACZ;"}

package/dist/esm/editor/extensions/mention/MentionDropdown.js

@@ -1,49 +1,49 @@
-import { jsx as t, Fragment as p, jsxs as b } from "react/jsx-runtime";
-import { forwardRef as A, useState as I, useRef as x, useCallback as w, useImperativeHandle as v, useEffect as C } from "react";
+import { jsx as t, Fragment as x, jsxs as y } from "react/jsx-runtime";
+import { forwardRef as A, useState as I, useRef as g, useCallback as k, useImperativeHandle as v, useEffect as C } from "react";
 import { DropdownContainer as D, DropdownItem as R, MentionAvatar as U, MentionAvatarFallback as E, MentionLabel as H, MentionPresenceDot as K } from "../editorDropdown.styles.js";
 const S = A(
-  ({ items: r, query: g, command: u, renderItem: i, renderDropdown: a, dismiss: k }, y) => {
-    const [l, c] = I(0), f = x(null), s = x(null), M = w(
+  ({ items: r, query: u, command: i, renderItem: f, renderDropdown: o, dismiss: w }, M) => {
+    const [c, a] = I(0), d = g(null), s = g(null), b = k(
       (n) => {
         s.current = n;
       },
       []
-    ), d = w((n) => {
-      const e = f.current;
+    ), h = k((n) => {
+      const e = d.current;
       if (!e) return;
       e.children[n]?.scrollIntoView({ block: "nearest" });
-    }, []), h = (n) => {
-      r[n] && u(r[n]);
+    }, []), p = (n) => {
+      r[n] && i(r[n]);
     };
-    return v(y, () => ({
-      onKeyDown: ({ event: n }) => a && s.current ? s.current(n) : r.length ? n.key === "ArrowUp" ? (c((e) => {
-        const o = (e + r.length - 1) % r.length;
-        return d(o), o;
-      }), !0) : n.key === "ArrowDown" ? (c((e) => {
-        const o = (e + 1) % r.length;
-        return d(o), o;
-      }), !0) : n.key === "Enter" ? (h(l), !0) : !1 : !1
-    })), C(() => c(0), [r]), r.length ? a ? /* @__PURE__ */ t(p, { children: a({
+    return v(M, () => ({
+      onKeyDown: ({ event: n }) => o && s.current ? s.current(n) : r.length ? n.key === "ArrowUp" ? (a((e) => {
+        const l = (e + r.length - 1) % r.length;
+        return h(l), l;
+      }), !0) : n.key === "ArrowDown" ? (a((e) => {
+        const l = (e + 1) % r.length;
+        return h(l), l;
+      }), !0) : n.key === "Enter" ? (p(c), !0) : !1 : !1
+    })), C(() => a(0), [r]), !r.length && (!o || u) ? null : o ? /* @__PURE__ */ t(x, { children: o({
       items: r,
-      query: g,
-      activeIndex: l,
-      onSelect: (n) => u(n),
-      registerKeyHandler: M,
-      onClose: k
-    }) }) : /* @__PURE__ */ t(D, { ref: f, children: r.map((n, e) => /* @__PURE__ */ t(
+      query: u,
+      activeIndex: c,
+      onSelect: (n) => i(n),
+      registerKeyHandler: b,
+      onClose: w
+    }) }) : /* @__PURE__ */ t(D, { ref: d, children: r.map((n, e) => /* @__PURE__ */ t(
       R,
       {
-        $isActive: e === l,
-        onMouseEnter: () => c(e),
-        onClick: () => h(e),
-        children: i ? i(n, e === l) : /* @__PURE__ */ b(p, { children: [
+        $isActive: e === c,
+        onMouseEnter: () => a(e),
+        onClick: () => p(e),
+        children: f ? f(n, e === c) : /* @__PURE__ */ y(x, { children: [
           n.avatarUrl ? /* @__PURE__ */ t(U, { src: n.avatarUrl, alt: "" }) : /* @__PURE__ */ t(E, { children: n.label.charAt(0).toUpperCase() }),
           /* @__PURE__ */ t(H, { children: n.label }),
           n.isOnline !== void 0 && /* @__PURE__ */ t(K, { $online: n.isOnline })
         ] })
       },
       n.id
-    )) }) : null;
+    )) });
   }
 );
 S.displayName = "MentionDropdown";

package/dist/esm/editor/extensions/mention/MentionDropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"MentionDropdown.js","sources":["../../../../../src/editor/extensions/mention/MentionDropdown.tsx"],"sourcesContent":["import React, {\n\tforwardRef,\n\tuseCallback,\n\tuseEffect,\n\tuseImperativeHandle,\n\tuseRef,\n\tuseState,\n} from 'react';\nimport type {\n\tMentionDropdownRenderProps,\n\tMentionItem,\n} from '../../BikEditor.types';\nimport {\n\tDropdownContainer,\n\tDropdownItem,\n\tMentionAvatar,\n\tMentionAvatarFallback,\n\tMentionLabel,\n\tMentionPresenceDot,\n} from '../editorDropdown.styles';\n\ninterface Props {\n\titems: MentionItem[];\n\tquery: string;\n\tcommand: (item: MentionItem) => void;\n\t/** Custom per-row renderer. Receives the item and whether it is the active row. */\n\trenderItem?: (item: MentionItem, isActive: boolean) => React.ReactNode;\n\t/**\n\t * Full custom dropdown renderer. Takes priority over renderItem.\n\t * The editor passes activeIndex and onSelect — you handle all the visual rendering.\n\t */\n\trenderDropdown?: (props: MentionDropdownRenderProps) => React.ReactNode;\n\t/** Close the menu without selecting (strips the typed trigger). Injected by the extension. */\n\tdismiss?: () => void;\n}\n\nexport const MentionDropdown = forwardRef<any, Props>(\n\t({ items, query, command, renderItem, renderDropdown, dismiss }, ref) => {\n\t\tconst [selectedIndex, setSelectedIndex] = useState(0);\n\t\tconst containerRef = useRef<HTMLDivElement>(null);\n\t\t// A custom dropdown (renderDropdown) can claim keyboard nav for itself.\n\t\tconst customKeyHandlerRef = useRef<\n\t\t\t((event: KeyboardEvent) => boolean) | null\n\t\t>(null);\n\n\t\tconst registerKeyHandler = useCallback(\n\t\t\t(handler: ((event: KeyboardEvent) => boolean) | null) => {\n\t\t\t\tcustomKeyHandlerRef.current = handler;\n\t\t\t},\n\t\t\t[],\n\t\t);\n\n\t\tconst scrollToIndex = useCallback((index: number) => {\n\t\t\tconst container = containerRef.current;\n\t\t\tif (!container) return;\n\t\t\tconst item = container.children[index] as HTMLElement | undefined;\n\t\t\titem?.scrollIntoView({ block: 'nearest' });\n\t\t}, []);\n\n\t\tconst select = (i: number) => {\n\t\t\tif (items[i]) command(items[i]);\n\t\t};\n\n\t\tuseImperativeHandle(ref, () => ({\n\t\t\tonKeyDown: ({ event }: { event: KeyboardEvent }) => {\n\t\t\t\t// A custom dropdown that registered a handler owns navigation.\n\t\t\t\tif (renderDropdown && customKeyHandlerRef.current) {\n\t\t\t\t\treturn customKeyHandlerRef.current(event);\n\t\t\t\t}\n\t\t\t\tif (!items.length) return false;\n\t\t\t\tif (event.key === 'ArrowUp') {\n\t\t\t\t\tsetSelectedIndex((prev) => {\n\t\t\t\t\t\tconst next = (prev + items.length - 1) % items.length;\n\t\t\t\t\t\tscrollToIndex(next);\n\t\t\t\t\t\treturn next;\n\t\t\t\t\t});\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\tif (event.key === 'ArrowDown') {\n\t\t\t\t\tsetSelectedIndex((prev) => {\n\t\t\t\t\t\tconst next = (prev + 1) % items.length;\n\t\t\t\t\t\tscrollToIndex(next);\n\t\t\t\t\t\treturn next;\n\t\t\t\t\t});\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\tif (event.key === 'Enter') {\n\t\t\t\t\tselect(selectedIndex);\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\treturn false;\n\t\t\t},\n\t\t}));\n\n\t\tuseEffect(() => setSelectedIndex(0), [items]);\n\n\t\tif (!items.length) return null;\n\n\t\t// Full custom dropdown — editor still manages keyboard nav via selectedIndex\n\t\tif (renderDropdown) {\n\t\t\treturn (\n\t\t\t\t<>\n\t\t\t\t\t{renderDropdown({\n\t\t\t\t\t\titems,\n\t\t\t\t\t\tquery,\n\t\t\t\t\t\tactiveIndex: selectedIndex,\n\t\t\t\t\t\tonSelect: (item) => command(item),\n\t\t\t\t\t\tregisterKeyHandler,\n\t\t\t\t\t\tonClose: dismiss,\n\t\t\t\t\t})}\n\t\t\t\t</>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<DropdownContainer ref={containerRef}>\n\t\t\t\t{items.map((item, i) => (\n\t\t\t\t\t<DropdownItem\n\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\t$isActive={i === selectedIndex}\n\t\t\t\t\t\tonMouseEnter={() => setSelectedIndex(i)}\n\t\t\t\t\t\tonClick={() => select(i)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderItem ? (\n\t\t\t\t\t\t\trenderItem(item, i === selectedIndex)\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t{item.avatarUrl ? (\n\t\t\t\t\t\t\t\t\t<MentionAvatar src={item.avatarUrl} alt=\"\" />\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<MentionAvatarFallback>\n\t\t\t\t\t\t\t\t\t\t{item.label.charAt(0).toUpperCase()}\n\t\t\t\t\t\t\t\t\t</MentionAvatarFallback>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t<MentionLabel>{item.label}</MentionLabel>\n\t\t\t\t\t\t\t\t{item.isOnline !== undefined && (\n\t\t\t\t\t\t\t\t\t<MentionPresenceDot $online={item.isOnline} />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</DropdownItem>\n\t\t\t\t))}\n\t\t\t</DropdownContainer>\n\t\t);\n\t},\n);\nMentionDropdown.displayName = 'MentionDropdown';\n"],"names":["MentionDropdown","forwardRef","items","query","command","renderItem","renderDropdown","dismiss","ref","selectedIndex","setSelectedIndex","useState","containerRef","useRef","customKeyHandlerRef","registerKeyHandler","useCallback","handler","scrollToIndex","index","container","select","i","useImperativeHandle","event","prev","next","useEffect","item","jsx","DropdownContainer","DropdownItem","jsxs","Fragment","MentionAvatar","MentionAvatarFallback","MentionLabel","MentionPresenceDot"],"mappings":";;;AAoCO,MAAMA,IAAkBC;AAAA,EAC9B,CAAC,EAAE,OAAAC,GAAO,OAAAC,GAAO,SAAAC,GAAS,YAAAC,GAAY,gBAAAC,GAAgB,SAAAC,EAAA,GAAWC,MAAQ;AACxE,UAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAS,CAAC,GAC9CC,IAAeC,EAAuB,IAAI,GAE1CC,IAAsBD,EAE1B,IAAI,GAEAE,IAAqBC;AAAA,MAC1B,CAACC,MAAwD;AACxD,QAAAH,EAAoB,UAAUG;AAAA,MAC/B;AAAA,MACA,CAAA;AAAA,IAAC,GAGIC,IAAgBF,EAAY,CAACG,MAAkB;AACpD,YAAMC,IAAYR,EAAa;AAC/B,UAAI,CAACQ,EAAW;AAEhB,MADaA,EAAU,SAASD,CAAK,GAC/B,eAAe,EAAE,OAAO,UAAA,CAAW;AAAA,IAC1C,GAAG,CAAA,CAAE,GAECE,IAAS,CAACC,MAAc;AAC7B,MAAIpB,EAAMoB,CAAC,KAAGlB,EAAQF,EAAMoB,CAAC,CAAC;AAAA,IAC/B;AAmCA,WAjCAC,EAAoBf,GAAK,OAAO;AAAA,MAC/B,WAAW,CAAC,EAAE,OAAAgB,QAETlB,KAAkBQ,EAAoB,UAClCA,EAAoB,QAAQU,CAAK,IAEpCtB,EAAM,SACPsB,EAAM,QAAQ,aACjBd,EAAiB,CAACe,MAAS;AAC1B,cAAMC,KAAQD,IAAOvB,EAAM,SAAS,KAAKA,EAAM;AAC/C,eAAAgB,EAAcQ,CAAI,GACXA;AAAA,MACR,CAAC,GACM,MAEJF,EAAM,QAAQ,eACjBd,EAAiB,CAACe,MAAS;AAC1B,cAAMC,KAAQD,IAAO,KAAKvB,EAAM;AAChC,eAAAgB,EAAcQ,CAAI,GACXA;AAAA,MACR,CAAC,GACM,MAEJF,EAAM,QAAQ,WACjBH,EAAOZ,CAAa,GACb,MAED,KArBmB;AAAA,IAsB3B,EACC,GAEFkB,EAAU,MAAMjB,EAAiB,CAAC,GAAG,CAACR,CAAK,CAAC,GAEvCA,EAAM,SAGPI,2BAGA,UAAAA,EAAe;AAAA,MACf,OAAAJ;AAAA,MACA,OAAAC;AAAA,MACA,aAAaM;AAAA,MACb,UAAU,CAACmB,MAASxB,EAAQwB,CAAI;AAAA,MAChC,oBAAAb;AAAA,MACA,SAASR;AAAA,IAAA,CACT,GACF,IAKD,gBAAAsB,EAACC,KAAkB,KAAKlB,GACtB,YAAM,IAAI,CAACgB,GAAMN,MACjB,gBAAAO;AAAA,MAACE;AAAA,MAAA;AAAA,QAEA,WAAWT,MAAMb;AAAA,QACjB,cAAc,MAAMC,EAAiBY,CAAC;AAAA,QACtC,SAAS,MAAMD,EAAOC,CAAC;AAAA,QAEtB,cACAjB,EAAWuB,GAAMN,MAAMb,CAAa,IAEpC,gBAAAuB,EAAAC,GAAA,EACE,UAAA;AAAA,UAAAL,EAAK,YACL,gBAAAC,EAACK,GAAA,EAAc,KAAKN,EAAK,WAAW,KAAI,GAAA,CAAG,IAE3C,gBAAAC,EAACM,KACC,UAAAP,EAAK,MAAM,OAAO,CAAC,EAAE,eACvB;AAAA,UAED,gBAAAC,EAACO,GAAA,EAAc,UAAAR,EAAK,MAAA,CAAM;AAAA,UACzBA,EAAK,aAAa,4BACjBS,GAAA,EAAmB,SAAST,EAAK,SAAA,CAAU;AAAA,QAAA,EAAA,CAE9C;AAAA,MAAA;AAAA,MApBIA,EAAK;AAAA,IAAA,CAuBX,GACF,IA9CyB;AAAA,EAgD3B;AACD;AACA5B,EAAgB,cAAc;"}
+{"version":3,"file":"MentionDropdown.js","sources":["../../../../../src/editor/extensions/mention/MentionDropdown.tsx"],"sourcesContent":["import React, {\n\tforwardRef,\n\tuseCallback,\n\tuseEffect,\n\tuseImperativeHandle,\n\tuseRef,\n\tuseState,\n} from 'react';\nimport type {\n\tMentionDropdownRenderProps,\n\tMentionItem,\n} from '../../BikEditor.types';\nimport {\n\tDropdownContainer,\n\tDropdownItem,\n\tMentionAvatar,\n\tMentionAvatarFallback,\n\tMentionLabel,\n\tMentionPresenceDot,\n} from '../editorDropdown.styles';\n\ninterface Props {\n\titems: MentionItem[];\n\tquery: string;\n\tcommand: (item: MentionItem) => void;\n\t/** Custom per-row renderer. Receives the item and whether it is the active row. */\n\trenderItem?: (item: MentionItem, isActive: boolean) => React.ReactNode;\n\t/**\n\t * Full custom dropdown renderer. Takes priority over renderItem.\n\t * The editor passes activeIndex and onSelect — you handle all the visual rendering.\n\t */\n\trenderDropdown?: (props: MentionDropdownRenderProps) => React.ReactNode;\n\t/** Close the menu without selecting (strips the typed trigger). Injected by the extension. */\n\tdismiss?: () => void;\n}\n\nexport const MentionDropdown = forwardRef<any, Props>(\n\t({ items, query, command, renderItem, renderDropdown, dismiss }, ref) => {\n\t\tconst [selectedIndex, setSelectedIndex] = useState(0);\n\t\tconst containerRef = useRef<HTMLDivElement>(null);\n\t\t// A custom dropdown (renderDropdown) can claim keyboard nav for itself.\n\t\tconst customKeyHandlerRef = useRef<\n\t\t\t((event: KeyboardEvent) => boolean) | null\n\t\t>(null);\n\n\t\tconst registerKeyHandler = useCallback(\n\t\t\t(handler: ((event: KeyboardEvent) => boolean) | null) => {\n\t\t\t\tcustomKeyHandlerRef.current = handler;\n\t\t\t},\n\t\t\t[],\n\t\t);\n\n\t\tconst scrollToIndex = useCallback((index: number) => {\n\t\t\tconst container = containerRef.current;\n\t\t\tif (!container) return;\n\t\t\tconst item = container.children[index] as HTMLElement | undefined;\n\t\t\titem?.scrollIntoView({ block: 'nearest' });\n\t\t}, []);\n\n\t\tconst select = (i: number) => {\n\t\t\tif (items[i]) command(items[i]);\n\t\t};\n\n\t\tuseImperativeHandle(ref, () => ({\n\t\t\tonKeyDown: ({ event }: { event: KeyboardEvent }) => {\n\t\t\t\t// A custom dropdown that registered a handler owns navigation.\n\t\t\t\tif (renderDropdown && customKeyHandlerRef.current) {\n\t\t\t\t\treturn customKeyHandlerRef.current(event);\n\t\t\t\t}\n\t\t\t\tif (!items.length) return false;\n\t\t\t\tif (event.key === 'ArrowUp') {\n\t\t\t\t\tsetSelectedIndex((prev) => {\n\t\t\t\t\t\tconst next = (prev + items.length - 1) % items.length;\n\t\t\t\t\t\tscrollToIndex(next);\n\t\t\t\t\t\treturn next;\n\t\t\t\t\t});\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\tif (event.key === 'ArrowDown') {\n\t\t\t\t\tsetSelectedIndex((prev) => {\n\t\t\t\t\t\tconst next = (prev + 1) % items.length;\n\t\t\t\t\t\tscrollToIndex(next);\n\t\t\t\t\t\treturn next;\n\t\t\t\t\t});\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\tif (event.key === 'Enter') {\n\t\t\t\t\tselect(selectedIndex);\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\treturn false;\n\t\t\t},\n\t\t}));\n\n\t\tuseEffect(() => setSelectedIndex(0), [items]);\n\n\t\t// A custom dropdown owns its own empty state — it can have content even\n\t\t// with zero mention items (e.g. the agent-builder's variables-only mode) —\n\t\t// but only while the query is empty. Once a typed query filters to zero,\n\t\t// bail (unmounting the custom dropdown unregisters its key handler, so\n\t\t// Enter / arrows reach the editor again). Mirrors MentionExtension's\n\t\t// popup.hide() rule.\n\t\tif (!items.length && (!renderDropdown || query)) return null;\n\n\t\t// Full custom dropdown — editor still manages keyboard nav via selectedIndex\n\t\tif (renderDropdown) {\n\t\t\treturn (\n\t\t\t\t<>\n\t\t\t\t\t{renderDropdown({\n\t\t\t\t\t\titems,\n\t\t\t\t\t\tquery,\n\t\t\t\t\t\tactiveIndex: selectedIndex,\n\t\t\t\t\t\tonSelect: (item) => command(item),\n\t\t\t\t\t\tregisterKeyHandler,\n\t\t\t\t\t\tonClose: dismiss,\n\t\t\t\t\t})}\n\t\t\t\t</>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<DropdownContainer ref={containerRef}>\n\t\t\t\t{items.map((item, i) => (\n\t\t\t\t\t<DropdownItem\n\t\t\t\t\t\tkey={item.id}\n\t\t\t\t\t\t$isActive={i === selectedIndex}\n\t\t\t\t\t\tonMouseEnter={() => setSelectedIndex(i)}\n\t\t\t\t\t\tonClick={() => select(i)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{renderItem ? (\n\t\t\t\t\t\t\trenderItem(item, i === selectedIndex)\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t{item.avatarUrl ? (\n\t\t\t\t\t\t\t\t\t<MentionAvatar src={item.avatarUrl} alt=\"\" />\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<MentionAvatarFallback>\n\t\t\t\t\t\t\t\t\t\t{item.label.charAt(0).toUpperCase()}\n\t\t\t\t\t\t\t\t\t</MentionAvatarFallback>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t<MentionLabel>{item.label}</MentionLabel>\n\t\t\t\t\t\t\t\t{item.isOnline !== undefined && (\n\t\t\t\t\t\t\t\t\t<MentionPresenceDot $online={item.isOnline} />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</DropdownItem>\n\t\t\t\t))}\n\t\t\t</DropdownContainer>\n\t\t);\n\t},\n);\nMentionDropdown.displayName = 'MentionDropdown';\n"],"names":["MentionDropdown","forwardRef","items","query","command","renderItem","renderDropdown","dismiss","ref","selectedIndex","setSelectedIndex","useState","containerRef","useRef","customKeyHandlerRef","registerKeyHandler","useCallback","handler","scrollToIndex","index","container","select","i","useImperativeHandle","event","prev","next","useEffect","item","jsx","DropdownContainer","DropdownItem","jsxs","Fragment","MentionAvatar","MentionAvatarFallback","MentionLabel","MentionPresenceDot"],"mappings":";;;AAoCO,MAAMA,IAAkBC;AAAA,EAC9B,CAAC,EAAE,OAAAC,GAAO,OAAAC,GAAO,SAAAC,GAAS,YAAAC,GAAY,gBAAAC,GAAgB,SAAAC,EAAA,GAAWC,MAAQ;AACxE,UAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAS,CAAC,GAC9CC,IAAeC,EAAuB,IAAI,GAE1CC,IAAsBD,EAE1B,IAAI,GAEAE,IAAqBC;AAAA,MAC1B,CAACC,MAAwD;AACxD,QAAAH,EAAoB,UAAUG;AAAA,MAC/B;AAAA,MACA,CAAA;AAAA,IAAC,GAGIC,IAAgBF,EAAY,CAACG,MAAkB;AACpD,YAAMC,IAAYR,EAAa;AAC/B,UAAI,CAACQ,EAAW;AAEhB,MADaA,EAAU,SAASD,CAAK,GAC/B,eAAe,EAAE,OAAO,UAAA,CAAW;AAAA,IAC1C,GAAG,CAAA,CAAE,GAECE,IAAS,CAACC,MAAc;AAC7B,MAAIpB,EAAMoB,CAAC,KAAGlB,EAAQF,EAAMoB,CAAC,CAAC;AAAA,IAC/B;AAyCA,WAvCAC,EAAoBf,GAAK,OAAO;AAAA,MAC/B,WAAW,CAAC,EAAE,OAAAgB,QAETlB,KAAkBQ,EAAoB,UAClCA,EAAoB,QAAQU,CAAK,IAEpCtB,EAAM,SACPsB,EAAM,QAAQ,aACjBd,EAAiB,CAACe,MAAS;AAC1B,cAAMC,KAAQD,IAAOvB,EAAM,SAAS,KAAKA,EAAM;AAC/C,eAAAgB,EAAcQ,CAAI,GACXA;AAAA,MACR,CAAC,GACM,MAEJF,EAAM,QAAQ,eACjBd,EAAiB,CAACe,MAAS;AAC1B,cAAMC,KAAQD,IAAO,KAAKvB,EAAM;AAChC,eAAAgB,EAAcQ,CAAI,GACXA;AAAA,MACR,CAAC,GACM,MAEJF,EAAM,QAAQ,WACjBH,EAAOZ,CAAa,GACb,MAED,KArBmB;AAAA,IAsB3B,EACC,GAEFkB,EAAU,MAAMjB,EAAiB,CAAC,GAAG,CAACR,CAAK,CAAC,GAQxC,CAACA,EAAM,WAAW,CAACI,KAAkBH,KAAe,OAGpDG,2BAGA,UAAAA,EAAe;AAAA,MACf,OAAAJ;AAAA,MACA,OAAAC;AAAA,MACA,aAAaM;AAAA,MACb,UAAU,CAACmB,MAASxB,EAAQwB,CAAI;AAAA,MAChC,oBAAAb;AAAA,MACA,SAASR;AAAA,IAAA,CACT,GACF,IAKD,gBAAAsB,EAACC,KAAkB,KAAKlB,GACtB,YAAM,IAAI,CAACgB,GAAMN,MACjB,gBAAAO;AAAA,MAACE;AAAA,MAAA;AAAA,QAEA,WAAWT,MAAMb;AAAA,QACjB,cAAc,MAAMC,EAAiBY,CAAC;AAAA,QACtC,SAAS,MAAMD,EAAOC,CAAC;AAAA,QAEtB,cACAjB,EAAWuB,GAAMN,MAAMb,CAAa,IAEpC,gBAAAuB,EAAAC,GAAA,EACE,UAAA;AAAA,UAAAL,EAAK,YACL,gBAAAC,EAACK,GAAA,EAAc,KAAKN,EAAK,WAAW,KAAI,GAAA,CAAG,IAE3C,gBAAAC,EAACM,KACC,UAAAP,EAAK,MAAM,OAAO,CAAC,EAAE,eACvB;AAAA,UAED,gBAAAC,EAACO,GAAA,EAAc,UAAAR,EAAK,MAAA,CAAM;AAAA,UACzBA,EAAK,aAAa,4BACjBS,GAAA,EAAmB,SAAST,EAAK,SAAA,CAAU;AAAA,QAAA,EAAA,CAE9C;AAAA,MAAA;AAAA,MApBIA,EAAK;AAAA,IAAA,CAuBX,GACF;AAAA,EAEF;AACD;AACA5B,EAAgB,cAAc;"}

package/dist/esm/editor/extensions/mention/MentionExtension.js

@@ -2,10 +2,10 @@ import { mergeAttributes as f } from "../../../node_modules/@tiptap/core/dist/in
 import k from "@tiptap/extension-mention";
 import { ReactNodeViewRenderer as b, ReactRenderer as w } from "@tiptap/react";
 import { createSuggestionPopup as h } from "../suggestionPopup.js";
-import { buildMentionChipNodeView as p } from "./MentionChipNodeView.js";
-import { MentionDropdown as M } from "./MentionDropdown.js";
-function T(u, r) {
-  const { renderItem: d, renderDropdown: a, removeTriggerOnDismiss: c } = u;
+import { buildMentionChipNodeView as M } from "./MentionChipNodeView.js";
+import { MentionDropdown as p } from "./MentionDropdown.js";
+function T(a, r) {
+  const { renderItem: d, renderDropdown: u, removeTriggerOnDismiss: c } = a;
   return () => {
     let i, o, e, t = null;
     const s = () => {
@@ -16,8 +16,8 @@ function T(u, r) {
     };
     return {
       onStart: (n) => {
-        e = n, r.picked = !1, i = new w(M, {
-          props: { ...n, renderItem: d, renderDropdown: a, dismiss: s },
+        e = n, r.picked = !1, i = new w(p, {
+          props: { ...n, renderItem: d, renderDropdown: u, dismiss: s },
           editor: n.editor
         }), o = h(i.element, n.clientRect), t = (l) => {
           const m = l.target;
@@ -28,9 +28,9 @@ function T(u, r) {
         if (e = n, i.updateProps({
           ...n,
           renderItem: d,
-          renderDropdown: a,
+          renderDropdown: u,
           dismiss: s
-        }), !n.items?.length) {
+        }), !n.items?.length && (!u || n.query)) {
           o.hide();
           return;
         }
@@ -48,10 +48,10 @@ function T(u, r) {
     };
   };
 }
-function g(u, r, d, a, c, i) {
+function g(a, r, d, u, c, i) {
   const o = { picked: !1 };
   return k.extend({
-    name: u,
+    name: a,
     addAttributes() {
       return {
         ...this.parent?.(),
@@ -73,7 +73,7 @@ function g(u, r, d, a, c, i) {
     ...i.renderChipIcon ? {
       addNodeView() {
         return b(
-          p({
+          M({
             cssClass: r,
             char: d,
             renderChipIcon: i.renderChipIcon
@@ -96,12 +96,16 @@ function g(u, r, d, a, c, i) {
     suggestion: {
       char: d,
       allowSpaces: !0,
-      items: ({ query: e }) => a.current.filter(
+      // Chips are always followed by a ` ` (see MentionEditor's inserts),
+      // so U+00A0 must count as a valid prefix or an `@` typed / injected
+      // right after a chip never activates the suggestion (default: [' ']).
+      allowedPrefixes: [" ", " "],
+      items: ({ query: e }) => u.current.filter(
         (t) => t.label.toLowerCase().includes(e.toLowerCase())
       ),
       command: ({ editor: e, range: t, props: s }) => {
         o.picked = !0, e.chain().focus().deleteRange(t).insertContent({
-          type: u,
+          type: a,
           attrs: {
             id: s.id,
             label: s.label,
@@ -114,24 +118,24 @@ function g(u, r, d, a, c, i) {
     }
   });
 }
-function H(u, r, d, a, c, i) {
+function H(a, r, d, u, c, i) {
   return g(
     "mentionAgent",
     "bik-mention bik-mention--agent",
     "@",
-    u,
+    a,
     r,
-    { renderItem: d, renderDropdown: a, removeTriggerOnDismiss: c, renderChipIcon: i }
+    { renderItem: d, renderDropdown: u, removeTriggerOnDismiss: c, renderChipIcon: i }
   );
 }
-function S(u, r, d, a, c) {
+function S(a, r, d, u, c) {
   return g(
     "mentionTeam",
     "bik-mention bik-mention--team",
     "#",
-    u,
+    a,
     r,
-    { renderItem: d, renderDropdown: a, removeTriggerOnDismiss: c }
+    { renderItem: d, renderDropdown: u, removeTriggerOnDismiss: c }
   );
 }
 export {

package/dist/esm/editor/extensions/mention/MentionExtension.js.map

@@ -1 +1 @@
-{"version":3,"file":"MentionExtension.js","sources":["../../../../../src/editor/extensions/mention/MentionExtension.ts"],"sourcesContent":["import { mergeAttributes } from '@tiptap/core';\nimport Mention from '@tiptap/extension-mention';\nimport { ReactNodeViewRenderer, ReactRenderer } from '@tiptap/react';\nimport type { ReactNode } from 'react';\nimport type {\n\tMentionDropdownRenderProps,\n\tMentionItem,\n} from '../../BikEditor.types';\nimport {\n\tcreateSuggestionPopup,\n\ttype SuggestionPopup,\n} from '../suggestionPopup';\nimport { buildMentionChipNodeView } from './MentionChipNodeView';\nimport { MentionDropdown } from './MentionDropdown';\n\ninterface MentionBuildOptions {\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode;\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode;\n\t/** Remove the typed trigger char + query if the menu closes without a selection. */\n\tremoveTriggerOnDismiss?: boolean;\n\t/**\n\t * Leading glyph rendered inside the chip (e.g. a tool's source icon). Supplying\n\t * it switches the chip to a React node view; omit to keep the plain chip.\n\t */\n\trenderChipIcon?: (source: string | null, kind: string | null) => ReactNode;\n}\n\nfunction buildRender(\n\toptions: MentionBuildOptions,\n\tpickedRef: { picked: boolean },\n) {\n\tconst { renderItem, renderDropdown, removeTriggerOnDismiss } = options;\n\treturn () => {\n\t\tlet component: ReactRenderer;\n\t\tlet popup: SuggestionPopup;\n\t\tlet latestProps: any;\n\t\t// Closes the menu when the user clicks anywhere outside it. The `@` popup\n\t\t// lives on document.body (not inside the editor), so nothing dismisses it on\n\t\t// an outside click otherwise — only Escape / moving the cursor did.\n\t\tlet onDocMouseDown: ((event: MouseEvent) => void) | null = null;\n\n\t\t// Close the menu without a selection: drop the typed \"@query\" so no orphan\n\t\t// trigger is left, and mark as picked so onExit doesn't delete it twice.\n\t\tconst dismiss = () => {\n\t\t\tpickedRef.picked = true;\n\t\t\tif (latestProps?.editor && latestProps?.range) {\n\t\t\t\tconst { editor, range } = latestProps;\n\t\t\t\teditor.chain().focus().deleteRange(range).run();\n\t\t\t}\n\t\t};\n\n\t\treturn {\n\t\t\tonStart: (props: any) => {\n\t\t\t\tlatestProps = props;\n\t\t\t\tpickedRef.picked = false;\n\t\t\t\tcomponent = new ReactRenderer(MentionDropdown, {\n\t\t\t\t\tprops: { ...props, renderItem, renderDropdown, dismiss },\n\t\t\t\t\teditor: props.editor,\n\t\t\t\t});\n\t\t\t\tpopup = createSuggestionPopup(component.element, props.clientRect);\n\t\t\t\tonDocMouseDown = (event: MouseEvent) => {\n\t\t\t\t\tconst target = event.target as Node | null;\n\t\t\t\t\tif (!target) return;\n\t\t\t\t\t// Inside the picker → keep open (row clicks fire on `click`).\n\t\t\t\t\tif (popup.element.contains(target)) return;\n\t\t\t\t\t// Inside the editor → the suggestion plugin already closes it.\n\t\t\t\t\tconst editorDom = latestProps?.editor?.view?.dom as\n\t\t\t\t\t\t| HTMLElement\n\t\t\t\t\t\t| undefined;\n\t\t\t\t\tif (editorDom?.contains(target)) return;\n\t\t\t\t\t// Anywhere else → drop the typed \"@query\" (no refocus — clicking\n\t\t\t\t\t// away shouldn't yank focus back) and close.\n\t\t\t\t\tpickedRef.picked = true;\n\t\t\t\t\tif (latestProps?.editor && latestProps?.range) {\n\t\t\t\t\t\tlatestProps.editor.chain().deleteRange(latestProps.range).run();\n\t\t\t\t\t}\n\t\t\t\t\tpopup.hide();\n\t\t\t\t};\n\t\t\t\tdocument.addEventListener('mousedown', onDocMouseDown);\n\t\t\t},\n\t\t\tonUpdate: (props: any) => {\n\t\t\t\tlatestProps = props;\n\t\t\t\tcomponent.updateProps({\n\t\t\t\t\t...props,\n\t\t\t\t\trenderItem,\n\t\t\t\t\trenderDropdown,\n\t\t\t\t\tdismiss,\n\t\t\t\t});\n\t\t\t\tif (!props.items?.length) {\n\t\t\t\t\tpopup.hide();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tpopup.show();\n\t\t\t\tpopup.updatePosition(props.clientRect);\n\t\t\t},\n\t\t\tonKeyDown: (props: any) => {\n\t\t\t\tif (props.event.key === 'Escape') {\n\t\t\t\t\tpopup.hide();\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\treturn (component.ref as any)?.onKeyDown(props) ?? false;\n\t\t\t},\n\t\t\tonExit: () => {\n\t\t\t\tif (onDocMouseDown) {\n\t\t\t\t\tdocument.removeEventListener('mousedown', onDocMouseDown);\n\t\t\t\t\tonDocMouseDown = null;\n\t\t\t\t}\n\t\t\t\tpopup.destroy();\n\t\t\t\tcomponent.destroy();\n\t\t\t\t// Nothing was picked → strip the orphan \"@query\" the user typed.\n\t\t\t\tif (\n\t\t\t\t\tremoveTriggerOnDismiss &&\n\t\t\t\t\t!pickedRef.picked &&\n\t\t\t\t\tlatestProps?.editor &&\n\t\t\t\t\tlatestProps?.range\n\t\t\t\t) {\n\t\t\t\t\tconst { editor, range } = latestProps;\n\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\tif (!editor.isDestroyed) {\n\t\t\t\t\t\t\teditor.chain().deleteRange(range).run();\n\t\t\t\t\t\t}\n\t\t\t\t\t}, 0);\n\t\t\t\t}\n\t\t\t},\n\t\t};\n\t};\n}\n\n/**\n * Builds a TipTap Mention extension.\n *\n * Each inserted node carries an optional `kind` attribute. When set, the chip is\n * rendered WITHOUT the trigger char (the `label` already encodes the full text)\n * and a `data-kind` attribute is emitted so CSS can colour it per kind. When\n * `kind` is null the legacy `${char}${label}` chip is rendered (back-compatible).\n */\nfunction buildMentionExtension(\n\tname: 'mentionAgent' | 'mentionTeam',\n\tcssClass: string,\n\tchar: '@' | '#',\n\titemsRef: { current: MentionItem[] },\n\tonSelect: ((item: MentionItem, char: '@' | '#') => void) | undefined,\n\toptions: MentionBuildOptions,\n) {\n\tconst pickedRef = { picked: false };\n\n\treturn Mention.extend({\n\t\tname,\n\t\taddAttributes() {\n\t\t\treturn {\n\t\t\t\t...this.parent?.(),\n\t\t\t\tkind: {\n\t\t\t\t\tdefault: null,\n\t\t\t\t\tparseHTML: (el: HTMLElement) => el.getAttribute('data-kind'),\n\t\t\t\t\trenderHTML: (attrs: Record<string, unknown>) =>\n\t\t\t\t\t\tattrs['kind'] ? { 'data-kind': String(attrs['kind']) } : {},\n\t\t\t\t},\n\t\t\t\t// Tool source bucket (manifest / shopify / …); drives the chip icon.\n\t\t\t\tsource: {\n\t\t\t\t\tdefault: null,\n\t\t\t\t\tparseHTML: (el: HTMLElement) => el.getAttribute('data-source'),\n\t\t\t\t\trenderHTML: (attrs: Record<string, unknown>) =>\n\t\t\t\t\t\tattrs['source'] ? { 'data-source': String(attrs['source']) } : {},\n\t\t\t\t},\n\t\t\t};\n\t\t},\n\t\t// A React chip (with the leading source icon) only when the consumer asks for\n\t\t// it — otherwise the plain renderHTML chip is kept (unchanged for CRM etc.).\n\t\t...(options.renderChipIcon\n\t\t\t? {\n\t\t\t\t\taddNodeView() {\n\t\t\t\t\t\treturn ReactNodeViewRenderer(\n\t\t\t\t\t\t\tbuildMentionChipNodeView({\n\t\t\t\t\t\t\t\tcssClass,\n\t\t\t\t\t\t\t\tchar,\n\t\t\t\t\t\t\t\trenderChipIcon: options.renderChipIcon,\n\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t);\n\t\t\t\t\t},\n\t\t\t  }\n\t\t\t: {}),\n\t}).configure({\n\t\tHTMLAttributes: { class: cssClass },\n\t\trenderText: ({ options: opt, node }: any) =>\n\t\t\t`${node.attrs['kind'] ? '' : opt.suggestion.char}${node.attrs['label']}`,\n\t\trenderHTML: ({ options: opt, node }: any) => [\n\t\t\t'span',\n\t\t\tmergeAttributes(\n\t\t\t\topt.HTMLAttributes,\n\t\t\t\tnode.attrs['kind'] ? { 'data-kind': String(node.attrs['kind']) } : {},\n\t\t\t\tnode.attrs['source']\n\t\t\t\t\t? { 'data-source': String(node.attrs['source']) }\n\t\t\t\t\t: {},\n\t\t\t),\n\t\t\t`${node.attrs['kind'] ? '' : opt.suggestion.char}${node.attrs['label']}`,\n\t\t],\n\t\tsuggestion: {\n\t\t\tchar,\n\t\t\tallowSpaces: true,\n\t\t\titems: ({ query }: { query: string }) =>\n\t\t\t\titemsRef.current.filter((a) =>\n\t\t\t\t\ta.label.toLowerCase().includes(query.toLowerCase()),\n\t\t\t\t),\n\t\t\tcommand: ({ editor, range, props }: any) => {\n\t\t\t\tpickedRef.picked = true;\n\t\t\t\teditor\n\t\t\t\t\t.chain()\n\t\t\t\t\t.focus()\n\t\t\t\t\t.deleteRange(range)\n\t\t\t\t\t.insertContent({\n\t\t\t\t\t\ttype: name,\n\t\t\t\t\t\tattrs: {\n\t\t\t\t\t\t\tid: props.id,\n\t\t\t\t\t\t\tlabel: props.label,\n\t\t\t\t\t\t\tkind: props.meta?.kind ?? null,\n\t\t\t\t\t\t\tsource: props.meta?.source ?? null,\n\t\t\t\t\t\t},\n\t\t\t\t\t})\n\t\t\t\t\t.run();\n\t\t\t\tonSelect?.(props, char);\n\t\t\t},\n\t\t\trender: buildRender(options, pickedRef),\n\t\t},\n\t});\n}\n\nexport function buildAgentMentionExtension(\n\tagentsRef: { current: MentionItem[] },\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n\tremoveTriggerOnDismiss?: boolean,\n\trenderChipIcon?: (source: string | null, kind: string | null) => ReactNode,\n) {\n\treturn buildMentionExtension(\n\t\t'mentionAgent',\n\t\t'bik-mention bik-mention--agent',\n\t\t'@',\n\t\tagentsRef,\n\t\tonSelect,\n\t\t{ renderItem, renderDropdown, removeTriggerOnDismiss, renderChipIcon },\n\t);\n}\n\nexport function buildTeamMentionExtension(\n\tteamsRef: { current: MentionItem[] },\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n\tremoveTriggerOnDismiss?: boolean,\n) {\n\treturn buildMentionExtension(\n\t\t'mentionTeam',\n\t\t'bik-mention bik-mention--team',\n\t\t'#',\n\t\tteamsRef,\n\t\tonSelect,\n\t\t{ renderItem, renderDropdown, removeTriggerOnDismiss },\n\t);\n}\n"],"names":["buildRender","options","pickedRef","renderItem","renderDropdown","removeTriggerOnDismiss","component","popup","latestProps","onDocMouseDown","dismiss","editor","range","props","ReactRenderer","MentionDropdown","createSuggestionPopup","event","target","buildMentionExtension","name","cssClass","char","itemsRef","onSelect","Mention","el","attrs","ReactNodeViewRenderer","buildMentionChipNodeView","opt","node","mergeAttributes","query","a","buildAgentMentionExtension","agentsRef","renderChipIcon","buildTeamMentionExtension","teamsRef"],"mappings":"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"}
+{"version":3,"file":"MentionExtension.js","sources":["../../../../../src/editor/extensions/mention/MentionExtension.ts"],"sourcesContent":["import { mergeAttributes } from '@tiptap/core';\nimport Mention from '@tiptap/extension-mention';\nimport { ReactNodeViewRenderer, ReactRenderer } from '@tiptap/react';\nimport type { ReactNode } from 'react';\nimport type {\n\tMentionDropdownRenderProps,\n\tMentionItem,\n} from '../../BikEditor.types';\nimport {\n\tcreateSuggestionPopup,\n\ttype SuggestionPopup,\n} from '../suggestionPopup';\nimport { buildMentionChipNodeView } from './MentionChipNodeView';\nimport { MentionDropdown } from './MentionDropdown';\n\ninterface MentionBuildOptions {\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode;\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode;\n\t/** Remove the typed trigger char + query if the menu closes without a selection. */\n\tremoveTriggerOnDismiss?: boolean;\n\t/**\n\t * Leading glyph rendered inside the chip (e.g. a tool's source icon). Supplying\n\t * it switches the chip to a React node view; omit to keep the plain chip.\n\t */\n\trenderChipIcon?: (source: string | null, kind: string | null) => ReactNode;\n}\n\nfunction buildRender(\n\toptions: MentionBuildOptions,\n\tpickedRef: { picked: boolean },\n) {\n\tconst { renderItem, renderDropdown, removeTriggerOnDismiss } = options;\n\treturn () => {\n\t\tlet component: ReactRenderer;\n\t\tlet popup: SuggestionPopup;\n\t\tlet latestProps: any;\n\t\t// Closes the menu when the user clicks anywhere outside it. The `@` popup\n\t\t// lives on document.body (not inside the editor), so nothing dismisses it on\n\t\t// an outside click otherwise — only Escape / moving the cursor did.\n\t\tlet onDocMouseDown: ((event: MouseEvent) => void) | null = null;\n\n\t\t// Close the menu without a selection: drop the typed \"@query\" so no orphan\n\t\t// trigger is left, and mark as picked so onExit doesn't delete it twice.\n\t\tconst dismiss = () => {\n\t\t\tpickedRef.picked = true;\n\t\t\tif (latestProps?.editor && latestProps?.range) {\n\t\t\t\tconst { editor, range } = latestProps;\n\t\t\t\teditor.chain().focus().deleteRange(range).run();\n\t\t\t}\n\t\t};\n\n\t\treturn {\n\t\t\tonStart: (props: any) => {\n\t\t\t\tlatestProps = props;\n\t\t\t\tpickedRef.picked = false;\n\t\t\t\tcomponent = new ReactRenderer(MentionDropdown, {\n\t\t\t\t\tprops: { ...props, renderItem, renderDropdown, dismiss },\n\t\t\t\t\teditor: props.editor,\n\t\t\t\t});\n\t\t\t\tpopup = createSuggestionPopup(component.element, props.clientRect);\n\t\t\t\tonDocMouseDown = (event: MouseEvent) => {\n\t\t\t\t\tconst target = event.target as Node | null;\n\t\t\t\t\tif (!target) return;\n\t\t\t\t\t// Inside the picker → keep open (row clicks fire on `click`).\n\t\t\t\t\tif (popup.element.contains(target)) return;\n\t\t\t\t\t// Inside the editor → the suggestion plugin already closes it.\n\t\t\t\t\tconst editorDom = latestProps?.editor?.view?.dom as\n\t\t\t\t\t\t| HTMLElement\n\t\t\t\t\t\t| undefined;\n\t\t\t\t\tif (editorDom?.contains(target)) return;\n\t\t\t\t\t// Anywhere else → drop the typed \"@query\" (no refocus — clicking\n\t\t\t\t\t// away shouldn't yank focus back) and close.\n\t\t\t\t\tpickedRef.picked = true;\n\t\t\t\t\tif (latestProps?.editor && latestProps?.range) {\n\t\t\t\t\t\tlatestProps.editor.chain().deleteRange(latestProps.range).run();\n\t\t\t\t\t}\n\t\t\t\t\tpopup.hide();\n\t\t\t\t};\n\t\t\t\tdocument.addEventListener('mousedown', onDocMouseDown);\n\t\t\t},\n\t\t\tonUpdate: (props: any) => {\n\t\t\t\tlatestProps = props;\n\t\t\t\tcomponent.updateProps({\n\t\t\t\t\t...props,\n\t\t\t\t\trenderItem,\n\t\t\t\t\trenderDropdown,\n\t\t\t\t\tdismiss,\n\t\t\t\t});\n\t\t\t\t// Empty result list closes the dropdown — EXCEPT a custom dropdown\n\t\t\t\t// (renderDropdown) with an empty QUERY: it may have content of its\n\t\t\t\t// own with zero items (the agent-builder's variables-only mode).\n\t\t\t\t// Once the user has typed a query that matches nothing, hide — the\n\t\t\t\t// picker must not float over (and steal keys from) ordinary typing.\n\t\t\t\tif (!props.items?.length && (!renderDropdown || props.query)) {\n\t\t\t\t\tpopup.hide();\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tpopup.show();\n\t\t\t\tpopup.updatePosition(props.clientRect);\n\t\t\t},\n\t\t\tonKeyDown: (props: any) => {\n\t\t\t\tif (props.event.key === 'Escape') {\n\t\t\t\t\tpopup.hide();\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\t\t\t\treturn (component.ref as any)?.onKeyDown(props) ?? false;\n\t\t\t},\n\t\t\tonExit: () => {\n\t\t\t\tif (onDocMouseDown) {\n\t\t\t\t\tdocument.removeEventListener('mousedown', onDocMouseDown);\n\t\t\t\t\tonDocMouseDown = null;\n\t\t\t\t}\n\t\t\t\tpopup.destroy();\n\t\t\t\tcomponent.destroy();\n\t\t\t\t// Nothing was picked → strip the orphan \"@query\" the user typed.\n\t\t\t\tif (\n\t\t\t\t\tremoveTriggerOnDismiss &&\n\t\t\t\t\t!pickedRef.picked &&\n\t\t\t\t\tlatestProps?.editor &&\n\t\t\t\t\tlatestProps?.range\n\t\t\t\t) {\n\t\t\t\t\tconst { editor, range } = latestProps;\n\t\t\t\t\tsetTimeout(() => {\n\t\t\t\t\t\tif (!editor.isDestroyed) {\n\t\t\t\t\t\t\teditor.chain().deleteRange(range).run();\n\t\t\t\t\t\t}\n\t\t\t\t\t}, 0);\n\t\t\t\t}\n\t\t\t},\n\t\t};\n\t};\n}\n\n/**\n * Builds a TipTap Mention extension.\n *\n * Each inserted node carries an optional `kind` attribute. When set, the chip is\n * rendered WITHOUT the trigger char (the `label` already encodes the full text)\n * and a `data-kind` attribute is emitted so CSS can colour it per kind. When\n * `kind` is null the legacy `${char}${label}` chip is rendered (back-compatible).\n */\nfunction buildMentionExtension(\n\tname: 'mentionAgent' | 'mentionTeam',\n\tcssClass: string,\n\tchar: '@' | '#',\n\titemsRef: { current: MentionItem[] },\n\tonSelect: ((item: MentionItem, char: '@' | '#') => void) | undefined,\n\toptions: MentionBuildOptions,\n) {\n\tconst pickedRef = { picked: false };\n\n\treturn Mention.extend({\n\t\tname,\n\t\taddAttributes() {\n\t\t\treturn {\n\t\t\t\t...this.parent?.(),\n\t\t\t\tkind: {\n\t\t\t\t\tdefault: null,\n\t\t\t\t\tparseHTML: (el: HTMLElement) => el.getAttribute('data-kind'),\n\t\t\t\t\trenderHTML: (attrs: Record<string, unknown>) =>\n\t\t\t\t\t\tattrs['kind'] ? { 'data-kind': String(attrs['kind']) } : {},\n\t\t\t\t},\n\t\t\t\t// Tool source bucket (manifest / shopify / …); drives the chip icon.\n\t\t\t\tsource: {\n\t\t\t\t\tdefault: null,\n\t\t\t\t\tparseHTML: (el: HTMLElement) => el.getAttribute('data-source'),\n\t\t\t\t\trenderHTML: (attrs: Record<string, unknown>) =>\n\t\t\t\t\t\tattrs['source'] ? { 'data-source': String(attrs['source']) } : {},\n\t\t\t\t},\n\t\t\t};\n\t\t},\n\t\t// A React chip (with the leading source icon) only when the consumer asks for\n\t\t// it — otherwise the plain renderHTML chip is kept (unchanged for CRM etc.).\n\t\t...(options.renderChipIcon\n\t\t\t? {\n\t\t\t\t\taddNodeView() {\n\t\t\t\t\t\treturn ReactNodeViewRenderer(\n\t\t\t\t\t\t\tbuildMentionChipNodeView({\n\t\t\t\t\t\t\t\tcssClass,\n\t\t\t\t\t\t\t\tchar,\n\t\t\t\t\t\t\t\trenderChipIcon: options.renderChipIcon,\n\t\t\t\t\t\t\t}),\n\t\t\t\t\t\t);\n\t\t\t\t\t},\n\t\t\t  }\n\t\t\t: {}),\n\t}).configure({\n\t\tHTMLAttributes: { class: cssClass },\n\t\trenderText: ({ options: opt, node }: any) =>\n\t\t\t`${node.attrs['kind'] ? '' : opt.suggestion.char}${node.attrs['label']}`,\n\t\trenderHTML: ({ options: opt, node }: any) => [\n\t\t\t'span',\n\t\t\tmergeAttributes(\n\t\t\t\topt.HTMLAttributes,\n\t\t\t\tnode.attrs['kind'] ? { 'data-kind': String(node.attrs['kind']) } : {},\n\t\t\t\tnode.attrs['source']\n\t\t\t\t\t? { 'data-source': String(node.attrs['source']) }\n\t\t\t\t\t: {},\n\t\t\t),\n\t\t\t`${node.attrs['kind'] ? '' : opt.suggestion.char}${node.attrs['label']}`,\n\t\t],\n\t\tsuggestion: {\n\t\t\tchar,\n\t\t\tallowSpaces: true,\n\t\t\t// Chips are always followed by a `&nbsp;` (see MentionEditor's inserts),\n\t\t\t// so U+00A0 must count as a valid prefix or an `@` typed / injected\n\t\t\t// right after a chip never activates the suggestion (default: [' ']).\n\t\t\tallowedPrefixes: [' ', '\\u00a0'],\n\t\t\titems: ({ query }: { query: string }) =>\n\t\t\t\titemsRef.current.filter((a) =>\n\t\t\t\t\ta.label.toLowerCase().includes(query.toLowerCase()),\n\t\t\t\t),\n\t\t\tcommand: ({ editor, range, props }: any) => {\n\t\t\t\tpickedRef.picked = true;\n\t\t\t\teditor\n\t\t\t\t\t.chain()\n\t\t\t\t\t.focus()\n\t\t\t\t\t.deleteRange(range)\n\t\t\t\t\t.insertContent({\n\t\t\t\t\t\ttype: name,\n\t\t\t\t\t\tattrs: {\n\t\t\t\t\t\t\tid: props.id,\n\t\t\t\t\t\t\tlabel: props.label,\n\t\t\t\t\t\t\tkind: props.meta?.kind ?? null,\n\t\t\t\t\t\t\tsource: props.meta?.source ?? null,\n\t\t\t\t\t\t},\n\t\t\t\t\t})\n\t\t\t\t\t.run();\n\t\t\t\tonSelect?.(props, char);\n\t\t\t},\n\t\t\trender: buildRender(options, pickedRef),\n\t\t},\n\t});\n}\n\nexport function buildAgentMentionExtension(\n\tagentsRef: { current: MentionItem[] },\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n\tremoveTriggerOnDismiss?: boolean,\n\trenderChipIcon?: (source: string | null, kind: string | null) => ReactNode,\n) {\n\treturn buildMentionExtension(\n\t\t'mentionAgent',\n\t\t'bik-mention bik-mention--agent',\n\t\t'@',\n\t\tagentsRef,\n\t\tonSelect,\n\t\t{ renderItem, renderDropdown, removeTriggerOnDismiss, renderChipIcon },\n\t);\n}\n\nexport function buildTeamMentionExtension(\n\tteamsRef: { current: MentionItem[] },\n\tonSelect?: (item: MentionItem, char: '@' | '#') => void,\n\trenderItem?: (item: MentionItem, isActive: boolean) => ReactNode,\n\trenderDropdown?: (props: MentionDropdownRenderProps) => ReactNode,\n\tremoveTriggerOnDismiss?: boolean,\n) {\n\treturn buildMentionExtension(\n\t\t'mentionTeam',\n\t\t'bik-mention bik-mention--team',\n\t\t'#',\n\t\tteamsRef,\n\t\tonSelect,\n\t\t{ renderItem, renderDropdown, removeTriggerOnDismiss },\n\t);\n}\n"],"names":["buildRender","options","pickedRef","renderItem","renderDropdown","removeTriggerOnDismiss","component","popup","latestProps","onDocMouseDown","dismiss","editor","range","props","ReactRenderer","MentionDropdown","createSuggestionPopup","event","target","buildMentionExtension","name","cssClass","char","itemsRef","onSelect","Mention","el","attrs","ReactNodeViewRenderer","buildMentionChipNodeView","opt","node","mergeAttributes","query","a","buildAgentMentionExtension","agentsRef","renderChipIcon","buildTeamMentionExtension","teamsRef"],"mappings":"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"}

package/dist/esm/icons/index.d.ts

@@ -1,44 +1,44 @@
-export { Send, Activate, Code, Cross, Deactivate, Delete, Edit, Forward, Fullscreen, LinkSimpleHorizontal, Minus, Plus, ProductTour, RestApi, Save, SendAirplane, ShareAndroid, Shortcut, Task } from './Actions/Common actions';
-export { CheckboxIcon, Copy, DecreaseIndent, Dropdown, IncreaseIndent, MultiLine, MultiSelect, Number, NumberList, Quotes, Subscript, Superscript, TextBold, Text, TextAlignCenter, TextAlignLeft, TextAlignRight, TextItalics, TextJustify, TextStrikethrough, TextUnderline, Textbox } from './Actions/Formatting';
-export { ArrowRedo, ArrowUndo, LogIn, LogOut, OpenNewWindow, Refresh, Rewind, Sync, Whatsapp } from './Actions/Navigation';
+export { Send, Activate, Code, Cross, Deactivate, Delete, Edit, Forward, Fullscreen, LinkSimpleHorizontal, Minus, Plus, ProductTour, RestApi, Save, SendAirplane, ShareAndroid, Shortcut, Task, } from './Actions/Common actions';
+export { CheckboxIcon, Copy, DecreaseIndent, Dropdown, IncreaseIndent, MultiLine, MultiSelect, Number, NumberList, Quotes, Subscript, Superscript, TextBold, Text, TextAlignCenter, TextAlignLeft, TextAlignRight, TextItalics, TextJustify, TextStrikethrough, TextUnderline, Textbox, } from './Actions/Formatting';
+export { ArrowRedo, ArrowUndo, LogIn, LogOut, OpenNewWindow, Refresh, Rewind, Sync, Whatsapp, } from './Actions/Navigation';
 export { HandleDrag, SingleChoice } from './Actions/Selection';
 export { CaratDown, CaratLeft, CaratRight, CaratUp } from './Arrows/Carat';
-export { ChevronDown, ChevronLeft, ChevronRight, ChevronUp } from './Arrows/Chevron';
-export { ChevronDoubleDown, ChevronDoubleLeft, ChevronDoubleRight, ChevronDoubleUp } from './Arrows/Double chevron';
-export { ArrowDown, ArrowDownLeft, ArrowDownRight, ArrowLeft, ArrowRight, ArrowUp, ArrowUpLeft, ArrowUpRight } from './Arrows/Normal arrows';
+export { ChevronDown, ChevronLeft, ChevronRight, ChevronUp, } from './Arrows/Chevron';
+export { ChevronDoubleDown, ChevronDoubleLeft, ChevronDoubleRight, ChevronDoubleUp, } from './Arrows/Double chevron';
+export { ArrowDown, ArrowDownLeft, ArrowDownRight, ArrowLeft, ArrowRight, ArrowUp, ArrowUpLeft, ArrowUpRight, } from './Arrows/Normal arrows';
 export { ArrowSwitch } from './Arrows/Special';
-export { AiVoice, AiIcon, Webhook, AiAgent, AiEmoji, AiRobot, Expand, Frame27389, Frame27597, Frame27598, Frame27599, GeminiSparkle, ManifestSparkle, PricePlease, Shape, Shorter, Sparkling2Line, WandSparkles, Write } from './BIK AI specific';
-export { Shield, ShieldOutline, Bell, BellSync, Bulb, Forms, MenuHamburger, MessageSearch, MoreHorizontal, MoreVertical, Placeholder, Search, Settings, Training } from './Informational/Common UI';
-export { Chat, ChatCheck, ChatQuestion, ChatStar, Email, LiveChat, Phone } from './Informational/Communication';
-export { ClipboardCheck, Experimental, Help, Percent, Purchase, Services, ShoppingCart, Unsatisfactory, UserSound } from './Informational/Customer intent';
+export { AiVoice, AiIcon, Webhook, AiAgent, AiEmoji, AiRobot, Expand, Frame27389, Frame27597, Frame27598, Frame27599, GeminiSparkle, ManifestSparkle, PricePlease, Shape, Shorter, Sparkling2Line, WandSparkles, Write, } from './BIK AI specific';
+export { Shield, ShieldOutline, Bell, BellSync, Bulb, Forms, MenuHamburger, MessageSearch, MoreHorizontal, MoreVertical, Placeholder, Search, Settings, Training, } from './Informational/Common UI';
+export { Chat, ChatCheck, ChatQuestion, ChatStar, Email, LiveChat, Phone, } from './Informational/Communication';
+export { ClipboardCheck, Experimental, Help, Percent, Purchase, Services, ShoppingCart, Unsatisfactory, UserSound, } from './Informational/Customer intent';
 export { SingleChoice as SingleChoice2 } from './Informational/Customer intent';
-export { CalendarCheck, Calendar, CalendarAdd, Clock, HourGlass, WorkingHours } from './Informational/Date and time';
-export { AddLabel, Click, Filter, Gift1, GiftMinus, GiftPlus, Promocode, Receipt, ShieldCheck, ShoppingBag, ShoppingBasket } from './Informational/eCommerce';
+export { CalendarCheck, Calendar, CalendarAdd, Clock, HourGlass, WorkingHours, } from './Informational/Date and time';
+export { AddLabel, Click, Filter, Gift1, GiftMinus, GiftPlus, Promocode, Receipt, ShieldCheck, ShoppingBag, ShoppingBasket, } from './Informational/eCommerce';
 export { ShoppingCart as ShoppingCart2 } from './Informational/eCommerce';
-export { Archive1, Excel, File, FileCsv, FilePage, FilePdf, Folder, MediaMessage, Move, OrderHistory, PrivateNote, TextMessage, Unarchive } from './Informational/Files and folders';
-export { Bank, CashOnDelivery, ChartLine, CreditCard, Growth, Money1, NoCredits, Rupee, TablerTicket, Wallet } from './Informational/Finance';
+export { Archive1, Excel, File, FileCsv, FilePage, FilePdf, Folder, MediaMessage, Move, OrderHistory, PrivateNote, TextMessage, Unarchive, } from './Informational/Files and folders';
+export { Bank, CashOnDelivery, ChartLine, CreditCard, Growth, Money1, NoCredits, Rupee, TablerTicket, Wallet, } from './Informational/Finance';
 export { Percent as Percent2 } from './Informational/Finance';
-export { BookOpenText, TicketV2, AlertTriangle, Check, CheckDouble, CloseTicket1, Error, FailDoc, HourglassFilled, IcList, Info, Merge, NewTicket, RoundCheck, Slash } from './Informational/General';
+export { BookOpenText, TicketV2, AlertTriangle, Check, CheckDouble, CloseTicket1, Error, FailDoc, HourglassFilled, IcList, Info, Merge, NewTicket, RoundCheck, Slash, } from './Informational/General';
 export { Help as Help2 } from './Informational/General';
-export { PuzzlePiece, User, Chatbot, Contacts, Group, IdCard, Person, Robot, Union, Union1, UserMinus1, UserPlus } from './Informational/Identity';
-export { Address, LanguageChange, MapPin, Truck } from './Informational/Location';
-export { AllProduct, Clipboard, CustomerReport, Head112, InventoryReport, LegalBalance, OrderReport, PaymentReport, Store, StoreSync, TicketForm } from './Informational/Store related';
+export { PuzzlePiece, User, Chatbot, Contacts, Group, IdCard, Person, Robot, Union, Union1, UserMinus1, UserPlus, } from './Informational/Identity';
+export { Address, LanguageChange, MapPin, Truck, } from './Informational/Location';
+export { AllProduct, Clipboard, CustomerReport, Head112, InventoryReport, LegalBalance, OrderReport, PaymentReport, Store, StoreSync, TicketForm, } from './Informational/Store related';
 export { ClipboardCheck as ClipboardCheck2 } from './Informational/Store related';
 export { Box, Box2 } from './Legacy - Bikayi specific/Categories';
 export { Journeys } from './Legacy - Bikayi specific/Navigation';
 export { Services as Services2 } from './Legacy - Bikayi specific/Navigation';
 export { PlanUltimate } from './Legacy - Bikayi specific/Plans';
-export { Businesscard, Customdomain, LoudSpeaker, Marketing, PaymentLink, Theme } from './Legacy - Bikayi specific/Services';
-export { Microphone, Pause, Play, Sleep, VolumeMute, VolumeOneline, VolumeTwoline } from './Media/Audio';
+export { Businesscard, Customdomain, LoudSpeaker, Marketing, PaymentLink, Theme, } from './Legacy - Bikayi specific/Services';
+export { Microphone, Pause, Play, Sleep, VolumeMute, VolumeOneline, VolumeTwoline, } from './Media/Audio';
 export { Desktop, Smartphone } from './Media/Devices';
-export { BarcodeScan, Download, EmojiSmile, Paperclip, Upload } from './Media/Others';
-export { Frame26086263, Camera, CameraAdd, Crop, FlashOff, FlashOn, FormkitHappy, FormkitNeutral, FormkitSad, IconTrailing, Image, ImageAdd, Images, Maximize, RotateAnticlockwise, RotateClockwise, VideoCamcorder, VideoFilm } from './Media/Visual';
-export { EmailMarketingV2, EmailV2, FacebookCommentV2, FacebookV2, GmailV2, InstagramCommentV2, InstagramV2, MessengerV2, PhoneV2, RcsV2, SmsV2, TaskV2, WebpushV2, WhatsAppCallV2, WhatsAppV2, Bigcommerce, EmailMarketing, Facebook, FacebookComment, FreshdeskApp, Instagram, InstagramIcon, Messenger, MonoFacebookComment, MonoFacebook, MonoInstagram, MonoInstagramComment, MonoMail, MonoMessenger, MonoPhone, MonoTasks, MonoWhatsapp, ShopifyBrand, Tasks, WebPush, WhatsApp } from './Social/Channels';
+export { BarcodeScan, Download, EmojiSmile, Paperclip, Upload, } from './Media/Others';
+export { Frame26086263, Camera, CameraAdd, Crop, FlashOff, FlashOn, FormkitHappy, FormkitNeutral, FormkitSad, IconTrailing, Image, ImageAdd, Images, Maximize, RotateAnticlockwise, RotateClockwise, VideoCamcorder, VideoFilm, } from './Media/Visual';
+export { EmailMarketingV2, EmailV2, FacebookCommentV2, FacebookV2, GmailV2, InstagramCommentV2, InstagramV2, MessengerV2, PhoneV2, RcsV2, SmsV2, TaskV2, WebpushV2, WhatsAppCallV2, WhatsAppV2, Bigcommerce, EmailMarketing, Facebook, FacebookComment, FreshdeskApp, Instagram, InstagramIcon, Messenger, MonoFacebookComment, MonoFacebook, MonoInstagram, MonoInstagramComment, MonoMail, MonoMessenger, MonoPhone, MonoTasks, MonoWhatsapp, ShopifyBrand, Tasks, WebPush, WhatsApp, } from './Social/Channels';
 export { Email as Email2 } from './Social/Channels';
-export { SlackIcon, BigCommerce, Google, Gorgias, Kustomer, Rcs, ShopifyDefault, Twitter, Website, WooCommerce, Youtube, Zendesk } from './Social/Social';
+export { SlackIcon, BigCommerce, Google, Gorgias, Kustomer, Rcs, ShopifyDefault, Twitter, Website, WooCommerce, Youtube, Zendesk, } from './Social/Social';
 export { EmailMarketing as EmailMarketing2 } from './Social/Social';
 export { Facebook as Facebook2 } from './Social/Social';
 export { Instagram as Instagram2 } from './Social/Social';
 export { Messenger as Messenger2 } from './Social/Social';
 export { Whatsapp as Whatsapp2 } from './Social/Social';
-export { Eye, EyeClosed, EyeOff, HeartEmpty, HeartFilled, Lock, StarEmpty, StarFilled, StarHalf, Unlock } from './Toggles/General';
+export { Eye, EyeClosed, EyeOff, HeartEmpty, HeartFilled, Lock, StarEmpty, StarFilled, StarHalf, Unlock, } from './Toggles/General';