@oix1987/yjd 1.0.0 → 1.0.2

package/lib/formats/superscript.js

@@ -1,35 +0,0 @@
-import { InlineFormat } from '../core/format.js';
-import { saveBeforeFormat } from '../utils/history-helper.js';
-import Subscript from './subscript.js';
-/**
- * Superscript Format - Handles superscript text formatting
- * Creates <sup> elements for superscript text
- */
-class Superscript extends InlineFormat {
-  static formatName = 'superscript';
-  static tagName = 'SUP';
-
-  /**
-   * Toggle superscript formatting
-   */
-  removeSubscriptBeforeApply() {
-    const subscript = new Subscript();
-    if (subscript.isActive()) {
-      subscript.remove();
-    }
-  }
-  toggle() {
-    // Save state before applying format
-    saveBeforeFormat();
-
-    if (this.isActive()) {
-      this.remove();
-    } else {
-      // Ensure mutual exclusivity: remove subscript before applying superscript
-      this.removeSubscriptBeforeApply();
-      this.apply();
-    }
-  }
-}
-
-export default Superscript; 

package/lib/formats/table.js

@@ -1,288 +0,0 @@
-import { BlockFormat } from '../core/format.js';
-import TablePopup from '../ui/table-popup.js';
-import Editor from '../core/editor.js';
-
-/**
- * Table Format - HTML table insertion
- * Now supports multiple editor instances with separate popup instances
- */
-class Table extends BlockFormat {
-  static formatName = 'table';
-  static tagName = 'TABLE';
-  static savedRanges = new Map(); // Map to store saved ranges for each editor
-
-  constructor() {
-    super();
-    
-    // Get current editor instance
-    const currentEditor = Editor.getCurrentInstance();
-    if (!currentEditor) {
-      console.warn('No editor instance found for Table format');
-      return;
-    }
-    
-    this.editorId = currentEditor.instanceId;
-    
-    // Check if this editor already has a table popup instance
-    let tablePopup = currentEditor.getPopupInstance('table');
-    
-    if (!tablePopup) {
-      // Create new table popup instance for this editor
-      tablePopup = new TablePopup({
-        onTableSelect: (tableData) => {
-          Table.insertTable(tableData, this.editorId);
-        },
-        editor: currentEditor,
-        editorId: this.editorId
-      });
-      
-      // Store popup instance in editor
-      currentEditor.setPopupInstance('table', tablePopup);
-    }
-    
-    this.tablePopup = tablePopup;
-  }
-
-  /**
-   * Create a new Table format instance for a specific editor
-   * @param {string} editorId - Editor instance ID
-   * @returns {Table} Table format instance
-   */
-  static createForEditor(editorId) {
-    const editor = Editor.getInstanceById(editorId);
-    if (!editor) {
-      console.warn('No editor instance found for ID:', editorId);
-      return null;
-    }
-    
-    // Temporarily set as current instance
-    const originalCurrent = Editor.currentInstance;
-    Editor.currentInstance = editor;
-    
-    // Create format instance
-    const format = new Table();
-    
-    // Restore original current instance
-    Editor.currentInstance = originalCurrent;
-    
-    return format;
-  }
-
-  /**
-   * Insert table at saved cursor position
-   * @param {Object} tableData - Table data with rows and cols
-   * @param {string} editorId - Editor instance ID
-   */
-  static insertTable(tableData, editorId = null) {
-    // Get the correct editor instance
-    let editor = null;
-    if (editorId) {
-      editor = Editor.getInstanceById(editorId);
-    } else {
-      editor = Editor.getCurrentInstance();
-    }
-    
-    if (!editor) {
-      console.warn('No editor instance found for table insertion');
-      return;
-    }
-    
-    // Get saved range for this editor
-    const savedRange = Table.savedRanges.get(editorId);
-    if (!savedRange) return;
-    
-    const selection = window.getSelection();
-    selection.removeAllRanges();
-    selection.addRange(savedRange);
-    
-    const range = selection.getRangeAt(0);
-    
-    // Create table HTML
-    const tableElement = Table.createTableElement(tableData.rows, tableData.cols);
-    
-    // Clear any selected content
-    if (!range.collapsed) {
-      range.deleteContents();
-    }
-    
-    // Insert table
-    range.insertNode(tableElement);
-    
-    // Position cursor in first cell
-    const firstCell = tableElement.querySelector('td');
-    if (firstCell) {
-      const newRange = document.createRange();
-      newRange.setStart(firstCell, 0);
-      newRange.collapse(true);
-      selection.removeAllRanges();
-      selection.addRange(newRange);
-    }
-    
-    // Clear saved range for this editor
-    Table.savedRanges.delete(editorId);
-    
-    // Trigger content change event
-    if (editor && typeof editor.onContentChange === 'function') {
-      editor.onContentChange();
-    }
-  }
-
-  /**
-   * Create table element
-   */
-  static createTableElement(rows, cols) {
-    const table = document.createElement('table');
-    table.className = 'rich-editor-table';
-    table.cellSpacing = '0';
-    table.cellPadding = '0';
-    table.border = '1';
-    
-    const tbody = document.createElement('tbody');
-    
-    for (let r = 0; r < rows; r++) {
-      const row = document.createElement('tr');
-      
-      for (let c = 0; c < cols; c++) {
-        const cell = document.createElement('td');
-        cell.innerHTML = '&nbsp;'; // Non-breaking space for empty cells
-        cell.style.minWidth = '50px';
-        cell.style.minHeight = '24px';
-        cell.style.padding = '4px 8px';
-        cell.style.border = '1px solid #ddd';
-        cell.style.verticalAlign = 'top';
-        
-        // Make cells editable
-        cell.contentEditable = 'true';
-        
-        row.appendChild(cell);
-      }
-      
-      tbody.appendChild(row);
-    }
-    
-    table.appendChild(tbody);
-    
-    // Add table styles
-    table.style.borderCollapse = 'collapse';
-    table.style.width = '100%';
-    table.style.margin = '10px 0';
-    
-    return table;
-  }
-
-  /**
-   * Toggle table popup
-   */
-  toggle() {
-    if (this.tablePopup.isVisible) {
-      this.tablePopup.hide();
-    } else {
-      this.showPopup();
-    }
-  }
-
-  /**
-   * Show table popup
-   */
-  showPopup() {
-    // Lưu vị trí con trỏ hiện tại cho editor này
-    const selection = window.getSelection();
-    if (selection && selection.rangeCount > 0) {
-      Table.savedRanges.set(this.editorId, selection.getRangeAt(0).cloneRange());
-    }
-    
-    // Find table button in the current editor's toolbar
-    const editor = Editor.getInstanceById(this.editorId);
-    if (!editor) return;
-    
-    const toolbar = editor.getModule('toolbar');
-    let tableButton = null;
-    
-    if (toolbar) {
-      tableButton = toolbar.getButton('table');
-    }
-    
-    // Fallback: find button by class in the current editor's toolbar
-    if (!tableButton) {
-      const toolbarContainer = toolbar?.getContainer();
-      if (toolbarContainer) {
-        tableButton = toolbarContainer.querySelector('.rich-editor-toolbar-btn.table-btn');
-      }
-    }
-    
-    // Final fallback: find any table button in the current editor's wrapper
-    if (!tableButton) {
-      tableButton = editor.wrapper.querySelector('.rich-editor-toolbar-btn.table-btn');
-    }
-    
-    if (!tableButton) {
-      console.warn('Table button not found for editor:', this.editorId);
-      return;
-    }
-    
-    this.tablePopup.show(tableButton);
-  }
-
-  /**
-   * Check if cursor is in a table
-   */
-  isActive() {
-    const selection = window.getSelection();
-    if (!selection || !selection.rangeCount) return false;
-    
-    let node = selection.getRangeAt(0).startContainer;
-    
-    // Find parent table element
-    while (node && node !== document.body) {
-      if (node.nodeType === Node.ELEMENT_NODE && node.tagName === 'TABLE') {
-        return true;
-      }
-      node = node.parentNode;
-    }
-    
-    return false;
-  }
-
-  /**
-   * Get current table if cursor is in one
-   */
-  getCurrentTable() {
-    const selection = window.getSelection();
-    if (!selection || !selection.rangeCount) return null;
-    
-    let node = selection.getRangeAt(0).startContainer;
-    
-    // Find parent table element
-    while (node && node !== document.body) {
-      if (node.nodeType === Node.ELEMENT_NODE && node.tagName === 'TABLE') {
-        return node;
-      }
-      node = node.parentNode;
-    }
-    
-    return null;
-  }
-
-  /**
-   * Apply table formatting (not applicable for this format)
-   */
-  apply() {
-    this.showPopup();
-  }
-
-  /**
-   * Remove table formatting
-   */
-  remove() {
-    const table = this.getCurrentTable();
-    if (table) {
-      // Hide resize handles before removing table
-      if (window.richEditor && window.richEditor.resizeHandles) {
-        window.richEditor.resizeHandles.hideHandles();
-      }
-      table.parentNode.removeChild(table);
-    }
-  }
-}
-
-export default Table; 

