Text size
Line spacing
'); } function _emailHtmlToPlainText(html) { if (typeof document === 'undefined') return String(html || ''); const d = document.createElement('div'); d.innerHTML = String(html || ''); return d.innerText || d.textContent || ''; } function _sanitizedRichTextHtml(rich) { if (!rich) return ''; const text = (rich.innerText || rich.textContent || '').replace(/\u00a0/g, ' ').trim(); if (!text && !rich.querySelector('img, hr, table')) return ''; const html = rich.innerHTML || ''; const sanitized = markdownModule.sanitizeAllowedHtml ? markdownModule.sanitizeAllowedHtml(html) : html; const tpl = document.createElement('template'); tpl.innerHTML = sanitized; tpl.content.querySelectorAll('a[href]').forEach(link => { const safeUrl = _normalizeRichLinkUrl(link.getAttribute('href')); if (!safeUrl) { link.replaceWith(...Array.from(link.childNodes)); return; } link.setAttribute('href', safeUrl); link.setAttribute('rel', 'noopener noreferrer'); }); tpl.content.querySelectorAll('span').forEach(span => { if (!_isRichInlineCodeMarker(span)) return; const code = document.createElement('code'); code.innerHTML = span.innerHTML; const walker = document.createTreeWalker(code, NodeFilter.SHOW_TEXT); let node; while ((node = walker.nextNode())) node.nodeValue = node.nodeValue.replace(/\u200b/g, ''); span.replaceWith(code); }); return tpl.innerHTML .replace(/\sdata-editor-(?:table|checklist|image|inline-code|link)-token="[^"]*"/gi, '') .replace(/\sdata-editor-image-selected(?:="[^"]*")?/gi, ''); } function _richTextContentToHtml(content) { const raw = String(content || ''); if (!raw.trim()) return ''; if (/<\/?[a-z][^>]*>/i.test(raw)) { return markdownModule.sanitizeAllowedHtml ? markdownModule.sanitizeAllowedHtml(raw) : raw; } try { return markdownModule.mdToHtml(raw, { shortcodes: false }); } catch (_) { return _emailPlainTextToHtml(raw); } } function _emailQuoteMarkerMatch(text) { const raw = String(text || ''); return raw.match(/(?:
${_emailPlainTextToHtml(truncatedQuote)}
`;
}
// Mirror the rich body's plain text into the hidden textarea so the existing
// send / draft / change-detection plumbing (which reads the textarea) stays
// valid. The rich body's HTML is read separately on send (body_html).
function _syncEmailRichbody(rich) {
const ta = document.getElementById('doc-editor-textarea');
if (!ta) return;
const doc = activeDocId && docs.get(activeDocId);
if (doc && _isRichTextLang(doc.language)) {
const html = _sanitizedRichTextHtml(rich);
ta.value = html;
doc.content = html;
return;
}
ta.value = rich.innerText;
if (doc && doc.language === 'email') {
const fields = _parseEmailHeader(doc.content || '');
doc.content = _buildEmailContent(
document.getElementById('doc-email-to')?.value || fields.to || '',
document.getElementById('doc-email-subject')?.value || fields.subject || '',
document.getElementById('doc-email-in-reply-to')?.value || fields.inReplyTo || '',
document.getElementById('doc-email-references')?.value || fields.references || '',
rich.innerHTML,
document.getElementById('doc-email-source-uid')?.value || fields.sourceUid || '',
document.getElementById('doc-email-source-folder')?.value || fields.sourceFolder || '',
document.getElementById('doc-email-cc')?.value || fields.cc || '',
document.getElementById('doc-email-bcc')?.value || fields.bcc || '',
);
}
}
function _scheduleEmailRichbodySave() {
const doc = activeDocId && docs.get(activeDocId);
if (doc && _isRichTextLang(doc.language)) _markDocumentDirty(activeDocId);
_persistEmailLocalDraftSoon();
clearTimeout(_emailRichbodySaveDebounce);
_emailRichbodySaveDebounce = setTimeout(() => { saveDocument({ silent: true }); }, 2500);
}
function _richSelectionElement(rich) {
const selection = window.getSelection();
if (!selection?.rangeCount) return null;
const range = selection.getRangeAt(0);
if (!rich.contains(range.commonAncestorContainer)) return null;
const node = range.startContainer;
return node.nodeType === Node.ELEMENT_NODE ? node : node.parentElement;
}
function _richSelectionListItem(rich) {
const item = _richSelectionElement(rich)?.closest?.('li');
return item && rich.contains(item) ? item : null;
}
function _richSelectionChecklistItem(rich) {
const item = _richSelectionListItem(rich);
return item?.parentElement?.classList.contains('rich-checklist') ? item : null;
}
function _richChecklistItems(list) {
return Array.from(list?.children || []).filter(child => child.tagName === 'LI');
}
function _normalizeRichChecklists(root) {
const lists = root.matches?.('ul.rich-checklist')
? [root, ...root.querySelectorAll('ul.rich-checklist')]
: Array.from(root.querySelectorAll('ul.rich-checklist'));
lists.forEach(list => {
_richChecklistItems(list).forEach(item => {
const checked = item.dataset.checked === 'true';
item.dataset.checked = checked ? 'true' : 'false';
item.setAttribute('aria-checked', checked ? 'true' : 'false');
});
});
}
function _richTextOffsetWithin(root) {
const selection = window.getSelection();
if (!selection?.rangeCount || !root.contains(selection.anchorNode)) return null;
const before = document.createRange();
before.selectNodeContents(root);
before.setEnd(selection.anchorNode, selection.anchorOffset);
return before.toString().length;
}
const _richSpacingBlockSelector = 'h1,h2,h3,h4,h5,h6,p,div,pre,blockquote,li,td,th';
function _richSelectionTextOffsets(root) {
const selection = window.getSelection();
if (!selection?.rangeCount) return null;
const range = selection.getRangeAt(0);
if (!root.contains(range.startContainer) || !root.contains(range.endContainer)) return null;
const prefix = document.createRange();
prefix.selectNodeContents(root);
prefix.setEnd(range.startContainer, range.startOffset);
const throughSelection = document.createRange();
throughSelection.selectNodeContents(root);
throughSelection.setEnd(range.endContainer, range.endOffset);
return { start: prefix.toString().length, end: throughSelection.toString().length };
}
function _richTextPointAtOffset(root, requestedOffset) {
const walker = document.createTreeWalker(root, NodeFilter.SHOW_TEXT);
let remaining = Math.max(0, requestedOffset);
let node;
let last = null;
while ((node = walker.nextNode())) {
last = node;
const length = (node.nodeValue || '').length;
if (remaining <= length) return { node, offset: remaining };
remaining -= length;
}
if (last) return { node: last, offset: (last.nodeValue || '').length };
return { node: root, offset: 0 };
}
function _restoreRichSelectionTextOffsets(root, offsets) {
if (!offsets) return;
const start = _richTextPointAtOffset(root, offsets.start);
const end = _richTextPointAtOffset(root, offsets.end);
const range = document.createRange();
range.setStart(start.node, start.offset);
range.setEnd(end.node, end.offset);
const selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);
}
function _richSpacingBlocks(root) {
return Array.from(root.querySelectorAll(_richSpacingBlockSelector));
}
function _richClosestSpacingBlock(root, node) {
let element = node?.nodeType === Node.ELEMENT_NODE ? node : node?.parentElement;
if (!element || element === root) return null;
const block = element.matches?.(_richSpacingBlockSelector)
? element
: element.closest?.(_richSpacingBlockSelector);
return block && root.contains(block) ? block : null;
}
function _richSelectedSpacingBlockIndexes(root) {
const selection = window.getSelection();
if (!selection?.rangeCount) return [];
const range = selection.getRangeAt(0);
if (!root.contains(range.startContainer) || !root.contains(range.endContainer)) return [];
const blocks = _richSpacingBlocks(root);
let startNode = range.startContainer;
if (startNode === root && root.childNodes.length) {
startNode = root.childNodes[Math.min(range.startOffset, root.childNodes.length - 1)];
}
if (range.collapsed) {
const block = _richClosestSpacingBlock(root, startNode);
const index = blocks.indexOf(block);
return index >= 0 ? [index] : [];
}
const selected = new Set();
const addBlockForNode = node => {
const block = _richClosestSpacingBlock(root, node);
const index = blocks.indexOf(block);
if (index >= 0) selected.add(index);
};
addBlockForNode(startNode);
addBlockForNode(range.endContainer);
const walker = document.createTreeWalker(root, NodeFilter.SHOW_TEXT);
let textNode;
while ((textNode = walker.nextNode())) {
try { if (range.intersectsNode(textNode)) addBlockForNode(textNode); } catch (_) {}
}
return [...selected].sort((a, b) => a - b);
}
function _applyRichLineSpacing(rich, value) {
const indexes = _richSelectedSpacingBlockIndexes(rich);
const offsets = _richSelectionTextOffsets(rich);
if (!indexes.length || !offsets) return false;
const clone = rich.cloneNode(true);
const blocks = _richSpacingBlocks(clone);
indexes.forEach(index => {
const block = blocks[index];
if (!block) return;
if (value === 'normal') block.style.removeProperty('line-height');
else block.style.lineHeight = value;
if (!block.getAttribute('style')) block.removeAttribute('style');
});
clone.querySelectorAll('[data-editor-image-selected]').forEach(image => {
image.removeAttribute('data-editor-image-selected');
});
const wholeDocument = document.createRange();
wholeDocument.selectNodeContents(rich);
const selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(wholeDocument);
rich.focus();
if (!document.execCommand('insertHTML', false, clone.innerHTML)) return false;
_restoreRichSelectionTextOffsets(rich, offsets);
return true;
}
function _focusRichTextOffset(rich, root, textOffset = null) {
if (!root) return;
rich.focus();
const range = document.createRange();
if (!Number.isFinite(textOffset)) {
range.selectNodeContents(root);
range.collapse(false);
} else {
const walker = document.createTreeWalker(root, NodeFilter.SHOW_TEXT);
let remaining = Math.max(0, textOffset);
let textNode = walker.nextNode();
while (textNode && remaining > textNode.data.length) {
remaining -= textNode.data.length;
textNode = walker.nextNode();
}
if (textNode) range.setStart(textNode, Math.min(remaining, textNode.data.length));
else {
range.selectNodeContents(root);
range.collapse(false);
}
range.collapse(true);
}
const selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);
}
function _replaceRichChecklist(rich, original, replacement, targetIndex = 0, textOffset = null) {
const token = `doc-checklist-${Date.now()}-${Math.random().toString(36).slice(2, 8)}`;
replacement.dataset.editorChecklistToken = token;
const range = document.createRange();
range.selectNode(original);
const selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);
document.execCommand('insertHTML', false, replacement.outerHTML);
const inserted = rich.querySelector(`[data-editor-checklist-token="${token}"]`);
if (!inserted) return;
inserted.removeAttribute('data-editor-checklist-token');
_normalizeRichChecklists(inserted);
const items = _richChecklistItems(inserted);
_focusRichTextOffset(rich, items[Math.max(0, Math.min(targetIndex, items.length - 1))], textOffset);
}
function _setRichChecklistItemChecked(rich, item, checked) {
const list = item.parentElement;
const items = _richChecklistItems(list);
const itemIndex = items.indexOf(item);
const textOffset = _richTextOffsetWithin(item);
const clone = list.cloneNode(true);
const cloneItem = _richChecklistItems(clone)[itemIndex];
if (!cloneItem) return;
cloneItem.dataset.checked = checked ? 'true' : 'false';
cloneItem.setAttribute('aria-checked', checked ? 'true' : 'false');
_replaceRichChecklist(rich, list, clone, itemIndex, textOffset);
_syncEmailRichbody(rich);
_scheduleEmailRichbodySave();
rich._syncActive?.();
}
function _toggleRichChecklist(rich) {
const currentItem = _richSelectionListItem(rich);
const currentList = currentItem?.parentElement;
const itemIndex = currentList ? _richChecklistItems(currentList).indexOf(currentItem) : 0;
const textOffset = currentItem ? _richTextOffsetWithin(currentItem) : null;
if (currentList?.classList.contains('rich-checklist')) {
const clone = currentList.cloneNode(true);
clone.classList.remove('rich-checklist');
_richChecklistItems(clone).forEach(item => {
item.removeAttribute('data-checked');
item.removeAttribute('aria-checked');
});
_replaceRichChecklist(rich, currentList, clone, itemIndex, textOffset);
return true;
}
if (currentList && (currentList.tagName === 'UL' || currentList.tagName === 'OL')) {
const clone = document.createElement('ul');
clone.className = 'rich-checklist';
_richChecklistItems(currentList).forEach(item => clone.appendChild(item.cloneNode(true)));
_normalizeRichChecklists(clone);
_replaceRichChecklist(rich, currentList, clone, itemIndex, textOffset);
return true;
}
document.execCommand('insertUnorderedList');
const insertedItem = _richSelectionListItem(rich);
const insertedList = insertedItem?.parentElement;
if (!insertedList) return false;
insertedList.classList.add('rich-checklist');
_normalizeRichChecklists(insertedList);
return true;
}
function _handleRichChecklistEnter(rich) {
const item = _richSelectionChecklistItem(rich);
if (!item) return false;
const hasContent = !!item.textContent.trim() || !!item.querySelector('img, table, hr');
if (hasContent) {
document.execCommand('insertParagraph');
const nextItem = _richSelectionChecklistItem(rich);
if (nextItem) {
nextItem.dataset.checked = 'false';
nextItem.setAttribute('aria-checked', 'false');
}
} else {
document.execCommand('outdent');
document.execCommand('removeFormat');
document.execCommand('formatBlock', false, 'p');
}
_normalizeRichChecklists(rich);
_syncEmailRichbody(rich);
_scheduleEmailRichbodySave();
rich._syncActive?.();
return true;
}
function _handleRichHeadingEnter(rich) {
const selection = window.getSelection();
if (!selection?.rangeCount || !selection.isCollapsed) return false;
const range = selection.getRangeAt(0);
if (!rich.contains(range.commonAncestorContainer)) return false;
const element = range.startContainer.nodeType === Node.ELEMENT_NODE
? range.startContainer
: range.startContainer.parentElement;
const heading = element?.closest?.('h1, h2, h3, h4, h5, h6');
if (!heading || !rich.contains(heading)) return false;
const afterRange = document.createRange();
afterRange.selectNodeContents(heading);
afterRange.setStart(range.startContainer, range.startOffset);
const after = afterRange.cloneContents();
const headingHasContent = !!heading.textContent?.trim() || !!heading.querySelector('img, hr');
const caretAtEnd = !after.textContent?.trim() && !after.querySelector?.('img, hr');
if (headingHasContent && !caretAtEnd) return false;
let applied = false;
if (!headingHasContent) {
applied = document.execCommand('formatBlock', false, 'p');
} else {
document.execCommand('defaultParagraphSeparator', false, 'p');
applied = document.execCommand('insertParagraph');
}
if (!applied) return false;
_syncEmailRichbody(rich);
_scheduleEmailRichbodySave();
_scheduleDocumentHistoryControls();
rich._syncActive?.();
return true;
}
let _richInlineCodeTypingArmed = false;
function _richSelectionInlineCode(rich) {
const candidate = _richSelectionElement(rich)?.closest?.('code, span');
if (!candidate || !rich.contains(candidate) || candidate.closest('pre')) return null;
if (candidate.tagName === 'CODE' || _isRichInlineCodeMarker(candidate)) return candidate;
return null;
}
function _isRichInlineCodeMarker(element) {
return element?.tagName === 'SPAN'
&& String(element.style?.fontFamily || '').includes('OdysseusInlineCode');
}
function _normalizeRichInlineCode(root) {
root.querySelectorAll('code, span').forEach(code => {
if (code.closest('pre') || (code.tagName !== 'CODE' && !_isRichInlineCodeMarker(code))) return;
code.removeAttribute('data-editor-inline-code-token');
});
}
function _toggleRichInlineCode(rich) {
if (_richInlineCodeTypingArmed) {
document.execCommand('removeFormat');
document.execCommand('styleWithCSS', false, false);
_richInlineCodeTypingArmed = false;
return true;
}
const existing = _richSelectionInlineCode(rich);
if (existing) {
const range = document.createRange();
range.selectNodeContents(existing);
const selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);
document.execCommand('removeFormat');
return true;
}
const selection = window.getSelection();
if (!selection?.rangeCount) return false;
const range = selection.getRangeAt(0);
if (!rich.contains(range.commonAncestorContainer)) return false;
if (range.collapsed) {
document.execCommand('styleWithCSS', false, true);
document.execCommand('fontName', false, 'OdysseusInlineCode, ui-monospace, monospace');
document.execCommand('backColor', false, 'rgba(127, 127, 127, 0.12)');
_richInlineCodeTypingArmed = true;
return true;
}
const code = document.createElement('span');
code.style.fontFamily = 'OdysseusInlineCode, ui-monospace, monospace';
code.style.backgroundColor = 'rgba(127, 127, 127, 0.12)';
const selectedText = range.toString();
code.textContent = selectedText;
document.execCommand('insertHTML', false, code.outerHTML);
const inserted = _richSelectionInlineCode(rich);
if (!inserted) return false;
const caret = document.createRange();
caret.selectNodeContents(inserted);
selection.removeAllRanges();
selection.addRange(caret);
return true;
}
function _smartRichPasteUrl(rawText) {
const candidate = String(rawText || '').trim();
if (!candidate || /\s/.test(candidate)) return '';
if (/^[^@/:\s]+@[^@/:\s]+\.[^@/:\s]+$/.test(candidate)) return `mailto:${candidate}`;
if (/^mailto:/i.test(candidate)) {
return /^mailto:[^@\s]+@[^@\s]+\.[^@\s]+$/i.test(candidate)
? _normalizeRichLinkUrl(candidate)
: '';
}
if (/^tel:/i.test(candidate)) {
return /^tel:\+?[\d().-]+$/i.test(candidate) ? _normalizeRichLinkUrl(candidate) : '';
}
const absoluteWebUrl = /^(?:https?:)?\/\/[^/\s]+(?:\/[^\s]*)?$/i.test(candidate);
const bareDomain = /^(?:www\.)?[^./:\s]+\.[^/\s]+(?:\/[^\s]*)?$/i.test(candidate);
if (!absoluteWebUrl && !bareDomain) return '';
const safeUrl = _normalizeRichLinkUrl(candidate);
if (!safeUrl) return '';
try {
const parsed = new URL(safeUrl);
return /^https?:$/.test(parsed.protocol) && parsed.hostname ? parsed.href : '';
} catch (_) {
return '';
}
}
function _insertSmartRichPasteLink(rich, rawText) {
const url = _smartRichPasteUrl(rawText);
if (!url) return false;
const selection = window.getSelection();
if (!selection?.rangeCount) return false;
const range = selection.getRangeAt(0);
if (!rich.contains(range.commonAncestorContainer)) return false;
if (!range.collapsed) {
const selectionBlock = node => {
const element = node?.nodeType === Node.ELEMENT_NODE ? node : node?.parentElement;
return element?.closest?.('p, div, h1, h2, h3, h4, h5, h6, li, blockquote, pre, td, th');
};
if (selectionBlock(range.startContainer) !== selectionBlock(range.endContainer)) return false;
}
const anchor = document.createElement('a');
anchor.href = url;
anchor.rel = 'noopener noreferrer';
if (range.collapsed) {
anchor.textContent = String(rawText || '').trim();
} else {
const contents = range.cloneContents();
contents.querySelectorAll?.('a').forEach(link => link.replaceWith(...Array.from(link.childNodes)));
anchor.appendChild(contents);
}
const token = `doc-link-paste-${Date.now()}-${Math.random().toString(36).slice(2, 8)}`;
anchor.dataset.editorLinkToken = token;
if (!document.execCommand('insertHTML', false, anchor.outerHTML)) return false;
const inserted = rich.querySelector(`[data-editor-link-token="${token}"]`);
if (!inserted) return false;
inserted.removeAttribute('data-editor-link-token');
const after = document.createRange();
after.setStartAfter(inserted);
after.collapse(true);
selection.removeAllRanges();
selection.addRange(after);
return true;
}
function _cleanRichTextPasteHtml(rawHtml) {
const sanitized = markdownModule.sanitizeAllowedHtml
? markdownModule.sanitizeAllowedHtml(String(rawHtml || ''))
: String(rawHtml || '');
const tpl = document.createElement('template');
tpl.innerHTML = sanitized;
const allowedTags = new Set([
'A', 'B', 'STRONG', 'I', 'EM', 'U', 'S', 'STRIKE', 'DEL', 'SPAN',
'P', 'DIV', 'BR', 'HR', 'UL', 'OL', 'LI', 'H1', 'H2', 'H3', 'H4',
'BLOCKQUOTE', 'CODE', 'PRE', 'SUP', 'SUB',
'TABLE', 'THEAD', 'TBODY', 'TFOOT', 'TR', 'TH', 'TD',
]);
// Keep useful document structure but discard presentation copied from the
// source page. Editor-applied formatting is unaffected; this only cleans
// newly pasted HTML before it enters the browser's undo stack.
tpl.content.querySelectorAll('img, video, audio, canvas').forEach(el => el.remove());
tpl.content.querySelectorAll('*').forEach(el => {
if (!allowedTags.has(el.tagName)) {
el.replaceWith(...Array.from(el.childNodes));
return;
}
for (const attr of Array.from(el.attributes)) {
const name = attr.name.toLowerCase();
const keepLink = el.tagName === 'A' && name === 'href';
const keepTableSpan = (el.tagName === 'TD' || el.tagName === 'TH')
&& (name === 'colspan' || name === 'rowspan');
const keepChecklistClass = el.tagName === 'UL' && name === 'class'
&& el.classList.contains('rich-checklist');
const keepChecklistState = el.tagName === 'LI'
&& (name === 'data-checked' || name === 'aria-checked')
&& el.parentElement?.classList.contains('rich-checklist');
if (!keepLink && !keepTableSpan && !keepChecklistClass && !keepChecklistState) {
el.removeAttribute(attr.name);
}
}
if (el.tagName === 'A') {
const safeUrl = _normalizeRichLinkUrl(el.getAttribute('href'));
if (!safeUrl) el.replaceWith(...Array.from(el.childNodes));
else {
el.setAttribute('href', safeUrl);
el.setAttribute('rel', 'noopener noreferrer');
}
}
});
return tpl.innerHTML;
}
function _wireEmailRichbody(rich) {
if (rich._wired) { _syncEmailRichbody(rich); return; }
rich._wired = true;
rich.addEventListener('input', () => {
if (_richInlineCodeTypingArmed) {
document.execCommand('styleWithCSS', false, false);
_richInlineCodeTypingArmed = false;
}
if (_activeRichImage && !_activeRichImage.isConnected) _clearRichImageSelection();
_normalizeRichTextImages(rich);
_normalizeRichChecklists(rich);
_normalizeRichInlineCode(rich);
_syncEmailRichbody(rich);
_scheduleEmailRichbodySave();
if (_selections.length) clearSelection();
const findBar = document.getElementById('doc-find-bar');
const findInput = document.getElementById('doc-find-input');
if (findBar?.style.display !== 'none' && findInput?.value) {
findInput.dispatchEvent(new Event('input', { bubbles: true }));
}
const doc = activeDocId && docs.get(activeDocId);
if (doc && _isRichTextLang(doc.language) && !(doc.title || '').trim()) {
clearTimeout(rich._autoTitleTimer);
rich._autoTitleTimer = setTimeout(() => autoTitleFromContent(rich.innerText || ''), 500);
}
_scheduleDocumentStats();
_refreshDocumentOutline();
_scheduleRichSelectionToolbar(rich);
_syncRichSlashMenu(rich);
_scheduleDocumentHistoryControls();
});
// Highlight toolbar buttons (B / I / S, headings, lists) when the caret
// sits inside formatted text. queryCommandState reflects the live
// selection — we just translate that into .is-active classes the CSS
// already understands.
let syncActiveFrame = 0;
const syncActiveNow = () => {
syncActiveFrame = 0;
if (!rich.isConnected || rich.style.display === 'none') return;
// Only sync when focus is inside the rich body — otherwise selection
// outside it (e.g. clicking the toolbar itself) gives misleading state.
if (!rich.contains(document.activeElement) && document.activeElement !== rich) return;
const tb = document.getElementById('doc-md-toolbar');
if (!tb) return;
const set = (sel, on) => { const b = tb.querySelector(sel); if (b) b.classList.toggle('is-active', !!on); };
try {
set('[data-md="bold"]', document.queryCommandState('bold'));
set('[data-md="italic"]', document.queryCommandState('italic'));
set('[data-md="strike"]', document.queryCommandState('strikeThrough'));
set('[data-md="underline"]', document.queryCommandState('underline'));
set('[data-md="superscript"]', document.queryCommandState('superscript'));
set('[data-md="subscript"]', document.queryCommandState('subscript'));
const sizeValue = String(document.queryCommandValue('fontSize') || '3');
const sizeIcon = tb.querySelector('.rich-font-size-icon');
if (sizeIcon) sizeIcon.textContent = String(_RICH_FONT_SIZE_PX[sizeValue] || 16);
} catch (_) {}
// Block-level: heading / list dropdown toggles read their active state
// from the current block tag.
const cur = _currentBlockTag(rich);
const hBtn = tb.querySelector('[data-dd="heading"]');
if (hBtn) hBtn.classList.toggle('is-active', /^h[1-6]$/.test(cur));
try {
const inList = document.queryCommandState('insertOrderedList') || document.queryCommandState('insertUnorderedList');
const lBtn = tb.querySelector('[data-dd="list"]');
if (lBtn) lBtn.classList.toggle('is-active', !!inList);
// queryCommandState() is inconsistent between browsers and can report
// right alignment for a plain paragraph. Read the selected block's
// actual style instead, so the control reflects what the user sees.
const alignActions = _richDropdownCurrentActions('align', rich, null, null);
const aBtn = tb.querySelector('[data-dd="align"]');
const selection = window.getSelection();
const node = selection?.anchorNode;
const element = node?.nodeType === Node.TEXT_NODE ? node.parentElement : node;
const selectedBlock = element?.closest?.('p,div,li,h1,h2,h3,h4,h5,h6,blockquote,pre');
const hasExplicitAlignment = !!selectedBlock?.style?.textAlign;
if (aBtn) aBtn.classList.toggle('is-active', hasExplicitAlignment || !alignActions.has('alignleft'));
} catch (_) {}
const tableBtn = tb.querySelector('[data-dd="table"]');
if (tableBtn) tableBtn.classList.toggle('is-active', !!_richSelectionCell(rich));
const imageBtn = tb.querySelector('[data-dd="image"]');
if (imageBtn) imageBtn.classList.toggle('is-active', !!_selectedRichImage(rich));
const codeBtn = tb.querySelector('[data-dd="code"]');
if (codeBtn) codeBtn.classList.toggle('is-active', cur === 'pre' || _richInlineCodeTypingArmed || !!_richSelectionInlineCode(rich));
const selection = window.getSelection();
const selectionRange = selection?.rangeCount ? selection.getRangeAt(0) : null;
const currentLink = _richLinkAtRange(rich, selectionRange);
set('[data-md="link"]', !!currentLink);
const spacingBtn = tb.querySelector('[data-dd="spacing"]');
if (spacingBtn) {
const blocks = _richSpacingBlocks(rich);
const indexes = _richSelectedSpacingBlockIndexes(rich);
spacingBtn.classList.toggle('is-active', indexes.some(index => !!blocks[index]?.style.lineHeight));
}
// Keep dropdown tools visibly latched while their formatting is active.
// This is especially useful for color, font, size, and alignment where
// the current state is otherwise only visible inside the popup.
const dropdownActive = (selector, kind, defaultAction) => {
const button = tb.querySelector(selector);
if (!button) return;
const actions = _richDropdownCurrentActions(kind, rich, null, null);
const active = actions.size > 0 && !(defaultAction && actions.size === 1 && actions.has(defaultAction));
button.classList.toggle('is-active', active);
};
dropdownActive('[data-dd="textsize"]', 'textsize', 'fontsize:3');
dropdownActive('[data-dd="color"]', 'color', 'forecolor:default');
dropdownActive('[data-dd="highlight"]', 'highlight', 'highlight:transparent');
dropdownActive('[data-dd="spacing"]', 'spacing');
};
const syncActive = () => {
if (syncActiveFrame) return;
syncActiveFrame = requestAnimationFrame(syncActiveNow);
};
rich.addEventListener('keyup', syncActive);
rich.addEventListener('mouseup', syncActive);
rich.addEventListener('focus', syncActive);
rich.addEventListener('focus', _scheduleDocumentHistoryControls);
rich.addEventListener('mouseup', () => {
setTimeout(() => {
updateRichSelectionState(rich);
_scheduleRichSelectionToolbar(rich);
}, 50);
});
rich.addEventListener('keyup', (e) => {
if (e.shiftKey) updateRichSelectionState(rich);
_scheduleRichSelectionToolbar(rich);
});
rich.addEventListener('scroll', () => _scheduleRichSelectionToolbar(rich), { passive: true });
rich.addEventListener('paste', (e) => {
const doc = activeDocId && docs.get(activeDocId);
if (!doc || !_isRichTextLang(doc.language)) return;
const images = Array.from(e.clipboardData?.files || []).filter(_isMarkdownImageFile);
if (images.length) {
e.preventDefault();
const selection = window.getSelection();
if (selection?.rangeCount && rich.contains(selection.getRangeAt(0).commonAncestorContainer)) {
_richImageInsertRange = selection.getRangeAt(0).cloneRange();
}
_uploadMarkdownImages(images);
return;
}
const html = e.clipboardData?.getData('text/html') || '';
const text = e.clipboardData?.getData('text/plain') || '';
if (!html && !text) return;
e.preventDefault();
rich.focus();
if (!html && _insertSmartRichPasteLink(rich, text)) {
// Smart URL paste is already inserted through the native undo stack.
} else if (html) document.execCommand('insertHTML', false, _cleanRichTextPasteHtml(html));
else document.execCommand('insertText', false, text);
_syncEmailRichbody(rich);
_scheduleEmailRichbodySave();
});
rich.addEventListener('dragover', (e) => {
const doc = activeDocId && docs.get(activeDocId);
if (!doc || !_isRichTextLang(doc.language)) return;
if (!Array.from(e.dataTransfer?.types || []).includes('Files')) return;
e.preventDefault();
e.dataTransfer.dropEffect = 'copy';
});
rich.addEventListener('drop', (e) => {
const doc = activeDocId && docs.get(activeDocId);
if (!doc || !_isRichTextLang(doc.language)) return;
const images = Array.from(e.dataTransfer?.files || []).filter(_isMarkdownImageFile);
if (!images.length) return;
e.preventDefault();
const range = document.caretRangeFromPoint?.(e.clientX, e.clientY);
_richImageInsertRange = range && rich.contains(range.commonAncestorContainer) ? range.cloneRange() : null;
_uploadMarkdownImages(images);
});
rich.addEventListener('pointerdown', (e) => {
const image = e.target?.closest?.('img.richtext-image, figure.richtext-image img');
if (image && rich.contains(image)) {
e.preventDefault();
_selectRichImage(rich, image);
return;
}
if (_activeRichImage) _clearRichImageSelection();
const item = e.target?.closest?.('ul.rich-checklist > li');
if (!item || !rich.contains(item)) return;
const rect = item.getBoundingClientRect();
if (e.clientX < rect.left - 30 || e.clientX > rect.left + 4) return;
e.preventDefault();
_setRichChecklistItemChecked(rich, item, item.dataset.checked !== 'true');
});
rich.addEventListener('keydown', (e) => {
if (_richSlashMenu) {
const commandCount = _richSlashMenu._commands?.length || 0;
if (e.key === 'ArrowDown' || e.key === 'ArrowUp' || e.key === 'Home' || e.key === 'End') {
e.preventDefault();
e.stopPropagation();
if (!commandCount) _richSlashActiveIndex = 0;
else if (e.key === 'Home') _richSlashActiveIndex = 0;
else if (e.key === 'End') _richSlashActiveIndex = commandCount - 1;
else {
const delta = e.key === 'ArrowDown' ? 1 : -1;
_richSlashActiveIndex = (_richSlashActiveIndex + delta + commandCount) % commandCount;
}
const context = _richSlashContext(rich);
if (context) _renderRichSlashMenu(rich, context);
return;
}
if (e.key === 'Enter' && commandCount) {
e.preventDefault();
e.stopPropagation();
_chooseRichSlashCommand(rich);
return;
}
if (e.key === 'Escape') {
e.preventDefault();
e.stopPropagation();
_hideRichSlashMenu();
return;
}
}
if (e.key === ' ' && !e.ctrlKey && !e.metaKey && !e.altKey && _applyRichBlockInputRule(rich)) {
e.preventDefault();
e.stopPropagation();
return;
}
const liveSelection = window.getSelection?.();
if (e.key === 'Escape' && _richSelectionToolbar && liveSelection && !liveSelection.isCollapsed) {
e.preventDefault();
e.stopPropagation();
liveSelection.collapseToEnd();
_hideRichSelectionToolbar();
return;
}
if (_activeRichImage && (e.key === 'Delete' || e.key === 'Backspace')) {
e.preventDefault();
_applyRichImageAction(rich, 'image:delete');
return;
}
if (_activeRichImage && e.key === 'Escape') {
e.preventDefault();
_clearRichImageSelection();
return;
}
const mod = e.ctrlKey || e.metaKey;
const key = String(e.key || '').toLowerCase();
if (mod && key === 'enter') {
const item = _richSelectionChecklistItem(rich);
if (item) {
e.preventDefault();
_setRichChecklistItemChecked(rich, item, item.dataset.checked !== 'true');
return;
}
}
if (e.key === 'Enter' && !mod && !e.shiftKey && !e.altKey && _handleRichChecklistEnter(rich)) {
e.preventDefault();
e.stopPropagation();
return;
}
if (e.key === 'Enter' && !mod && !e.shiftKey && !e.altKey && _handleRichHeadingEnter(rich)) {
e.preventDefault();
e.stopPropagation();
return;
}
let action = '';
if (mod && e.altKey && !e.shiftKey && /^[0-6]$/.test(key)) action = key === '0' ? 'paragraph' : `h${key}`;
else if (mod && !e.altKey && key === 'b') action = 'bold';
else if (mod && !e.altKey && key === 'i') action = 'italic';
else if (mod && !e.altKey && key === 'u') action = 'underline';
else if (mod && !e.altKey && key === 'k') action = 'link';
else if (mod && e.shiftKey && key === 'x') action = 'strike';
else if (mod && e.shiftKey && key === '5') action = 'strike';
else if (mod && e.shiftKey && key === '7') action = 'ol';
else if (mod && e.shiftKey && key === '8') action = 'ul';
else if (mod && e.shiftKey && !e.altKey && key === 'l') action = 'alignleft';
else if (mod && e.shiftKey && !e.altKey && key === 'e') action = 'aligncenter';
else if (mod && e.shiftKey && !e.altKey && key === 'j') action = 'alignjustify';
else if (mod && !e.altKey && key === '[') action = 'outdent';
else if (mod && !e.altKey && key === ']') action = 'indent';
else if (mod && !e.altKey && key === '.') action = 'superscript';
else if (mod && !e.altKey && key === ',') action = 'subscript';
else if (mod && !e.altKey && key === '\\') action = 'removeformat';
else if (mod && e.shiftKey && key === '`') action = 'codeblock';
else if (mod && !e.altKey && key === '`') action = 'code';
if (action) {
e.preventDefault();
applyMdFormat(action);
return;
}
if (e.key === 'Tab') {
const selection = window.getSelection();
const anchor = selection?.anchorNode;
const anchorEl = anchor?.nodeType === Node.ELEMENT_NODE ? anchor : anchor?.parentElement;
const cell = anchorEl?.closest?.('td, th');
if (cell && rich.contains(cell)) {
e.preventDefault();
const table = cell.closest('table');
let cells = Array.from(table.querySelectorAll('th, td'));
let index = cells.indexOf(cell) + (e.shiftKey ? -1 : 1);
if (index >= cells.length && !e.shiftKey) {
if (_appendRichTableRow(rich, table)) {
_syncEmailRichbody(rich);
_scheduleEmailRichbodySave();
_scheduleDocumentHistoryControls();
}
return;
}
const target = cells[Math.max(0, index)];
if (target) {
const range = document.createRange();
range.selectNodeContents(target);
range.collapse(true);
selection.removeAllRanges();
selection.addRange(range);
}
return;
}
let inList = false;
try { inList = document.queryCommandState('insertOrderedList') || document.queryCommandState('insertUnorderedList'); } catch (_) {}
if (inList) {
e.preventDefault();
applyMdFormat(e.shiftKey ? 'outdent' : 'indent');
}
}
});
// selectionchange fires on the document; filter to selections inside rich.
document.addEventListener('selectionchange', () => {
const sel = window.getSelection();
if (sel && sel.rangeCount && rich.contains(sel.anchorNode)) {
syncActive();
_scheduleDocumentStats();
_scheduleRichSelectionToolbar(rich);
} else if (_richSelectionToolbar) {
_hideRichSelectionToolbar();
}
if (!sel || !sel.rangeCount || !rich.contains(sel.anchorNode)) _hideRichSlashMenu();
});
window.addEventListener('resize', () => {
_scheduleRichSelectionToolbar(rich);
_followRichSelectionToolbarLayout(rich);
}, { passive: true });
window.visualViewport?.addEventListener('resize', () => {
_scheduleRichSelectionToolbar(rich);
_followRichSelectionToolbarLayout(rich);
}, { passive: true });
rich._syncActive = syncActive;
}
function _emailRichbodyActive() {
const r = document.getElementById('doc-email-richbody');
return r && r.style.display !== 'none' ? r : null;
}
function _showRichTextEditor(doc) {
const rich = document.getElementById('doc-email-richbody');
const source = document.getElementById('doc-editor-wrap');
const textarea = document.getElementById('doc-editor-textarea');
if (!rich || !source) return;
_clearRichImageSelection();
_richInlineCodeTypingArmed = false;
document.execCommand('styleWithCSS', false, false);
source.style.display = 'none';
rich.style.display = '';
rich.classList.add('richtext-mode');
// The rich editor is a formatting surface, not a browser spellcheck
// field. Disable native red underlines, which are especially distracting
// for names, code, and mixed-language email text.
rich.spellcheck = false;
rich.setAttribute('aria-label', 'Rich text document');
rich.innerHTML = _richTextContentToHtml(doc?.content || '');
_normalizeRichTextImages(rich);
_normalizeRichChecklists(rich);
_normalizeRichInlineCode(rich);
_wireEmailRichbody(rich);
_syncEmailRichbody(rich);
if (textarea) textarea.spellcheck = true;
}
function _captureEmailBodyFocusState() {
const rich = _emailRichbodyActive();
const ta = document.getElementById('doc-editor-textarea');
const active = document.activeElement;
if (rich && (active === rich || rich.contains(active))) {
const sel = window.getSelection();
const range = sel && sel.rangeCount ? sel.getRangeAt(0) : null;
return {
type: 'rich',
range: range && rich.contains(range.commonAncestorContainer) ? range.cloneRange() : null,
};
}
if (ta && active === ta) {
return {
type: 'textarea',
start: ta.selectionStart,
end: ta.selectionEnd,
};
}
return null;
}
function _restoreEmailBodyFocusState(state) {
if (!state) return;
requestAnimationFrame(() => {
if (state.type === 'rich') {
const rich = _emailRichbodyActive();
if (!rich) return;
rich.focus({ preventScroll: true });
if (state.range) {
const sel = window.getSelection();
if (sel) {
sel.removeAllRanges();
sel.addRange(state.range);
}
}
} else if (state.type === 'textarea') {
const ta = document.getElementById('doc-editor-textarea');
if (!ta) return;
ta.focus({ preventScroll: true });
if (Number.isFinite(state.start) && Number.isFinite(state.end)) {
try { ta.setSelectionRange(state.start, state.end); } catch (_) {}
}
}
});
}
function _renderStreamingEmailBody(body, { immediate = false } = {}) {
const rich = document.getElementById('doc-email-richbody');
const textarea = document.getElementById('doc-editor-textarea');
if (!rich) return;
_emailStreamTargetBody = body || '';
if (!_emailStreamRenderedBody && textarea && textarea.value) {
_emailStreamRenderedBody = textarea.value;
}
const applyBody = (value) => {
if (textarea) {
textarea.value = value;
textarea.scrollTop = textarea.scrollHeight;
}
rich.innerHTML = _emailBodyToHtml(value);
rich.scrollTop = rich.scrollHeight;
};
if (immediate) {
if (_emailStreamAnimFrame) cancelAnimationFrame(_emailStreamAnimFrame);
_emailStreamAnimFrame = null;
_emailStreamRenderedBody = _emailStreamTargetBody;
applyBody(_emailStreamRenderedBody);
return;
}
if (_emailStreamTargetBody.length < _emailStreamRenderedBody.length ||
!_emailStreamTargetBody.startsWith(_emailStreamRenderedBody)) {
_emailStreamRenderedBody = '';
}
if (_emailStreamAnimFrame) return;
const tick = () => {
const remaining = _emailStreamTargetBody.length - _emailStreamRenderedBody.length;
if (remaining <= 0) {
_emailStreamAnimFrame = null;
return;
}
const step = Math.max(1, Math.min(8, Math.ceil(remaining / 18)));
_emailStreamRenderedBody = _emailStreamTargetBody.slice(0, _emailStreamRenderedBody.length + step);
applyBody(_emailStreamRenderedBody);
_emailStreamAnimFrame = requestAnimationFrame(tick);
};
_emailStreamAnimFrame = requestAnimationFrame(tick);
}
function _emailQuoteStartIndex(lines) {
for (let i = 0; i < lines.length; i++) {
const line = String(lines[i] || '').trim();
if (
/^[-_=–—\s]{3,}(previous|original|forwarded)\s+(message|email|mail)[-_=–—\s]{3,}$/i.test(line)
|| /^On .+ wrote:\s*$/i.test(line)
|| /^-{2,}\s*Original Message\s*-{2,}$/i.test(line)
) {
return i;
}
// Some pasted/converted threads lose the separator and start directly
// with mail headers. Treat that as quoted history only when the nearby
// lines look like a real header block.
if (/^From:\s+\S/i.test(line)) {
const nearby = lines.slice(i + 1, i + 8).map(l => String(l || '').trim());
if (nearby.some(l => /^To:\s+/i.test(l)) || nearby.some(l => /^Subject:\s+/i.test(l))) {
return i;
}
}
}
return -1;
}
function _emailQuoteStartOffset(text) {
const original = String(text || '');
if (!original) return -1;
const boundary = String.raw`(?:^|\n|'; target.insertBefore(slot, quote); } range.selectNodeContents(slot); range.collapse(false); } else { range.selectNodeContents(target); range.collapse(false); } const sel = window.getSelection(); if (sel) { sel.removeAllRanges(); sel.addRange(range); } } else if (typeof target.setSelectionRange === 'function') { const len = target.value.length; target.setSelectionRange(len, len); } } // Mobile reply drafts should open with the user's writing area at the top, // ready for input. Keep this separate from the desktop Tab-to-body behavior. export function focusEmailReplyBody() { if (window.innerWidth > 768) return false; const rich = _emailRichbodyActive(); if (!rich) return false; const quote = rich.querySelector('.email-quoted-history'); const replyBlock = quote?.previousElementSibling || rich.firstElementChild || rich; try { rich.focus({ preventScroll: true }); } catch (_) { rich.focus(); } const range = document.createRange(); if (replyBlock && replyBlock !== quote) range.selectNodeContents(replyBlock); else range.selectNodeContents(rich); range.collapse(true); const selection = window.getSelection(); if (selection) { selection.removeAllRanges(); selection.addRange(range); } rich.scrollTop = 0; return true; } function _syncEmailHeaderSummary() { const to = document.getElementById('doc-email-to')?.value?.trim() || 'No recipient'; const subject = document.getElementById('doc-email-subject')?.value?.trim() || 'No subject'; const cc = document.getElementById('doc-email-cc')?.value?.trim() || ''; const bcc = document.getElementById('doc-email-bcc')?.value?.trim() || ''; const summary = document.getElementById('doc-email-collapse-summary'); if (!summary) return; const extras = []; if (cc) extras.push('Cc'); if (bcc) extras.push('Bcc'); summary.textContent = `${to} · ${subject}${extras.length ? ` · ${extras.join('/')}` : ''}`; summary.title = summary.textContent; } function _setEmailHeaderInputValue(id, value, { preserveFocused = true, preserveNonEmpty = false } = {}) { const el = document.getElementById(id); if (!el) return; const next = value || ''; if (preserveFocused && document.activeElement === el) return; if (preserveNonEmpty && !next && el.value) return; if (el.value !== next) el.value = next; } function _setEmailHeaderCollapsed(collapsed, { manual = true } = {}) { const header = document.getElementById('doc-email-header'); const btn = document.getElementById('doc-email-collapse-btn'); if (!header) return; if (window.innerWidth > 768) collapsed = false; header.classList.toggle('doc-email-header-collapsed', !!collapsed); if (btn) { btn.setAttribute('aria-expanded', String(!collapsed)); btn.title = collapsed ? 'Show email fields' : 'Hide email fields'; } const doc = activeDocId && docs.get(activeDocId); if (doc && manual) doc._emailHeaderCollapsed = !!collapsed; if (manual && !collapsed) _emailHeaderManualExpandUntil = Date.now() + 1400; _syncEmailHeaderSummary(); } function _shouldAutoCollapseEmailHeader() { return window.innerWidth <= 768; } function _maybeAutoCollapseEmailHeader() { const doc = activeDocId && docs.get(activeDocId); if (!doc || doc.language !== 'email') return; if (Date.now() < _emailHeaderManualExpandUntil) return; if (document.activeElement?.closest?.('#doc-email-fields')) return; if (_shouldAutoCollapseEmailHeader()) _setEmailHeaderCollapsed(true, { manual: false }); } function _showEmailFields(doc, { applyLocalDraft = true, forceHeaderFields = false } = {}) { const emailHeader = document.getElementById('doc-email-header'); const emailActions = document.getElementById('doc-email-actions'); document.getElementById('doc-email-richbody')?.classList.remove('richtext-mode'); // Show MD toolbar for email too (B, I, etc.) const mdToolbar = document.getElementById('doc-md-toolbar'); if (mdToolbar) { mdToolbar.style.display = ''; if (mdToolbar._syncOverflow) requestAnimationFrame(mdToolbar._syncOverflow); } // Hide toolbar items that have no clean WYSIWYG equivalent in email (Code). document.querySelectorAll('.md-toolbar-email-hide').forEach(el => { el.style.display = 'none'; }); // Show email-only toolbar items (AI reply button). document.querySelectorAll('.md-toolbar-email-only').forEach(el => { el.style.display = 'inline-flex'; }); if (emailHeader) emailHeader.style.display = ''; if (emailActions) emailActions.style.display = ''; // Emails have their own complete footer (Close / More / Send), so hide the // generic documents action bar AND the generic bottom footer. The TYPE // picker is the exception — relocate it into the email footer so the // type-switching affordance is in the same footer slot across all docs. const docActions = document.getElementById('doc-editor-actions'); if (docActions) docActions.style.display = 'none'; const docFooter = document.getElementById('doc-actions-footer'); if (docFooter) docFooter.style.display = 'none'; if (emailActions) { const _lang = document.getElementById('doc-language-select'); const _langPicker = document.getElementById('doc-langpicker-trigger'); const _sendSplit = emailActions.querySelector('.email-send-split'); if (_lang && _sendSplit) emailActions.insertBefore(_lang, _sendSplit); if (_langPicker && _sendSplit) { _langPicker.classList.add('doc-langpicker-email-compact'); _langPicker.title = 'Change document type'; emailActions.insertBefore(_langPicker, _sendSplit); } } // Colored system-emoji font for email compose document.getElementById('doc-editor-textarea')?.classList.add('email-mode'); document.getElementById('doc-editor-code')?.classList.add('email-mode'); document.getElementById('doc-editor-highlight')?.classList.add('email-mode'); let fields = _parseEmailHeader(doc.content || ''); if (applyLocalDraft) fields = _emailFieldsWithLocalDraft(fields); const preserveEmailHeader = !!(fields.sourceUid || fields.inReplyTo || fields.references); const subjectInput = document.getElementById('doc-email-subject'); const textarea = document.getElementById('doc-editor-textarea'); _setEmailHeaderInputValue('doc-email-to', fields.to, { preserveFocused: !forceHeaderFields, preserveNonEmpty: preserveEmailHeader && !forceHeaderFields }); _setEmailHeaderInputValue('doc-email-subject', fields.subject, { preserveFocused: !forceHeaderFields, preserveNonEmpty: preserveEmailHeader && !forceHeaderFields }); _setEmailHeaderCollapsed(!!(doc && doc._emailHeaderCollapsed), { manual: false }); if (subjectInput && !subjectInput._emailTabBodyBound) { subjectInput._emailTabBodyBound = true; subjectInput.addEventListener('keydown', (e) => { if (e.key === 'Tab' && !e.shiftKey) { e.preventDefault(); _focusEmailBodyEnd(); } }); } _setEmailHeaderInputValue('doc-email-in-reply-to', fields.inReplyTo, { preserveFocused: !forceHeaderFields, preserveNonEmpty: preserveEmailHeader && !forceHeaderFields }); _setEmailHeaderInputValue('doc-email-references', fields.references, { preserveFocused: !forceHeaderFields, preserveNonEmpty: preserveEmailHeader && !forceHeaderFields }); _setEmailHeaderInputValue('doc-email-source-uid', fields.sourceUid || '', { preserveFocused: !forceHeaderFields, preserveNonEmpty: preserveEmailHeader && !forceHeaderFields }); _setEmailHeaderInputValue('doc-email-source-folder', fields.sourceFolder || '', { preserveFocused: !forceHeaderFields, preserveNonEmpty: preserveEmailHeader && !forceHeaderFields }); // Show/hide unread button only if we have a source UID (came from inbox) const unreadBtn = document.getElementById('doc-email-unread-btn'); if (unreadBtn) unreadBtn.style.display = fields.sourceUid ? '' : 'none'; // Render attachment chips const attDiv = document.getElementById('doc-email-attachments'); if (attDiv) { attDiv.innerHTML = ''; if (fields.attachments && fields.attachments.length > 0 && fields.sourceUid) { attDiv.style.display = ''; for (const att of fields.attachments) { const isPdf = (att.filename || '').toLowerCase().endsWith('.pdf'); const sizeKb = att.size > 0 ? `${Math.round(att.size / 1024)} KB` : ''; const chipHtml = `${_escHtml(att.filename)}${sizeKb}`; // Helper: swap chip content for a whirlpool spinner while busy. const _withSpinner = async (chip, fn) => { if (chip.dataset.loading === '1') return; chip.dataset.loading = '1'; const orig = chip.innerHTML; chip.innerHTML = ''; const sp = spinnerModule.createWhirlpool(14); sp.style.marginRight = '6px'; chip.appendChild(sp); const lbl = document.createElement('span'); lbl.textContent = att.filename; chip.appendChild(lbl); try { await fn(); } finally { chip.dataset.loading = ''; chip.innerHTML = orig; } }; if (isPdf) { // PDF: open in the in-app PDF viewer as a new doc tab const chip = document.createElement('button'); chip.type = 'button'; chip.className = 'email-attachment-chip email-attachment-chip-pdf'; // Full filename on hover — chip ellipsis-truncates long names. chip.title = att.filename; chip.innerHTML = chipHtml; chip.addEventListener('click', () => _withSpinner(chip, async () => { try { const folderQs = encodeURIComponent(fields.sourceFolder || 'INBOX'); const res = await fetch(`${API_BASE}/api/email/attachment-as-doc/${encodeURIComponent(fields.sourceUid)}/${att.index}?folder=${folderQs}`, { method: 'POST' }); const data = await res.json(); if (data.doc_id) { await loadDocument(data.doc_id); } else if (uiModule) { uiModule.showError(data.error || 'Failed to open PDF'); window.open(`${API_BASE}/api/email/attachment/${encodeURIComponent(fields.sourceUid)}/${att.index}?folder=${folderQs}`, '_blank'); } } catch (e) { console.error('Open PDF attachment failed:', e); if (uiModule) uiModule.showError('Failed to open PDF'); } })); attDiv.appendChild(chip); } else { // Non-PDF: download via fetch+blob+anchor — browser-native download // with target=_blank was unreliable in some browsers (the click did // nothing). The blob path forces a real Save dialog every time. const chip = document.createElement('button'); chip.type = 'button'; chip.className = 'email-attachment-chip'; // Full filename on hover for the chip ellipsis-truncated label. chip.title = `Download ${att.filename}`; chip.innerHTML = chipHtml; chip.addEventListener('click', () => _withSpinner(chip, async () => { try { const folderQs = encodeURIComponent(fields.sourceFolder || 'INBOX'); const res = await fetch(`${API_BASE}/api/email/attachment/${encodeURIComponent(fields.sourceUid)}/${att.index}?folder=${folderQs}`); if (!res.ok) throw new Error(`HTTP ${res.status}`); const blob = await res.blob(); const url = URL.createObjectURL(blob); const a = document.createElement('a'); a.href = url; a.download = att.filename; document.body.appendChild(a); a.click(); a.remove(); setTimeout(() => URL.revokeObjectURL(url), 1000); } catch (e) { console.error('Download attachment failed:', e); if (uiModule) uiModule.showError('Download failed: ' + e.message); } })); attDiv.appendChild(chip); } } } else { attDiv.style.display = 'none'; } } if (textarea) { textarea.value = fields.body; // Store original body for change detection on close if (doc) doc._originalBody = fields.body; syncHighlighting(); } // WYSIWYG: swap the source editor for the rich body and render the markdown. // The textarea above stays as the plain-text mirror (kept in sync below) so // send / draft / change-detection still read it. const _rich = document.getElementById('doc-email-richbody'); const _srcWrap = document.getElementById('doc-editor-wrap'); if (_rich && _srcWrap) { _srcWrap.style.display = 'none'; _rich.style.display = ''; if (_emailStreamAnimFrame) cancelAnimationFrame(_emailStreamAnimFrame); _emailStreamAnimFrame = null; _emailStreamRenderedBody = fields.body || ''; _emailStreamTargetBody = fields.body || ''; _rich.innerHTML = _emailBodyToHtml(fields.body); _wireEmailRichbody(_rich); setTimeout(() => { try { const _isTouch = ('ontouchstart' in window) || (navigator.maxTouchPoints || 0) > 0; if (!_isTouch) _focusEmailBodyEnd(); _rich.scrollTop = 0; } catch (_) {} }, 50); } // Render compose attachments (if any uploaded for this doc) _renderComposeAttachments(); // Populate CC/BCC from parsed header, show rows if populated const ccRow = document.getElementById('doc-email-cc-row'); const bccRow = document.getElementById('doc-email-bcc-row'); const ccToggle = document.getElementById('doc-email-show-cc'); _setEmailHeaderInputValue('doc-email-cc', fields.cc || '', { preserveFocused: !forceHeaderFields, preserveNonEmpty: preserveEmailHeader && !forceHeaderFields }); _setEmailHeaderInputValue('doc-email-bcc', fields.bcc || '', { preserveFocused: !forceHeaderFields, preserveNonEmpty: preserveEmailHeader && !forceHeaderFields }); const hasCcBcc = !!( fields.cc || fields.bcc || document.getElementById('doc-email-cc')?.value || document.getElementById('doc-email-bcc')?.value ); if (ccRow) ccRow.style.display = hasCcBcc ? '' : 'none'; if (bccRow) bccRow.style.display = hasCcBcc ? '' : 'none'; if (ccToggle) ccToggle.style.display = hasCcBcc ? 'none' : ''; _syncEmailHeaderSummary(); _stageForwardedSourceAttachments(fields).catch(err => console.error('Forward attachment staging failed:', err)); } function _syncStreamingEmailFields(doc) { if (!doc) return; const fields = _parseEmailHeader(doc.content || ''); const rich = document.getElementById('doc-email-richbody'); const srcWrap = document.getElementById('doc-editor-wrap'); const textarea = document.getElementById('doc-editor-textarea'); if (!rich || rich.style.display === 'none') { _showEmailFields(doc); return; } _setEmailHeaderInputValue('doc-email-to', fields.to, { preserveNonEmpty: true }); _setEmailHeaderInputValue('doc-email-subject', fields.subject, { preserveNonEmpty: true }); _setEmailHeaderInputValue('doc-email-in-reply-to', fields.inReplyTo, { preserveNonEmpty: true }); _setEmailHeaderInputValue('doc-email-references', fields.references, { preserveNonEmpty: true }); _setEmailHeaderInputValue('doc-email-source-uid', fields.sourceUid || '', { preserveNonEmpty: true }); _setEmailHeaderInputValue('doc-email-source-folder', fields.sourceFolder || '', { preserveNonEmpty: true }); _setEmailHeaderInputValue('doc-email-cc', fields.cc || '', { preserveNonEmpty: true }); _setEmailHeaderInputValue('doc-email-bcc', fields.bcc || '', { preserveNonEmpty: true }); const unreadBtn = document.getElementById('doc-email-unread-btn'); if (unreadBtn) unreadBtn.style.display = fields.sourceUid ? '' : 'none'; const ccRow = document.getElementById('doc-email-cc-row'); const bccRow = document.getElementById('doc-email-bcc-row'); const ccToggle = document.getElementById('doc-email-show-cc'); const hasCcBcc = !!(fields.cc || fields.bcc); if (ccRow) ccRow.style.display = hasCcBcc ? '' : 'none'; if (bccRow) bccRow.style.display = hasCcBcc ? '' : 'none'; if (ccToggle) ccToggle.style.display = hasCcBcc ? 'none' : ''; if (srcWrap) srcWrap.style.display = 'none'; rich.style.display = ''; _renderStreamingEmailBody(fields.body || ''); if (doc._originalBody == null) doc._originalBody = fields.body || ''; _syncEmailHeaderSummary(); } async function _uploadComposeFiles(files) { const list = Array.from(files || []); if (list.length === 0) return; const doc = docs.get(activeDocId); if (!doc) return; if (doc.language !== 'email') return; if (!doc._composeAtts) doc._composeAtts = []; for (const file of list) { try { const fd = new FormData(); fd.append('file', file); const res = await fetch(`${API_BASE}/api/email/compose-upload`, { method: 'POST', body: fd, }); const data = await res.json(); if (data.success) { doc._composeAtts.push({ token: data.token, filename: data.filename, size: data.size, }); } else { if (uiModule) uiModule.showError(`Failed to upload ${file.name}: ${data.error || ''}`); } } catch (err) { if (uiModule) uiModule.showError(`Failed to upload ${file.name}`); } } _renderComposeAttachments(); } async function _stageForwardedSourceAttachments(fields) { const doc = docs.get(activeDocId); if (!doc || doc.language !== 'email') return; if (!fields?.forwardAttachments || !fields.sourceUid || !Array.isArray(fields.attachments) || fields.attachments.length === 0) return; const sourceKey = `${fields.sourceFolder || 'INBOX'}:${fields.sourceUid}:${fields.attachments.map(a => a.index).join(',')}`; if (doc._forwardedAttachmentSourceKey === sourceKey) return; doc._forwardedAttachmentSourceKey = sourceKey; if (!doc._composeAtts) doc._composeAtts = []; const existingForwarded = new Set(doc._composeAtts.filter(a => a.forwardedSourceKey === sourceKey).map(a => String(a.sourceIndex))); let added = 0; for (const att of fields.attachments) { const sourceIndex = String(att.index); if (existingForwarded.has(sourceIndex)) continue; try { const folderQs = encodeURIComponent(fields.sourceFolder || 'INBOX'); const res = await fetch(`${API_BASE}/api/email/compose-from-attachment/${encodeURIComponent(fields.sourceUid)}/${encodeURIComponent(att.index)}?folder=${folderQs}`, { method: 'POST', credentials: 'same-origin', }); const data = await res.json(); if (!data.success) throw new Error(data.error || 'failed'); doc._composeAtts.push({ token: data.token, filename: data.filename || att.filename, size: data.size || att.size || 0, forwardedSourceKey: sourceKey, sourceIndex, }); added += 1; } catch (err) { console.error('Failed to stage forwarded attachment:', err); if (uiModule) uiModule.showError(`Forward attachment failed: ${att.filename || 'attachment'}`); } } if (added) { _renderComposeAttachments(); clearTimeout(_autoSaveDebounce); _autoSaveDebounce = setTimeout(() => { saveDocument({ silent: true }); }, 800); } } async function _handleAttachUpload(e) { const files = e.target.files; e.target.value = ''; // reset for next upload await _uploadComposeFiles(files); } let _odysseusAttachMenu = null; function _closeOdysseusAttachMenu() { if (_odysseusAttachMenu) { _odysseusAttachMenu.remove(); _odysseusAttachMenu = null; } document.removeEventListener('click', _attachMenuOutsideClick, true); document.removeEventListener('keydown', _attachMenuEscape, true); } function _attachMenuOutsideClick(e) { if (_odysseusAttachMenu && !_odysseusAttachMenu.contains(e.target)) _closeOdysseusAttachMenu(); } function _attachMenuEscape(e) { if (e.key !== 'Escape') return; _closeOdysseusAttachMenu(); } function _positionOdysseusAttachMenu(anchor, menu) { const r = anchor?.getBoundingClientRect?.(); if (!r) return; menu.style.left = `${Math.max(8, Math.min(r.left, window.innerWidth - 310))}px`; menu.style.top = `${r.bottom + 6}px`; requestAnimationFrame(() => { const mr = menu.getBoundingClientRect(); if (mr.bottom > window.innerHeight - 8) { menu.style.top = `${Math.max(8, r.top - mr.height - 6)}px`; } }); } function _odysseusAttachLabel(item, kind) { if (kind === 'gallery') { return item.caption || item.prompt || item.filename || 'Gallery image'; } return item.title || 'Untitled document'; } async function _stageOdysseusAttachment(kind, id) { const doc = docs.get(activeDocId); if (!doc || doc.language !== 'email') return null; if (!doc._composeAtts) doc._composeAtts = []; const res = await fetch(`${API_BASE}/api/email/compose-from-odysseus`, { method: 'POST', credentials: 'same-origin', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ kind, id }), }); let data = null; try { data = await res.json(); } catch (_) {} if (!res.ok || !data?.success) throw new Error(data?.error || data?.detail || `HTTP ${res.status}`); doc._composeAtts.push({ token: data.token, filename: data.filename, size: data.size || 0, }); return data; } async function _stageOdysseusZip(items) { const doc = docs.get(activeDocId); if (!doc || doc.language !== 'email') return null; if (!doc._composeAtts) doc._composeAtts = []; const res = await fetch(`${API_BASE}/api/email/compose-from-odysseus-zip`, { method: 'POST', credentials: 'same-origin', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ items }), }); let data = null; try { data = await res.json(); } catch (_) {} if (!res.ok || !data?.success) throw new Error(data?.error || data?.detail || `HTTP ${res.status}`); doc._composeAtts.push({ token: data.token, filename: data.filename, size: data.size || 0, }); return data; } function _afterOdysseusAttachmentsAdded(count, label) { _renderComposeAttachments(); clearTimeout(_autoSaveDebounce); _autoSaveDebounce = setTimeout(() => { saveDocument({ silent: true }); }, 800); if (uiModule) uiModule.showToast(count > 1 ? `Attached ${count} items` : `Attached ${label || 'item'}`); } async function _attachOdysseusItem(kind, id, label, opts = {}) { try { const data = await _stageOdysseusAttachment(kind, id); if (!data) return; _afterOdysseusAttachmentsAdded(1, label || data.filename); if (!opts.keepOpen) _closeOdysseusAttachMenu(); } catch (err) { console.error('Failed to attach Odysseus item:', err); if (uiModule) uiModule.showError('Failed to attach from Odysseus'); } } function _selectedOdysseusAttachRows(menu) { return Array.from(menu?.querySelectorAll?.('.email-odysseus-attach-row.is-selected') || []); } function _syncOdysseusAttachSelection(menu) { const selected = _selectedOdysseusAttachRows(menu); const bar = menu?.querySelector?.('.email-odysseus-attach-actions'); const count = menu?.querySelector?.('.email-odysseus-attach-count'); const attachBtn = menu?.querySelector?.('.email-odysseus-attach-selected'); if (bar) bar.style.display = ''; if (count) count.textContent = selected.length ? `${selected.length} selected` : 'Select items to attach'; if (attachBtn) attachBtn.disabled = selected.length === 0; } async function _attachSelectedOdysseusItems(menu) { const rows = _selectedOdysseusAttachRows(menu); if (!rows.length) return; const btn = menu.querySelector('.email-odysseus-attach-selected'); if (btn) { btn.disabled = true; btn.classList.add('is-loading'); } let added = 0; try { const items = rows.map(row => ({ kind: row.dataset.kind, id: row.dataset.id })).filter(x => x.kind && x.id); let zip = false; if (items.length > 5) { const ask = window.styledConfirm || uiModule?.styledConfirm; zip = ask ? await ask(`Attach ${items.length} files as one zip?`, { confirmText: 'Zip', cancelText: 'Separate' }) : window.confirm(`Attach ${items.length} files as one zip?`); } if (zip) { await _stageOdysseusZip(items); added = 1; } else { for (const item of items) { await _stageOdysseusAttachment(item.kind, item.id); added += 1; } } _afterOdysseusAttachmentsAdded(added, zip ? 'odysseus-attachments.zip' : undefined); _closeOdysseusAttachMenu(); } catch (err) { console.error('Failed to attach selected Odysseus items:', err); if (uiModule) uiModule.showError(added ? `Attached ${added}, then failed` : 'Failed to attach from Odysseus'); _renderComposeAttachments(); } finally { if (btn) { btn.classList.remove('is-loading'); btn.disabled = false; } } } async function _loadOdysseusAttachItems(menu, kind) { const list = menu.querySelector('.email-odysseus-attach-list'); if (!list) return; menu.dataset.odyAttachKind = kind; list.replaceChildren(spinnerModule.createLoadingRow('Loading…', 14)); menu.querySelectorAll('[data-ody-attach-kind]').forEach(btn => { btn.classList.toggle('active', btn.dataset.odyAttachKind === kind); }); const q = (menu.querySelector('.email-odysseus-attach-search')?.value || '').trim(); try { const params = new URLSearchParams({ sort: 'recent', limit: '20' }); if (q) params.set('search', q); const endpoint = kind === 'gallery' ? `${API_BASE}/api/gallery/library?${params}` : `${API_BASE}/api/documents/library?${params}`; const res = await fetch(endpoint, { credentials: 'same-origin' }); const data = await res.json(); if (!res.ok) throw new Error(data?.error || data?.detail || `HTTP ${res.status}`); const items = kind === 'gallery' ? (Array.isArray(data?.items) ? data.items : Array.isArray(data?.images) ? data.images : []) : (Array.isArray(data?.documents) ? data.documents : Array.isArray(data?.items) ? data.items : []); if (!items.length) { list.innerHTML = `
${q ? 'No matches' : `No ${kind === 'gallery' ? 'images' : 'documents'}`}
`;
_syncOdysseusAttachSelection(menu);
return;
}
list.innerHTML = '';
for (const item of items) {
const label = _odysseusAttachLabel(item, kind);
const row = document.createElement('button');
row.type = 'button';
row.className = `email-odysseus-attach-row ${kind === 'gallery' ? 'is-gallery' : ''}`;
row.dataset.id = item.id || '';
row.dataset.kind = kind;
if (kind === 'gallery') {
const src = item.url ? `${API_BASE}${item.url}` : '';
row.innerHTML = `
${src ? `Could not load
';
}
}
let _richImageInsertRange = null;
let _activeRichImage = null;
let _richImageToolbar = null;
function _hideRichImageToolbar() {
if (_richImageToolbar) _richImageToolbar.remove();
_richImageToolbar = null;
}
function _ensureRichImageToolbar(rich) {
if (_richImageToolbar?.isConnected) return _richImageToolbar;
const toolbar = document.createElement('div');
toolbar.className = 'doc-rich-image-toolbar';
toolbar.setAttribute('role', 'toolbar');
toolbar.setAttribute('aria-label', 'Image actions');
toolbar.innerHTML = `
`;
const position = () => {
if (!_activeRichImage?.isConnected) return _hideRichImageToolbar();
const rect = _activeRichImage.getBoundingClientRect();
const width = toolbar.offsetWidth || 58;
toolbar.style.left = `${Math.max(8, Math.min(window.innerWidth - width - 8, rect.right - width))}px`;
toolbar.style.top = `${Math.max(8, rect.top - toolbar.offsetHeight - 6)}px`;
};
toolbar.addEventListener('pointerdown', event => event.preventDefault());
toolbar.querySelector('.doc-rich-image-edit').addEventListener('click', event => {
event.preventDefault();
const imageButton = document.querySelector('[data-dd="image"]');
if (imageButton) {
imageButton.style.display = '';
_showMdDropdown(imageButton);
requestAnimationFrame(() => {
const menu = document.querySelector('#doc-md-dd-menu[data-dd="image"]');
if (!menu || !_activeRichImage?.isConnected) return;
const imageRect = _activeRichImage.getBoundingClientRect();
const menuRect = menu.getBoundingClientRect();
menu.style.top = `${Math.max(8, imageRect.top - menuRect.height - 6)}px`;
menu.style.left = `${Math.max(8, Math.min(window.innerWidth - menuRect.width - 8, imageRect.left))}px`;
});
}
});
toolbar.querySelector('.doc-rich-image-remove').addEventListener('click', event => {
event.preventDefault();
if (_activeRichImage?.isConnected) _deleteRichImage(rich, _activeRichImage);
});
document.body.appendChild(toolbar);
_richImageToolbar = toolbar;
requestAnimationFrame(position);
return toolbar;
}
function _insertRichGalleryImage(rich, item) {
const source = item?.url || item?.src || '';
if (!rich || !source) return;
const image = document.createElement('img');
image.className = 'richtext-image';
image.src = source.startsWith('http') ? source : `${API_BASE}${source}`;
image.alt = _markdownImageAlt(item.filename || item.name || item.caption || 'Gallery image');
let range = _richImageInsertRange;
if (!range || !rich.contains(range.commonAncestorContainer)) {
range = document.createRange();
range.selectNodeContents(rich);
range.collapse(false);
}
const selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);
const token = `doc-gallery-image-${Date.now()}-${Math.random().toString(36).slice(2, 8)}`;
image.dataset.editorImageToken = token;
document.execCommand('insertHTML', false, `${image.outerHTML}`); const inserted = rich.querySelector(`[data-editor-image-token="${token}"]`); if (inserted) { inserted.removeAttribute('data-editor-image-token'); _selectRichImage(rich, inserted); } _richImageInsertRange = null; _syncEmailRichbody(rich); _scheduleEmailRichbodySave(); } function _showRichImageSourceMenu(anchor) { document.querySelector('.doc-rich-image-source-menu')?.remove(); const rich = _emailRichbodyActive(); if (!rich) return; const selection = window.getSelection(); _richImageInsertRange = null; if (selection?.rangeCount && rich.contains(selection.getRangeAt(0).commonAncestorContainer)) { _richImageInsertRange = selection.getRangeAt(0).cloneRange(); } const menu = document.createElement('div'); menu.className = 'doc-rich-image-source-menu'; menu.innerHTML = `
Add image
`;
document.body.appendChild(menu);
const rect = anchor?.getBoundingClientRect?.() || { left: 12, bottom: 40 };
menu.style.left = `${Math.max(8, Math.min(window.innerWidth - menu.offsetWidth - 8, rect.left))}px`;
menu.style.top = `${Math.min(window.innerHeight - menu.offsetHeight - 8, rect.bottom + 5)}px`;
menu.querySelector('[data-image-source="computer"]').addEventListener('click', () => {
menu.remove();
document.getElementById('doc-md-image-input')?.click();
});
menu.querySelector('[data-image-source="gallery"]').addEventListener('click', async () => {
menu.innerHTML = 'Choose from Gallery
Loading…
';
try {
const response = await fetch(`${API_BASE}/api/gallery/library?sort=recent&limit=30`, { credentials: 'same-origin' });
const data = await response.json().catch(() => ({}));
if (!response.ok) throw new Error(data?.error || `HTTP ${response.status}`);
const items = Array.isArray(data?.items) ? data.items : Array.isArray(data?.images) ? data.images : [];
const list = menu.querySelector('.doc-rich-gallery-list');
if (!items.length) { list.textContent = 'No gallery images'; return; }
list.replaceChildren(...items.map(item => {
const button = document.createElement('button');
button.type = 'button';
button.className = 'doc-rich-gallery-item';
button.innerHTML = `${_escHtml(item.caption || item.filename || item.name || 'Gallery image')}`;
const thumb = button.querySelector('.doc-rich-gallery-thumb');
const src = item.url || item.src || '';
if (src) thumb.style.backgroundImage = `url("${src.startsWith('http') ? src : `${API_BASE}${src}`}" )`;
button.addEventListener('click', () => { menu.remove(); _insertRichGalleryImage(rich, item); });
return button;
}));
menu.style.top = `${Math.max(8, Math.min(window.innerHeight - menu.offsetHeight - 8, rect.bottom + 5))}px`;
} catch (error) {
menu.querySelector('.doc-rich-gallery-list').textContent = 'Could not load gallery';
console.warn('Failed to load gallery images:', error);
}
});
setTimeout(() => {
const close = event => {
if (!menu.contains(event.target) && event.target !== anchor) {
menu.remove();
document.removeEventListener('click', close, true);
}
};
document.addEventListener('click', close, true);
}, 0);
}
function _showComposeAttachMenu(anchor) {
const activeLanguage = _activeDocLanguage();
if (_isRichTextLang(activeLanguage)) {
_showRichImageSourceMenu(anchor);
return;
}
if (activeLanguage !== 'email') {
document.getElementById('doc-md-image-input')?.click();
return;
}
_closeOdysseusAttachMenu();
const menu = document.createElement('div');
menu.className = 'email-odysseus-attach-menu';
menu.innerHTML = `
')}
`); const inserted = rich.querySelector(`[data-editor-image-token="${token}"]`); if (inserted) { inserted.removeAttribute('data-editor-image-token'); _selectRichImage(rich, inserted); } _richImageInsertRange = null; _syncEmailRichbody(rich); _scheduleEmailRichbodySave(); } function _normalizeRichTextImages(root) { root.querySelectorAll('figure.richtext-image').forEach(figure => { const image = figure.querySelector('img'); if (!image) return; image.classList.add('richtext-image'); const legacyCaption = figure.querySelector(':scope > figcaption'); if (legacyCaption) { const caption = document.createElement('div'); caption.className = 'richtext-image-caption'; caption.setAttribute('role', 'note'); caption.setAttribute('aria-label', 'Image caption'); caption.setAttribute('contenteditable', 'false'); caption.innerHTML = legacyCaption.innerHTML; legacyCaption.replaceWith(caption); } const caption = figure.querySelector(':scope > .richtext-image-caption'); if (caption) { caption.setAttribute('role', 'note'); caption.setAttribute('aria-label', 'Image caption'); caption.setAttribute('contenteditable', 'false'); } Array.from(figure.classList).forEach(name => { if (name.startsWith('richtext-image-size-') || name.startsWith('richtext-image-align-')) { image.classList.add(name); figure.classList.remove(name); } }); if (figure.hasAttribute('data-editor-image-selected')) { figure.removeAttribute('data-editor-image-selected'); image.dataset.editorImageSelected = 'true'; } }); } function _clearRichImageSelection() { _hideRichImageToolbar(); if (_activeRichImage?.isConnected) { _activeRichImage.removeAttribute('data-editor-image-selected'); } document.querySelectorAll('#doc-email-richbody [data-editor-image-selected]').forEach(image => { image.removeAttribute('data-editor-image-selected'); }); _activeRichImage = null; const imageButton = document.querySelector('[data-dd="image"]'); if (imageButton) { imageButton.style.display = 'none'; imageButton.classList.remove('is-active'); imageButton.disabled = true; imageButton.setAttribute('aria-disabled', 'true'); } } function _selectRichImage(rich, image) { if (!image || !rich.contains(image)) { _clearRichImageSelection(); return; } _clearRichImageSelection(); _activeRichImage = image; image.dataset.editorImageSelected = 'true'; const imageButton = document.querySelector('[data-dd="image"]'); if (imageButton) { imageButton.style.display = ''; imageButton.classList.add('is-active'); imageButton.disabled = false; imageButton.setAttribute('aria-disabled', 'false'); } _ensureRichImageToolbar(rich); requestAnimationFrame(() => { if (!_richImageToolbar?.isConnected || !_activeRichImage?.isConnected) return; const rect = _activeRichImage.getBoundingClientRect(); const width = _richImageToolbar.offsetWidth || 58; _richImageToolbar.style.left = `${Math.max(8, Math.min(window.innerWidth - width - 8, rect.right - width))}px`; _richImageToolbar.style.top = `${Math.max(8, rect.top - _richImageToolbar.offsetHeight - 6)}px`; }); rich.focus({ preventScroll: true }); const range = document.createRange(); range.selectNode(image); const selection = window.getSelection(); selection.removeAllRanges(); selection.addRange(range); } function _selectedRichImage(rich) { if (_activeRichImage?.isConnected && rich.contains(_activeRichImage)) { return _activeRichImage; } const element = _richSelectionElement(rich); const image = element?.closest?.('img.richtext-image, figure.richtext-image img'); return image && rich.contains(image) ? image : null; } function _replaceRichImage(rich, original, replacement) { const figure = original.closest('figure.richtext-image'); if (figure) { const figureClone = figure.cloneNode(true); const clonedImage = figureClone.querySelector('img.richtext-image, img'); if (!clonedImage) return null; clonedImage.replaceWith(replacement); return _replaceRichImageFigure(rich, original, figureClone); } const token = `doc-image-${Date.now()}-${Math.random().toString(36).slice(2, 8)}`; replacement.dataset.editorImageToken = token; replacement.removeAttribute('data-editor-image-selected'); const range = document.createRange(); range.selectNode(original); const selection = window.getSelection(); selection.removeAllRanges(); selection.addRange(range); document.execCommand('insertHTML', false, replacement.outerHTML); const inserted = rich.querySelector(`[data-editor-image-token="${token}"]`); if (!inserted) return null; inserted.removeAttribute('data-editor-image-token'); _selectRichImage(rich, inserted); return inserted; } function _replaceRichImageFigure(rich, image, replacement) { const original = image.closest('figure.richtext-image') || image; const token = `doc-image-${Date.now()}-${Math.random().toString(36).slice(2, 8)}`; replacement.dataset.editorImageToken = token; replacement.removeAttribute('data-editor-image-selected'); replacement.querySelectorAll?.('[data-editor-image-selected]').forEach(item => { item.removeAttribute('data-editor-image-selected'); }); const range = document.createRange(); range.selectNode(original); const selection = window.getSelection(); selection.removeAllRanges(); selection.addRange(range); if (!document.execCommand('insertHTML', false, replacement.outerHTML)) return null; const inserted = rich.querySelector(`[data-editor-image-token="${token}"]`); if (!inserted) return null; inserted.removeAttribute('data-editor-image-token'); const insertedImage = inserted.matches('img') ? inserted : inserted.querySelector('img.richtext-image, img'); if (insertedImage) _selectRichImage(rich, insertedImage); return insertedImage; } function _deleteRichImage(rich, image) { const range = document.createRange(); range.selectNode(image); const selection = window.getSelection(); selection.removeAllRanges(); selection.addRange(range); document.execCommand('delete'); _clearRichImageSelection(); rich.focus(); } async function _uploadMarkdownImages(files) { const images = Array.from(files || []).filter(_isMarkdownImageFile); if (!images.length) { if (uiModule) uiModule.showError('Choose an image file'); return; } const language = _activeDocLanguage(); const emailRichBody = language === 'email' && _emailRichbodyActive(); if (language !== 'markdown' && !_isRichTextLang(language) && !emailRichBody) { if (uiModule) uiModule.showError('Switch the document to Markdown or Rich Text before inserting images'); return; } const fd = new FormData(); images.forEach(file => fd.append('files', file)); try { const res = await fetch(`${API_BASE}/api/upload`, { method: 'POST', credentials: 'same-origin', body: fd, }); let data = null; try { data = await res.json(); } catch (_) {} if (!res.ok) throw new Error((data && (data.error || data.detail)) || `HTTP ${res.status}`); const uploaded = Array.isArray(data?.files) ? data.files : []; if (!uploaded.length) throw new Error('No uploaded files returned'); if (_isRichTextLang(language) || emailRichBody) _insertRichTextImages(uploaded); else _insertMarkdownImages(uploaded); if (uiModule) uiModule.showToast(images.length === 1 ? 'Image inserted' : 'Images inserted'); } catch (err) { console.error('Failed to insert markdown image:', err); if (uiModule) uiModule.showError('Failed to insert image'); } } async function _handleMarkdownImageUpload(e) { const files = e.target.files; e.target.value = ''; await _uploadMarkdownImages(files); } function _renderComposeAttachments() { const container = document.getElementById('doc-email-compose-atts'); if (!container) return; const doc = docs.get(activeDocId); const atts = doc?._composeAtts || []; if (atts.length === 0) { container.style.display = 'none'; container.innerHTML = ''; return; } container.style.display = ''; container.innerHTML = ''; for (const att of atts) { const chip = document.createElement('span'); chip.className = 'email-compose-chip'; const sizeKb = att.size > 0 ? `${Math.round(att.size / 1024)} KB` : ''; chip.innerHTML = ` ${_escHtml(att.filename)} ${sizeKb} `; chip.querySelector('.compose-chip-remove').addEventListener('click', async (e) => { e.stopPropagation(); try { await fetch(`${API_BASE}/api/email/compose-upload/${encodeURIComponent(att.token)}`, { method: 'DELETE' }); } catch (_) {} const d = docs.get(activeDocId); if (d) d._composeAtts = d._composeAtts.filter(a => a.token !== att.token); _renderComposeAttachments(); }); container.appendChild(chip); } } // Split a To/Cc/Bcc text field into recipients + the in-progress fragment // the user is currently typing (after the last comma). Returns a tuple so // we can show suggestions for just the fragment without disturbing the // already-confirmed recipients. function _splitRecipientsAndFragment(rawValue) { const cut = (rawValue || '').lastIndexOf(','); if (cut < 0) return { confirmed: '', fragment: (rawValue || '').trimStart() }; return { confirmed: rawValue.slice(0, cut + 1).trimStart(), fragment: rawValue.slice(cut + 1).trimStart(), }; } // Replace the in-progress fragment in `input` with the chosen email, // append ", " so the user can type the next recipient immediately, then // hide the suggestion dropdown. function _commitRecipient(input, sugg, email) { if (!input) return; const { confirmed } = _splitRecipientsAndFragment(input.value); // Preserve a single trailing space between commas for readability. const head = confirmed ? confirmed.replace(/\s+$/, '') + ' ' : ''; input.value = head + email + ', '; if (sugg) sugg.style.display = 'none'; input.focus(); // Caret to end so the next keystroke lands in the right place. const end = input.value.length; try { input.setSelectionRange(end, end); } catch (_) {} } // Search contacts for an autocomplete dropdown. `input` is the To/Cc/Bcc // text field, `sugg` is its sibling .email-autocomplete div. Suggestions // are scoped to the LAST comma-separated fragment so already-entered // recipients aren't disturbed. function _showContactSearchStatus(sugg, message, state = '') { sugg.innerHTML = ''; const notice = document.createElement('div'); notice.className = `contact-suggestion-status${state ? ` is-${state}` : ''}`; notice.setAttribute('role', 'status'); notice.textContent = message; sugg.appendChild(notice); sugg.style.display = ''; } async function _searchContacts(input, sugg) { if (!input || !sugg) return; const { fragment } = _splitRecipientsAndFragment(input.value); if (!fragment || fragment.length < 1) { sugg.style.display = 'none'; return; } const searchedFragment = fragment; _showContactSearchStatus(sugg, 'Searching contacts...', 'loading'); try { const res = await fetch(`${API_BASE}/api/contacts/search?q=${encodeURIComponent(fragment)}`); const data = await res.json(); // A later keystroke started another lookup while this one was in flight. if (_splitRecipientsAndFragment(input.value).fragment !== searchedFragment) return; if (!data.results || data.results.length === 0) { if (data.sync?.state === 'unavailable' || data.sync?.state === 'local') { _showContactSearchStatus(sugg, data.sync.message, data.sync.state); } else { sugg.style.display = 'none'; } return; } // Already-entered emails in this field — skip in the dropdown so // users don't accidentally add the same person twice. const already = new Set( (input.value || '').split(',').map(s => { const m = s.match(/<([^>]+)>/); return (m ? m[1] : s).trim().toLowerCase(); }).filter(Boolean) ); sugg.innerHTML = ''; sugg.dataset.navStarted = '0'; let count = 0; for (const c of data.results) { for (const em of (c.emails || [])) { if (already.has(em.toLowerCase())) continue; const item = document.createElement('div'); item.className = 'contact-suggestion'; item.setAttribute('role', 'option'); item.setAttribute('aria-selected', 'false'); item.innerHTML = `${_escHtml(c.name)}${_escHtml(em)}`; item.addEventListener('mouseenter', () => { sugg.dataset.navStarted = '1'; sugg.querySelectorAll('.contact-suggestion').forEach(it => { it.classList.toggle('active', it === item); it.setAttribute('aria-selected', it === item ? 'true' : 'false'); }); }); // mousedown fires before blur so the click doesn't get lost item.addEventListener('mousedown', (e) => { e.preventDefault(); _commitRecipient(input, sugg, em); }); item.addEventListener('click', (e) => { e.preventDefault(); _commitRecipient(input, sugg, em); }); sugg.appendChild(item); count += 1; } } if (count === 0) { sugg.style.display = 'none'; return; } sugg.style.display = ''; } catch (e) { if (_splitRecipientsAndFragment(input.value).fragment !== searchedFragment) return; _showContactSearchStatus(sugg, 'Unable to search contacts.', 'unavailable'); } } // Bind input/keydown/blur for a recipient field so it gets the same // autocomplete-and-commit behavior. Used by To/Cc/Bcc. function _wireRecipientAutocomplete(inputId, suggId) { const input = document.getElementById(inputId); const sugg = document.getElementById(suggId); if (!input || !sugg) return; let timer = null; input.addEventListener('input', () => { if (timer) clearTimeout(timer); timer = setTimeout(() => _searchContacts(input, sugg), 150); }); input.addEventListener('blur', () => { setTimeout(() => { sugg.style.display = 'none'; }, 200); }); input.addEventListener('keydown', (e) => { const open = sugg.style.display !== 'none'; const items = open ? sugg.querySelectorAll('.contact-suggestion') : []; const active = open ? sugg.querySelector('.contact-suggestion.active') : null; let idx = active ? Array.from(items).indexOf(active) : -1; const setActive = (nextIdx) => { items.forEach((it, i) => { const on = i === nextIdx; it.classList.toggle('active', on); it.setAttribute('aria-selected', on ? 'true' : 'false'); }); if (items[nextIdx]) { items[nextIdx].scrollIntoView({ block: 'nearest' }); } }; if (open && e.key === 'ArrowDown') { e.preventDefault(); if (!items.length) return; if (sugg.dataset.navStarted !== '1') { idx = Math.max(0, idx); sugg.dataset.navStarted = '1'; } else { idx = Math.min(items.length - 1, idx + 1); } setActive(idx); } else if (open && e.key === 'ArrowUp') { e.preventDefault(); if (!items.length) return; sugg.dataset.navStarted = '1'; idx = Math.max(0, idx - 1); setActive(idx); } else if (e.key === 'Enter') { // If a suggestion is highlighted, commit it. Otherwise — if the // current fragment already looks like a complete email — commit // the raw text so users who type a brand-new address don't have // to add the comma themselves. if (active) { e.preventDefault(); const em = active.querySelector('.contact-email')?.textContent?.trim(); if (em) _commitRecipient(input, sugg, em); } else { const { fragment } = _splitRecipientsAndFragment(input.value); if (/^[^@\s,]+@[^@\s,]+\.[^@\s,]+$/.test(fragment.trim())) { e.preventDefault(); _commitRecipient(input, sugg, fragment.trim()); } } } else if (e.key === 'Tab' && active) { e.preventDefault(); const em = active.querySelector('.contact-email')?.textContent?.trim(); if (em) _commitRecipient(input, sugg, em); } else if (e.key === 'Escape') { sugg.style.display = 'none'; } else if (e.key === ',' || (e.key === ' ' && input.value.trim().endsWith(','))) { // Typing a comma directly also accepts a highlighted suggestion. if (active) { e.preventDefault(); const em = active.querySelector('.contact-email')?.textContent?.trim(); if (em) _commitRecipient(input, sugg, em); } } }); } function _hideEmailFields() { _hideRichSelectionToolbar(); _hideRichSlashMenu(); const emailHeader = document.getElementById('doc-email-header'); const emailActions = document.getElementById('doc-email-actions'); if (emailHeader) emailHeader.style.display = 'none'; if (emailActions) emailActions.style.display = 'none'; // Restore toolbar items that were hidden for email (Code dropdown). document.querySelectorAll('.md-toolbar-email-hide').forEach(el => { el.style.display = ''; }); // Re-hide email-only toolbar items (AI reply button). document.querySelectorAll('.md-toolbar-email-only').forEach(el => { el.style.display = 'none'; }); // Restore the generic documents action bar + its bottom footer (Close / // Copy / Export) for non-email docs. const docActions = document.getElementById('doc-editor-actions'); if (docActions) docActions.style.display = ''; const docFooter = document.getElementById('doc-actions-footer'); if (docFooter) docFooter.style.display = ''; // Return the type picker to its non-email home (right before the // Copy/Export split) — _showEmailFields moved it into the email footer. if (docFooter) { const _lang = document.getElementById('doc-language-select'); const _langPicker = document.getElementById('doc-langpicker-trigger'); const _split = docFooter.querySelector('#doc-copy-export-split'); if (_lang && _split) docFooter.insertBefore(_lang, _split); if (_langPicker && _split) { _langPicker.classList.remove('doc-langpicker-email-compact'); _langPicker.title = 'Change document type'; docFooter.insertBefore(_langPicker, _split); } } // Restore the source editor and hide the WYSIWYG email body. const _rich = document.getElementById('doc-email-richbody'); if (_rich) { _rich.style.display = 'none'; _rich.classList.remove('richtext-mode'); _rich.setAttribute('aria-label', 'Email body'); } const _srcWrap = document.getElementById('doc-editor-wrap'); if (_srcWrap) _srcWrap.style.display = ''; // Drop the email-mode class so editors return to monospace monochrome document.getElementById('doc-editor-textarea')?.classList.remove('email-mode'); document.getElementById('doc-editor-code')?.classList.remove('email-mode'); document.getElementById('doc-editor-highlight')?.classList.remove('email-mode'); } const _ATTACH_RE = /\b(attach(ed|ment|ments|ing)?|enclosed|enclosing|PFA|find attached|see attached|ci-joint|en pi[eè]ce jointe|ajout[eé]|joint|jointe|anbei|im Anhang|beigef[uü]gt|添付|fichier joint)\b/i; function _bodyMentionsAttachment(text) { if (!text) return false; // WYSIWYG replies render quoted mail as a non-editable block, so the // plain-text mirror does not always retain a leading `>` or an `On … // wrote:` line. Reuse the full reply parser to exclude every quote form. return _ATTACH_RE.test(_emailReplyOwnText(text)); } function _clearMissingAttachmentWarnings() { document.querySelectorAll('.email-attachment-warning-modal').forEach(el => el.remove()); } function _confirmMissingAttachment() { return new Promise(resolve => { _clearMissingAttachmentWarnings(); const overlay = document.createElement('div'); overlay.className = 'modal email-attachment-warning-modal'; overlay.style.display = 'flex'; overlay.innerHTML = ` `; document.body.appendChild(overlay); const cleanup = (val) => { overlay.remove(); resolve(val); }; overlay.querySelector('#att-warn-cancel').addEventListener('click', () => cleanup(false)); overlay.querySelector('#att-warn-send').addEventListener('click', () => { _clearMissingAttachmentWarnings(); resolve(true); }); overlay.addEventListener('click', (e) => { if (e.target === overlay) cleanup(false); }); }); } // Persist a compose in the mailbox before sending. The draft is the // recovery copy; it is removed by the send endpoint only after delivery and // Sent-folder append both succeed. async function _saveEmailDraftForRecovery({ accountId, doc, to, cc, bcc, subject, body, bodyHtml, inReplyTo, references, attachments, }) { const controller = new AbortController(); const timeout = setTimeout(() => controller.abort(), 18000); try { const res = await fetch(`${API_BASE}/api/email/draft`, { method: 'POST', credentials: 'same-origin', headers: { 'Content-Type': 'application/json' }, signal: controller.signal, body: JSON.stringify({ to: to || '', cc: cc || null, bcc: bcc || null, subject: subject || '', body: body || '', body_html: bodyHtml, in_reply_to: inReplyTo || null, references: references || null, account_id: accountId || null, attachments: attachments?.length ? attachments : null, draft_uid: doc?._emailDraftUid || null, draft_folder: doc?._emailDraftFolder || null, }), }); let data = null; try { data = await res.json(); } catch (_) { data = null; } if (!res.ok || !data?.success) { throw new Error(data?.error || `Draft save failed (${res.status})`); } if (doc) { doc._emailDraftUid = data.draft_uid || doc._emailDraftUid || null; doc._emailDraftFolder = data.draft_folder || doc._emailDraftFolder || null; } return data; } catch (e) { if (e?.name === 'AbortError') throw new Error('Saving draft timed out'); throw e; } finally { clearTimeout(timeout); } } async function _sendEmail() { if (_emailSendInFlight) { if (uiModule) uiModule.showToast('Already sending'); return; } if (uiModule) uiModule.showToast('Preparing send', { duration: 1200 }); const sendDocId = activeDocId; const to = document.getElementById('doc-email-to')?.value?.trim(); const cc = document.getElementById('doc-email-cc')?.value?.trim() || ''; const bcc = document.getElementById('doc-email-bcc')?.value?.trim() || ''; const subject = document.getElementById('doc-email-subject')?.value?.trim(); const inReplyTo = document.getElementById('doc-email-in-reply-to')?.value?.trim(); const references = document.getElementById('doc-email-references')?.value?.trim(); const sourceUid = document.getElementById('doc-email-source-uid')?.value?.trim(); const sourceFolder = document.getElementById('doc-email-source-folder')?.value?.trim() || 'INBOX'; // WYSIWYG: the rich body's HTML becomes the email's HTML part (server // sanitizes it). `body` (plain text mirror) stays the text/plain fallback. const _rich = _emailRichbodyActive(); if (_rich) _syncEmailRichbody(_rich); const textarea = document.getElementById('doc-editor-textarea'); const rawBody = (_rich ? (_rich.innerText || _rich.textContent || '') : (textarea?.value || '')).trim(); const body = _sanitizeOutgoingEmailBody(rawBody); let bodyHtml = _rich ? _rich.innerHTML : null; if (_rich && body !== rawBody) bodyHtml = _emailBodyToHtml(body); const doc = docs.get(activeDocId); const attachments = (doc?._composeAtts || []).map(a => a.token); if (!to || !body) { if (uiModule) uiModule.showError('To and body are required'); return; } if (inReplyTo && !_emailReplyOwnText(body)) { if (uiModule) uiModule.showError('Reply body is empty'); return; } // Warn if body mentions attachments but none are actually attached if (attachments.length === 0 && _bodyMentionsAttachment(body)) { const proceed = await _confirmMissingAttachment(); if (!proceed) return; _clearMissingAttachmentWarnings(); } const btn = Array.from(document.querySelectorAll('#doc-email-send-btn')).find((candidate) => candidate.offsetParent !== null) || document.getElementById('doc-email-send-btn'); let sendSpinner = null; let origBtnHtml = ''; let recoveryDraftSaved = Boolean(doc?._emailDraftUid); _emailSendInFlight = true; if (btn) { btn.disabled = true; origBtnHtml = btn.innerHTML; sendSpinner = spinnerModule.createWhirlpool(14); sendSpinner.element.style.cssText = 'display:inline-block;vertical-align:-2px;margin-right:6px;width:14px;height:14px;'; btn.innerHTML = ''; btn.appendChild(sendSpinner.element); btn.appendChild(document.createTextNode('Sending')); } try { if (uiModule) uiModule.showToast('Sending', { duration: 2200, leadingIcon: 'spinner', toastClass: 'toast-sending' }); const activeAccountIdPromise = _resolveComposeSendAccountId(); const activeAccountId = await activeAccountIdPromise; // Do this before SMTP can start. If saving the recovery copy fails, do // not send an email that the user cannot reopen after a disconnect. const recoveryDraft = await _saveEmailDraftForRecovery({ accountId: activeAccountId, doc, to, cc, bcc, subject, body, bodyHtml, inReplyTo, references, attachments, }); recoveryDraftSaved = true; const sendRequest = fetch(`${API_BASE}/api/email/send`, { method: 'POST', credentials: 'same-origin', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ to, cc: cc || null, bcc: bcc || null, subject, body, body_html: bodyHtml, in_reply_to: inReplyTo || null, references: references || null, attachments: attachments.length > 0 ? attachments : null, account_id: activeAccountId, source_uid: sourceUid || null, source_folder: sourceFolder || null, draft_uid: recoveryDraft.draft_uid || doc?._emailDraftUid || null, draft_folder: recoveryDraft.draft_folder || doc?._emailDraftFolder || null, wait_for_delivery: true, }), }); // Remote SMTP/IMAP confirmation can take several seconds. The request // is now committed, so close the composer while the captured document // remains available as the recovery draft until delivery is confirmed. if (isLibraryOpen()) closeLibrary(); if (isOpen && activeDocId === sendDocId) closePanel(); const res = await sendRequest; let data = null; try { data = await res.json(); } catch (_) { data = { success: false, error: `Send failed (${res.status})` }; } if (!res.ok && data && !data.error) data.error = `Send failed (${res.status})`; if (data.success) { _clearMissingAttachmentWarnings(); // The send endpoint appends the message to Sent, but an already-open // email library needs an explicit fresh load to show it immediately. import('./emailLibrary.js?v=20260910replyactions1').then(mod => { const refresh = mod.refreshEmailLibrary || (mod.default && mod.default.refreshEmailLibrary); if (refresh) return refresh(); return undefined; }).catch(() => {}); if (uiModule) { uiModule.showToast('Message sent', { duration: 7000, leadingIcon: 'check', toastClass: 'toast-message-sent', action: 'View Message', onAction: async () => { import('./emailLibrary.js?v=20260910replyactions1').then(async mod => { const open = mod.openEmailLibrary || (mod.default && mod.default.openEmailLibrary); const refresh = mod.refreshEmailLibrary || (mod.default && mod.default.refreshEmailLibrary); if (open) open({ account_id: data.account_id || activeAccountId || null, folder: data.sent_folder || 'Sent', uid: data.sent_uid || null, }); // The new message is not guaranteed to be in the cached Sent // snapshot used during open. Refresh after the modal has // mounted so the pending UID can expand when the server list // returns, without requiring a second manual refresh click. if (refresh) { await new Promise(resolve => setTimeout(resolve, 0)); await refresh(); } }).catch(() => {}); }, }); } // Auto-save recipients to the configured contacts backend (CardDAV). // The compose fields accept plain emails and "Name
1