@editora/core 1.0.0 → 1.0.2

package/dist/editorContainerHelpers-C7kdWnS0.mjs

@@ -0,0 +1,27 @@
+function i() {
+  const t = window.getSelection();
+  if (!t || !t.rangeCount)
+    return null;
+  const e = t.getRangeAt(0).startContainer, r = e.nodeType === Node.TEXT_NODE ? e.parentElement : e;
+  return o(r);
+}
+function o(t) {
+  if (!t) return null;
+  if (t.hasAttribute("data-editora-editor"))
+    return t;
+  let n = t.parentElement;
+  for (; n; ) {
+    if (n.hasAttribute("data-editora-editor"))
+      return n;
+    n = n.parentElement;
+  }
+  return null;
+}
+function a(t) {
+  return t ? t.querySelector(".rte-content") : (console.warn("[Editora] Editor container not found"), null);
+}
+export {
+  i as f,
+  a as g
+};
+//# sourceMappingURL=editorContainerHelpers-C7kdWnS0.mjs.map

package/dist/editorContainerHelpers-C7kdWnS0.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"editorContainerHelpers-C7kdWnS0.mjs","sources":["../../plugins/shared/editorContainerHelpers.ts"],"sourcesContent":["/**\n * Utility functions for plugins to access the editor container in a multi-instance safe way\n * \n * These functions help plugins find their parent editor container and perform scoped DOM queries\n * instead of using global selectors that only work with the first editor instance on a page.\n */\n\n/**\n * Find the editor container from the current selection\n * This is the most reliable way to find the active editor when executing commands\n * \n * @returns The editor container div or null if no selection or editor not found\n */\nexport function findEditorContainerFromSelection(): HTMLDivElement | null {\n  const selection = window.getSelection();\n  if (!selection || !selection.rangeCount) {\n    return null;\n  }\n  \n  const range = selection.getRangeAt(0);\n  const node = range.startContainer;\n  \n  // Get the element (text nodes need their parent)\n  const element = node.nodeType === Node.TEXT_NODE \n    ? node.parentElement \n    : node as HTMLElement;\n    \n  return findEditorContainer(element);\n}\n\n/**\n * Find the parent editor container for a given element\n * Walks up the DOM tree looking for [data-editora-editor] attribute\n * \n * @param element - Starting element to search from (usually a toolbar, plugin element, etc)\n * @returns The editor container div or null if not found\n */\nexport function findEditorContainer(element: HTMLElement | null): HTMLDivElement | null {\n  if (!element) return null;\n  \n  // If element itself is the editor container, return it\n  if (element.hasAttribute('data-editora-editor')) {\n    return element as HTMLDivElement;\n  }\n  \n  // Walk up the DOM tree looking for editor container\n  let current = element.parentElement;\n  while (current) {\n    if (current.hasAttribute('data-editora-editor')) {\n      return current as HTMLDivElement;\n    }\n    current = current.parentElement;\n  }\n  \n  return null;\n}\n\n/**\n * Get the content element (.rte-content) for a given editor container\n * Uses scoped selector instead of global document.querySelector\n * \n * @param editorContainer - The editor container element\n * @returns The content element or null if not found\n */\nexport function getContentElement(editorContainer: HTMLDivElement | null): HTMLElement | null {\n  if (!editorContainer) {\n    console.warn('[Editora] Editor container not found');\n    return null;\n  }\n  return editorContainer.querySelector('.rte-content') as HTMLElement | null;\n}\n\n/**\n * Get the content element by first finding the parent editor container from a given element\n * This is the most common usage pattern in plugins\n * \n * @param fromElement - Element to start searching from (e.g., this in event handler)\n * @returns The content element or null if not found\n */\nexport function findContentElement(fromElement: HTMLElement | null): HTMLElement | null {\n  const container = findEditorContainer(fromElement);\n  return getContentElement(container);\n}\n\n/**\n * Query elements within the editor container scope\n * Useful for finding specific elements like footnotes, merge tags, anchors, etc.\n * \n * @param editorContainer - The editor container element\n * @param selector - CSS selector to find within the container\n * @returns NodeList of matching elements\n */\nexport function queryScopedElements(\n  editorContainer: HTMLDivElement | null,\n  selector: string\n): NodeListOf<Element> {\n  if (!editorContainer) {\n    // Fallback to global selector for backward compatibility, but warn\n    console.warn(`[Editora] Editor container not found, using global selector fallback for \"${selector}\"`);\n    return document.querySelectorAll(selector);\n  }\n  return editorContainer.querySelectorAll(selector);\n}\n\n/**\n * Get a single scoped element\n * \n * @param editorContainer - The editor container element\n * @param selector - CSS selector to find within the container\n * @returns First matching element or null\n */\nexport function queryScopedElement(\n  editorContainer: HTMLDivElement | null,\n  selector: string\n): Element | null {\n  if (!editorContainer) {\n    // Fallback to global selector for backward compatibility, but warn\n    console.warn(`[Editora] Editor container not found, using global selector fallback for \"${selector}\"`);\n    return document.querySelector(selector);\n  }\n  return editorContainer.querySelector(selector);\n}\n\n/**\n * Get an element by ID within editor container scope\n * IDs like footnote IDs, anchor IDs, merge tag IDs should be scoped to the editor\n * \n * @param editorContainer - The editor container element\n * @param id - Element ID to find\n * @returns Element with that ID or null\n */\nexport function getScopedElementById(\n  editorContainer: HTMLDivElement | null,\n  id: string\n): HTMLElement | null {\n  if (!editorContainer) {\n    // Fallback for backward compatibility\n    return document.getElementById(id);\n  }\n  \n  // Use querySelector with ID selector within container scope\n  return editorContainer.querySelector(`#${id}`) as HTMLElement | null;\n}\n\n/**\n * Event handler helper - Extract editor container from event and get content element\n * Common pattern: In event handlers, get the target element and find the editor container\n * \n * @param event - DOM event\n * @returns Object with editorContainer and contentElement\n */\nexport function getEditorElementsFromEvent(event: Event): {\n  editorContainer: HTMLDivElement | null;\n  contentElement: HTMLElement | null;\n} {\n  const target = event.target as HTMLElement;\n  const editorContainer = findEditorContainer(target);\n  const contentElement = getContentElement(editorContainer);\n  return { editorContainer, contentElement };\n}\n\n/**\n * Check if an element is within an editor instance\n * \n * @param element - Element to check\n * @returns True if element is inside an editor container\n */\nexport function isInEditor(element: HTMLElement | null): boolean {\n  return findEditorContainer(element) !== null;\n}\n\n/**\n * Helper for getting selection from a specific editor\n * Ensures selection is within the correct editor instance\n * \n * @param editorContainer - The editor container element\n * @returns Selection if it's within this editor, or null otherwise\n */\nexport function getEditorSelection(editorContainer: HTMLDivElement | null): Selection | null {\n  const selection = window.getSelection();\n  if (!selection || !editorContainer) return null;\n  \n  const contentElement = getContentElement(editorContainer);\n  if (!contentElement) return null;\n  \n  // Check if selection is within this editor's content\n  if (selection.rangeCount > 0) {\n    const range = selection.getRangeAt(0);\n    if (contentElement.contains(range.startContainer) && contentElement.contains(range.endContainer)) {\n      return selection;\n    }\n  }\n  \n  return null;\n}\n\n/**\n * Helper for commands that need to know which editor they're being executed on\n * Extract editor context from toolbar button or command origin\n * \n * @param element - Button or element that triggered the command\n * @returns Editor container or null\n */\nexport function getEditorContextFromCommand(element: HTMLElement | null): HTMLDivElement | null {\n  // First, try to find the editor container directly\n  const fromElement = findEditorContainer(element);\n  if (fromElement) return fromElement;\n  \n  // If element is a toolbar button, it might be outside editor container\n  // Try to find it through document.activeElement (the focused editor)\n  const activeElement = document.activeElement as HTMLElement;\n  if (activeElement && activeElement.classList?.contains('rte-content')) {\n    return findEditorContainer(activeElement);\n  }\n  \n  return null;\n}\n"],"names":["findEditorContainerFromSelection","selection","node","element","findEditorContainer","current","getContentElement","editorContainer"],"mappings":"AAaO,SAASA,IAA0D;AACxE,QAAMC,IAAY,OAAO,aAAA;AACzB,MAAI,CAACA,KAAa,CAACA,EAAU;AAC3B,WAAO;AAIT,QAAMC,IADQD,EAAU,WAAW,CAAC,EACjB,gBAGbE,IAAUD,EAAK,aAAa,KAAK,YACnCA,EAAK,gBACLA;AAEJ,SAAOE,EAAoBD,CAAO;AACpC;AASO,SAASC,EAAoBD,GAAoD;AACtF,MAAI,CAACA,EAAS,QAAO;AAGrB,MAAIA,EAAQ,aAAa,qBAAqB;AAC5C,WAAOA;AAIT,MAAIE,IAAUF,EAAQ;AACtB,SAAOE,KAAS;AACd,QAAIA,EAAQ,aAAa,qBAAqB;AAC5C,aAAOA;AAET,IAAAA,IAAUA,EAAQ;AAAA,EACpB;AAEA,SAAO;AACT;AASO,SAASC,EAAkBC,GAA4D;AAC5F,SAAKA,IAIEA,EAAgB,cAAc,cAAc,KAHjD,QAAQ,KAAK,sCAAsC,GAC5C;AAGX;"}