package/lib/formats/tag.js

@@ -1,304 +0,0 @@
-import { InlineFormat } from '../core/format.js';
-import TagPopup from '../ui/tag-popup.js';
-import Editor from '../core/editor.js';
-
-/**
- * Tag Format - Handles custom tag insertion
- * Now supports multiple editor instances with separate popup instances
- */
-class Tag extends InlineFormat {
-  static formatName = 'tag';
-  static tagName = 'SPAN';
-  static className = 'custom-tag';
-  static savedRanges = new Map(); // Map to store saved ranges for each editor
-
-  constructor() {
-    super();
-    
-    // Get current editor instance
-    const currentEditor = Editor.getCurrentInstance();
-    if (!currentEditor) {
-      console.warn('No editor instance found for Tag format');
-      return;
-    }
-    
-    this.editorId = currentEditor.instanceId;
-    
-    // Check if this editor already has a tag popup instance
-    let tagPopup = currentEditor.getPopupInstance('tag');
-    
-    if (!tagPopup) {
-      // Create new tag popup instance for this editor
-      tagPopup = new TagPopup({
-        onTagInsert: (tagType, tagContent) => {
-          Tag.insertTagAtCurrentPosition(tagType, tagContent, this.editorId);
-        },
-        editor: currentEditor,
-        editorId: this.editorId
-      });
-      
-      // Store popup instance in editor
-      currentEditor.setPopupInstance('tag', tagPopup);
-    }
-    
-    this.tagPopup = tagPopup;
-  }
-
-  /**
-   * Create a new Tag format instance for a specific editor
-   * @param {string} editorId - Editor instance ID
-   * @returns {Tag} Tag format instance
-   */
-  static createForEditor(editorId) {
-    const editor = Editor.getInstanceById(editorId);
-    if (!editor) {
-      console.warn('No editor instance found for ID:', editorId);
-      return null;
-    }
-    
-    // Temporarily set as current instance
-    const originalCurrent = Editor.currentInstance;
-    Editor.currentInstance = editor;
-    
-    // Create format instance
-    const format = new Tag();
-    
-    // Restore original current instance
-    Editor.currentInstance = originalCurrent;
-    
-    return format;
-  }
-
-  /**
-   * Create tag element
-   * @param {string} tagType - Type of tag (@, #, custom)
-   * @param {string} content - Tag content
-   * @returns {HTMLElement}
-   */
-  static create(tagType, content) {
-    const span = document.createElement('SPAN');
-    span.className = `custom-tag tag-${tagType}`;
-    
-    let displayText = content;
-    if (tagType === 'mention') {
-      displayText = `@${content}`;
-    } else if (tagType === 'hashtag') {
-      displayText = `#${content}`;
-    } else if (tagType === 'custom') {
-      displayText = `<${content}>`;
-    }
-    
-    span.textContent = displayText;
-    span.setAttribute('data-tag-type', tagType);
-    span.setAttribute('data-tag-content', content);
-    span.setAttribute('contenteditable', 'false');
-    
-    return span;
-  }
-
-  /**
-   * Insert tag at current cursor position
-   * @param {string} tagType - Type of tag
-   * @param {string} content - Tag content
-   * @param {string} editorId - Editor instance ID
-   */
-  static insertTagAtCurrentPosition(tagType, content, editorId = null) {
-    // Get the correct editor instance
-    let editor = null;
-    if (editorId) {
-      editor = Editor.getInstanceById(editorId);
-    } else {
-      editor = Editor.getCurrentInstance();
-    }
-    
-    if (!editor) {
-      console.warn('No editor instance found for tag insertion');
-      return;
-    }
-    
-    // Use saved range if available, otherwise get current selection
-    const selection = window.getSelection();
-    if (!selection) return;
-
-    try {
-      // Restore saved range if exists for this editor
-      const savedRange = Tag.savedRanges.get(editorId);
-      if (savedRange) {
-        selection.removeAllRanges();
-        selection.addRange(savedRange);
-        Tag.savedRanges.delete(editorId);
-      } else if (!selection.rangeCount) {
-        return;
-      }
-
-      const range = selection.getRangeAt(0);
-      
-      // Create tag element
-      const tagElement = Tag.create(tagType, content);
-      
-      // Insert tag at cursor position
-      range.deleteContents();
-      range.insertNode(tagElement);
-      
-      // Add a space after the tag for easier editing
-      const spaceNode = document.createTextNode(' ');
-      range.setStartAfter(tagElement);
-      range.insertNode(spaceNode);
-      
-      // Position cursor after the space
-      range.setStartAfter(spaceNode);
-      range.collapse(true);
-      selection.removeAllRanges();
-      selection.addRange(range);
-      
-      // Focus back on editor
-      if (editor && editor.element) {
-        editor.element.focus();
-      }
-      
-      // Trigger content change event
-      if (editor && typeof editor.onContentChange === 'function') {
-        editor.onContentChange();
-      }
-      
-    } catch (error) {
-      console.error('Error inserting tag:', error);
-    }
-  }
-
-  /**
-   * Apply tag formatting - shows tag popup
-   */
-  apply(tagType, content) {
-    if (tagType && content) {
-      Tag.insertTagAtCurrentPosition(tagType, content, this.editorId);
-    } else {
-      // Save current selection before showing popup
-      const selection = window.getSelection();
-      if (selection && selection.rangeCount > 0) {
-        Tag.savedRanges.set(this.editorId, selection.getRangeAt(0).cloneRange());
-      }
-      this.showTagPopup();
-    }
-  }
-
-  /**
-   * Remove tag formatting
-   */
-  remove() {
-    const selection = window.getSelection();
-    if (!selection || !selection.rangeCount) return;
-
-    const range = selection.getRangeAt(0);
-    const tagElement = this.getTagElement(range);
-    
-    if (tagElement) {
-      // Replace tag element with its text content
-      const textNode = document.createTextNode(tagElement.textContent);
-      tagElement.parentNode.replaceChild(textNode, tagElement);
-    }
-  }
-
-  /**
-   * Toggle tag formatting - shows tag popup
-   */
-  toggle() {
-    if (this.tagPopup.isVisible) {
-      this.tagPopup.hide();
-    } else {
-      // Save current selection before showing popup
-      const selection = window.getSelection();
-      if (selection && selection.rangeCount > 0) {
-        Tag.savedRanges.set(this.editorId, selection.getRangeAt(0).cloneRange());
-      }
-      this.showTagPopup();
-    }
-  }
-
-  /**
-   * Show tag popup
-   */
-  showTagPopup() {
-    // Find tag button in the current editor's toolbar
-    const editor = Editor.getInstanceById(this.editorId);
-    if (!editor) return;
-    
-    const toolbar = editor.getModule('toolbar');
-    let tagButton = null;
-    
-    if (toolbar) {
-      tagButton = toolbar.getButton('tag');
-    }
-    
-    // Fallback: find button by class in the current editor's toolbar
-    if (!tagButton) {
-      const toolbarContainer = toolbar?.getContainer();
-      if (toolbarContainer) {
-        tagButton = toolbarContainer.querySelector('.rich-editor-toolbar-btn.tag-btn');
-      }
-    }
-    
-    // Final fallback: find any tag button in the current editor's wrapper
-    if (!tagButton) {
-      tagButton = editor.wrapper.querySelector('.rich-editor-toolbar-btn.tag-btn');
-    }
-    
-    if (!tagButton) {
-      console.warn('Tag button not found for editor:', this.editorId);
-      return;
-    }
-    
-    this.tagPopup.show(tagButton);
-  }
-
-  /**
-   * Check if tag formatting is active
-   */
-  isActive() {
-    const selection = window.getSelection();
-    if (!selection || !selection.rangeCount) return false;
-
-    const range = selection.getRangeAt(0);
-    return this.getTagElement(range) !== null;
-  }
-
-  /**
-   * Get tag element from selection
-   * @param {Range} range - Selection range
-   * @returns {HTMLElement|null}
-   */
-  getTagElement(range) {
-    let node = range.commonAncestorContainer;
-    
-    // If it's a text node, get its parent
-    if (node.nodeType === Node.TEXT_NODE) {
-      node = node.parentNode;
-    }
-    
-    // Check if current node is a tag
-    if (node.classList && node.classList.contains('custom-tag')) {
-      return node;
-    }
-    
-    // Check if selection contains a tag
-    const tagInSelection = range.cloneContents().querySelector('.custom-tag');
-    return tagInSelection || null;
-  }
-
-  /**
-   * Get predefined tag suggestions
-   * @param {string} tagType - Type of tag
-   * @returns {Array} - Array of suggestions
-   */
-  static getSuggestions(tagType) {
-    const suggestions = {
-      mention: ['john', 'sarah', 'admin', 'team', 'support'],
-      hashtag: ['urgent', 'todo', 'done', 'review', 'important'],
-      custom: ['note', 'warning', 'tip', 'info', 'success']
-    };
-    
-    return suggestions[tagType] || [];
-  }
-}
-
-export default Tag;