@shelamkoff/rector 1.0.0

package/dist/core/inline-toolbar/SelectionTracker.js

@@ -0,0 +1,173 @@
+/**
+ * @typedef {Object} SelectionTrackerDeps
+ * @property {HTMLElement} rootEl
+ * @property {import('../types').IBlockReader} blocks
+ * @property {import('../types').ICrossBlockSelection} crossBlockSelection
+ * @property {() => void} show
+ * @property {() => void} hide
+ * @property {() => void} updateActiveStates
+ * @property {() => boolean} isInActionsView
+ *   Returns true while the actions panel is open — selectionchange should be ignored.
+ * @property {() => boolean} isTypeSelectorOpen
+ * @property {() => boolean} hasOpenToolDropdown
+ */
+
+/**
+ * Tracks the user's selection and decides when the inline toolbar should
+ * appear or disappear.
+ *
+ * Listens to:
+ *  - `selectionchange` on document — fires when the caret moves or text
+ *    is selected. Filtered through several "is something else interactive"
+ *    checks (actions panel, type selector, tool dropdown, mouse-down).
+ *  - `mousedown`/`mouseup` on document — defers checks until the user
+ *    finishes their drag-select. Without this we'd flicker the toolbar
+ *    while the selection is still growing.
+ *  - `mousedown` on document (capture) — closes the toolbar when the
+ *    user clicks outside it.
+ *
+ * Decision logic in `checkSelection`:
+ *  - empty/no selection → hide (unless cross-block selection is active)
+ *  - single text block with `hasInlineTools` → show
+ *  - cross-block range covering only text-blocks → show
+ *  - any non-text block in the range → hide
+ */
+export class SelectionTracker {
+  /** @type {SelectionTrackerDeps} */
+  #deps
+
+  /** @type {HTMLElement} */
+  #toolbarEl
+
+  /** @type {boolean} */
+  #isMouseDown = false
+
+  /** @type {boolean} */
+  #suppressSelectionChange = false
+
+  /**
+   * @param {HTMLElement} toolbarEl
+   * @param {SelectionTrackerDeps} deps
+   */
+  constructor(toolbarEl, deps) {
+    this.#toolbarEl = toolbarEl
+    this.#deps = deps
+
+    document.addEventListener('selectionchange', this.#onSelectionChange)
+    deps.rootEl.addEventListener('mousedown', this.#onEditorMouseDown)
+    document.addEventListener('mouseup', this.#onDocumentMouseUp)
+    document.addEventListener('mousedown', this.#onDocumentMouseDown, true)
+  }
+
+  destroy() {
+    document.removeEventListener('selectionchange', this.#onSelectionChange)
+    this.#deps.rootEl.removeEventListener('mousedown', this.#onEditorMouseDown)
+    document.removeEventListener('mouseup', this.#onDocumentMouseUp)
+    document.removeEventListener('mousedown', this.#onDocumentMouseDown, true)
+  }
+
+  /**
+   * Suppress the next round of selectionchange events. Used by plugin
+   * controls during DOM swaps that would otherwise trigger a hide.
+   *
+   * @param {boolean} value
+   */
+  setSuppressSelectionChange(value) {
+    this.#suppressSelectionChange = value
+  }
+
+  // ── Event handlers ──────────────────────────────────────────────────────────
+
+  #onSelectionChange = () => {
+    if (this.#deps.isInActionsView()) return
+    if (this.#suppressSelectionChange) return
+    if (this.#isMouseDown) return
+    if (this.#deps.isTypeSelectorOpen()) return
+    if (this.#deps.hasOpenToolDropdown()) return
+
+    this.#checkSelection()
+  }
+
+  #onEditorMouseDown = () => {
+    this.#isMouseDown = true
+  }
+
+  #onDocumentMouseUp = () => {
+    if (!this.#isMouseDown) return
+    this.#isMouseDown = false
+
+    requestAnimationFrame(() => {
+      if (this.#suppressSelectionChange) return
+      if (this.#deps.isInActionsView()) return
+      if (this.#deps.isTypeSelectorOpen()) return
+      if (this.#deps.hasOpenToolDropdown()) return
+      this.#checkSelection()
+    })
+  }
+
+  #onDocumentMouseDown = (/** @type {MouseEvent} */ e) => {
+    if (this.#toolbarEl.style.display === 'none') return
+    const target = e.target
+    if (!(target instanceof Node)) return
+    if (this.#toolbarEl.contains(target)) return
+    this.#deps.hide()
+  }
+
+  // ── Decision ────────────────────────────────────────────────────────────────
+
+  #checkSelection() {
+    const sel = window.getSelection()
+    if (!sel || sel.isCollapsed || !sel.rangeCount) {
+      // Cross-block selection is held in our custom store; native selection
+      // gets clipped at editing-host boundaries, so an empty native selection
+      // doesn't necessarily mean we should hide.
+      if (this.#deps.crossBlockSelection.range) {
+        if (this.#toolbarEl.style.display === 'none') this.#deps.show()
+        else this.#deps.updateActiveStates()
+        return
+      }
+      this.#deps.hide()
+      return
+    }
+
+    const range = sel.getRangeAt(0)
+    const text = sel.toString()
+    if (!text.length) {
+      this.#deps.hide()
+      return
+    }
+
+    const startBlock = this.#deps.blocks.getBlockByChildNode(range.startContainer)
+    const endBlock = this.#deps.blocks.getBlockByChildNode(range.endContainer)
+    if (!startBlock) {
+      this.#deps.hide()
+      return
+    }
+
+    // Single block selection.
+    if (!endBlock || startBlock.id === endBlock.id) {
+      if (startBlock.hasInlineTools) {
+        this.#deps.show()
+      } else {
+        this.#deps.hide()
+      }
+      return
+    }
+
+    // Cross-block native selection — only show if every spanned block has inline tools.
+    const startIdx = this.#deps.blocks.getBlockIndex(startBlock.id)
+    const endIdx = this.#deps.blocks.getBlockIndex(endBlock.id)
+    const from = Math.min(startIdx, endIdx)
+    const to = Math.max(startIdx, endIdx)
+
+    for (let i = from; i <= to; i++) {
+      const b = this.#deps.blocks.getBlockByIndex(i)
+      if (!b || !b.hasInlineTools) {
+        this.#deps.hide()
+        return
+      }
+    }
+
+    this.#deps.show()
+  }
+}

package/dist/core/inlinePluginInsert.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Insert an inline plugin widget at the current native caret position.
+ *
+ * Extracted from EditorFacade to keep DOM manipulation out of the facade.
+ *
+ * @param {import('./types.js').IInlinePluginRegistry} registry
+ * @param {import('./types.js').InlinePluginContext} ctx
+ * @param {string} type
+ * @param {Record<string, string>} [data]
+ * @param {HTMLElement} [rootEl]
+ * @returns {boolean} whether editor DOM was changed
+ */
+export function insertInlinePluginAtCaret(registry: import("./types.js").IInlinePluginRegistry, ctx: import("./types.js").InlinePluginContext, type: string, data?: Record<string, string>, rootEl?: HTMLElement): boolean;

package/dist/core/inlinePluginInsert.js

@@ -0,0 +1,56 @@
+/**
+ * Insert an inline plugin widget at the current native caret position.
+ *
+ * Extracted from EditorFacade to keep DOM manipulation out of the facade.
+ *
+ * @param {import('./types').IInlinePluginRegistry} registry
+ * @param {import('./types').InlinePluginContext} ctx
+ * @param {string} type
+ * @param {Record<string, string>} [data]
+ * @param {HTMLElement} [rootEl]
+ * @returns {boolean} whether editor DOM was changed
+ */
+export function insertInlinePluginAtCaret(registry, ctx, type, data = {}, rootEl) {
+  const plugin = registry.get(type)
+  if (!plugin) {
+    console.warn(`[insertInlinePlugin] Unknown inline plugin type: "${type}"`)
+    return false
+  }
+
+  const sel = window.getSelection()
+  if (!sel || !sel.rangeCount) return false
+  const range = sel.getRangeAt(0)
+  if (rootEl && !rootEl.contains(range.commonAncestorContainer)) return false
+
+  // Plugins can opt out of the default "create a committed widget at caret"
+  // flow by implementing `insertFresh` — e.g. the mention plugin uses this
+  // to insert just the `@` trigger character, letting its onEdit pipeline
+  // open the dropdown naturally (same UX as typing `@` manually).
+  if (typeof plugin.insertFresh === 'function') {
+    plugin.insertFresh(ctx)
+    return true
+  }
+
+  const widget = plugin.createWidget(data)
+  if (!(widget instanceof HTMLElement)) {
+    throw new TypeError(`Inline plugin "${type}" createWidget() must return an HTMLElement`)
+  }
+  plugin.hydrate(widget, ctx)
+  widget.dataset.hydrated = '1'
+
+  range.deleteContents()
+  range.insertNode(widget)
+
+  // Insert a space after widget so caret has somewhere to go
+  const space = document.createTextNode('\u00A0')
+  widget.after(space)
+
+  // Place caret after the space
+  const newRange = document.createRange()
+  newRange.setStartAfter(space)
+  newRange.collapse(true)
+  sel.removeAllRanges()
+  sel.addRange(newRange)
+
+  return true
+}

package/dist/core/locale/en.d.ts

@@ -0,0 +1,35 @@
+declare const _default: {
+    'toolbar.add': string;
+    'toolbar.drag': string;
+    'toolbar.tune': string;
+    'toolbox.search': string;
+    'inline.bold': string;
+    'inline.italic': string;
+    'inline.link': string;
+    'inline.code': string;
+    'inline.marker': string;
+    'inline.bgcolor': string;
+    'inline.strikethrough': string;
+    'inline.align.left': string;
+    'inline.align.center': string;
+    'inline.align.right': string;
+    'inline.align.justify': string;
+    'inline.superscript': string;
+    'inline.subscript': string;
+    'inline.script.none': string;
+    'inline.fontSize': string;
+    'inline.case': string;
+    'inline.clear': string;
+    'link.placeholder': string;
+    'link.apply': string;
+    'link.unlink': string;
+    'block.delete': string;
+    'block.moveUp': string;
+    'block.moveDown': string;
+    'block.duplicate': string;
+    'block.convertTo': string;
+    'block.back': string;
+    'block.unsupported': string;
+    'slash.noResults': string;
+};
+export default _default;

package/dist/core/locale/en.js

@@ -0,0 +1,37 @@
+export default {
+  'toolbar.add': 'Add block',
+  'toolbar.drag': 'Drag to reorder',
+  'toolbar.tune': 'Block settings',
+  'toolbox.search': 'Search...',
+
+  'inline.bold': 'Bold',
+  'inline.italic': 'Italic',
+  'inline.link': 'Link',
+  'inline.code': 'Inline Code',
+  'inline.marker': 'Highlight',
+  'inline.bgcolor': 'Background',
+  'inline.strikethrough': 'Strikethrough',
+  'inline.align.left': 'Align left',
+  'inline.align.center': 'Align center',
+  'inline.align.right': 'Align right',
+  'inline.align.justify': 'Justify',
+  'inline.superscript': 'Superscript',
+  'inline.subscript': 'Subscript',
+  'inline.script.none': 'Normal',
+  'inline.fontSize': 'Font size',
+  'inline.case': 'Toggle case',
+  'inline.clear': 'Clear formatting',
+  'link.placeholder': 'Paste a link...',
+  'link.apply': 'Apply',
+  'link.unlink': 'Unlink',
+
+  'block.delete': 'Delete',
+  'block.moveUp': 'Move up',
+  'block.moveDown': 'Move down',
+  'block.duplicate': 'Duplicate',
+  'block.convertTo': 'Convert to',
+  'block.back': 'Back',
+  'block.unsupported': 'Unsupported block type: {type}',
+
+  'slash.noResults': 'No results',
+}

package/dist/core/locale/ru.d.ts

@@ -0,0 +1,35 @@
+declare const _default: {
+    'toolbar.add': string;
+    'toolbar.drag': string;
+    'toolbar.tune': string;
+    'toolbox.search': string;
+    'inline.bold': string;
+    'inline.italic': string;
+    'inline.link': string;
+    'inline.code': string;
+    'inline.marker': string;
+    'inline.bgcolor': string;
+    'inline.strikethrough': string;
+    'inline.align.left': string;
+    'inline.align.center': string;
+    'inline.align.right': string;
+    'inline.align.justify': string;
+    'inline.superscript': string;
+    'inline.subscript': string;
+    'inline.script.none': string;
+    'inline.fontSize': string;
+    'inline.case': string;
+    'inline.clear': string;
+    'link.placeholder': string;
+    'link.apply': string;
+    'link.unlink': string;
+    'block.delete': string;
+    'block.moveUp': string;
+    'block.moveDown': string;
+    'block.duplicate': string;
+    'block.convertTo': string;
+    'block.back': string;
+    'block.unsupported': string;
+    'slash.noResults': string;
+};
+export default _default;

package/dist/core/locale/ru.js

@@ -0,0 +1,37 @@
+export default {
+  'toolbar.add': 'Добавить блок',
+  'toolbar.drag': 'Перетащить',
+  'toolbar.tune': 'Настройки блока',
+  'toolbox.search': 'Поиск...',
+
+  'inline.bold': 'Полужирный',
+  'inline.italic': 'Курсив',
+  'inline.link': 'Ссылка',
+  'inline.code': 'Внутристрочный код',
+  'inline.marker': 'Маркер',
+  'inline.bgcolor': 'Фон текста',
+  'inline.strikethrough': 'Зачёркнутый',
+  'inline.align.left': 'По левому краю',
+  'inline.align.center': 'По центру',
+  'inline.align.right': 'По правому краю',
+  'inline.align.justify': 'По ширине',
+  'inline.superscript': 'Надстрочный',
+  'inline.subscript': 'Подстрочный',
+  'inline.script.none': 'Обычный',
+  'inline.fontSize': 'Размер шрифта',
+  'inline.case': 'Сменить регистр',
+  'inline.clear': 'Очистить форматирование',
+  'link.placeholder': 'Вставьте ссылку...',
+  'link.apply': 'Применить',
+  'link.unlink': 'Удалить ссылку',
+
+  'block.delete': 'Удалить',
+  'block.moveUp': 'Переместить вверх',
+  'block.moveDown': 'Переместить вниз',
+  'block.duplicate': 'Дублировать',
+  'block.convertTo': 'Преобразовать в',
+  'block.back': 'Назад',
+  'block.unsupported': 'Неподдерживаемый тип блока: {type}',
+
+  'slash.noResults': 'Ничего не найдено',
+}

package/dist/core/menuKeyboardNav.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Reusable keyboard navigation handler for accessible menus.
+ *
+ * Handles ArrowDown, ArrowUp, Home, End (focus management with wraparound)
+ * and Escape (delegates to onEscape callback).
+ *
+ * @param {KeyboardEvent} e
+ * @param {HTMLElement} menuEl — container to query for menu items
+ * @param {{ onEscape: () => void, itemSelector?: string }} options
+ * @returns {boolean} true if the event was handled
+ */
+export function handleMenuKeydown(e: KeyboardEvent, menuEl: HTMLElement, { onEscape, itemSelector }: {
+    onEscape: () => void;
+    itemSelector?: string;
+}): boolean;

package/dist/core/menuKeyboardNav.js

@@ -0,0 +1,52 @@
+/**
+ * Reusable keyboard navigation handler for accessible menus.
+ *
+ * Handles ArrowDown, ArrowUp, Home, End (focus management with wraparound)
+ * and Escape (delegates to onEscape callback).
+ *
+ * @param {KeyboardEvent} e
+ * @param {HTMLElement} menuEl — container to query for menu items
+ * @param {{ onEscape: () => void, itemSelector?: string }} options
+ * @returns {boolean} true if the event was handled
+ */
+export function handleMenuKeydown(e, menuEl, { onEscape, itemSelector = '[role="menuitem"]:not([aria-disabled="true"])' }) {
+  const items = /** @type {HTMLElement[]} */ (
+    [...menuEl.querySelectorAll(itemSelector)]
+  )
+  if (!items.length && e.key !== 'Escape') return false
+
+  const current = /** @type {HTMLElement} */ (document.activeElement)
+  const idx = items.indexOf(current)
+
+  switch (e.key) {
+    case 'ArrowDown': {
+      e.preventDefault()
+      e.stopPropagation()
+      const next = idx < items.length - 1 ? idx + 1 : 0
+      items[next]?.focus()
+      return true
+    }
+    case 'ArrowUp': {
+      e.preventDefault()
+      e.stopPropagation()
+      const prev = idx > 0 ? idx - 1 : items.length - 1
+      items[prev]?.focus()
+      return true
+    }
+    case 'Escape':
+      e.preventDefault()
+      e.stopPropagation()
+      onEscape()
+      return true
+    case 'Home':
+      e.preventDefault()
+      items[0]?.focus()
+      return true
+    case 'End':
+      e.preventDefault()
+      items[items.length - 1]?.focus()
+      return true
+    default:
+      return false
+  }
+}

package/dist/core/sanitize.d.ts

@@ -0,0 +1,2 @@
+export { sanitizeHtml } from "../shared/sanitize/sanitizeHtml.js";
+export { escapeHtml } from "../shared/sanitize/escapeHtml.js";

package/dist/core/sanitize.js

@@ -0,0 +1,6 @@
+/**
+ * Backward-compat facade. Real implementation lives in `../shared/sanitize`,
+ * shared between core (plugin render / paste) and renderer (read-only output).
+ */
+export { sanitizeHtml } from '../shared/sanitize/sanitizeHtml.js'
+export { escapeHtml } from '../shared/sanitize/escapeHtml.js'

package/dist/core/splitConvert.d.ts

@@ -0,0 +1,46 @@
+/**
+ * Shared utility for splitting a block at a selection range and converting
+ * the selected portion to a different block type.
+ *
+ * Used by both TypeSelector (inline toolbar) and BlockSettingsMenu (tune menu).
+ *
+ * @param {import('./types.js').IBlockManager} blocks
+ * @param {import('./types.js').ISelectionManager} selection
+ * @param {number} currentIndex
+ * @param {string} currentType
+ * @param {HTMLElement} contentEl
+ * @param {Range} range
+ * @param {string} targetType
+ * @param {Record<string, unknown>} [targetData]
+ * @param {boolean} [targetIsText]
+ * @returns {boolean} whether conversion actually happened
+ */
+export function splitAndConvert(blocks: import("./types.js").IBlockManager, selection: import("./types.js").ISelectionManager, currentIndex: number, currentType: string, contentEl: HTMLElement, range: Range, targetType: string, targetData?: Record<string, unknown>, targetIsText?: boolean): boolean;
+/**
+ * Check if range starts at the beginning of contentEl.
+ * @param {HTMLElement} contentEl
+ * @param {Range} range
+ * @returns {boolean}
+ */
+export function rangeStartsAtBeginning(contentEl: HTMLElement, range: Range): boolean;
+/**
+ * Check if range ends at the end of contentEl.
+ * @param {HTMLElement} contentEl
+ * @param {Range} range
+ * @returns {boolean}
+ */
+export function rangeEndsAtEnd(contentEl: HTMLElement, range: Range): boolean;
+/**
+ * Check if entire block content is selected.
+ * Returns false on error (conservative — assume nothing is selected).
+ * @param {HTMLElement} contentEl
+ * @param {Range} range
+ * @returns {boolean}
+ */
+export function isFullBlockSelected(contentEl: HTMLElement, range: Range): boolean;
+/**
+ * Restore a saved selection range, including cross-block range and CSS Highlight.
+ * @param {Range | null} savedRange
+ * @param {import('./types.js').ICrossBlockSelection} [crossBlockSelection]
+ */
+export function restoreSelection(savedRange: Range | null, crossBlockSelection?: import("./types.js").ICrossBlockSelection): void;