autumnnote 1.6.6 → 1.7.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "autumnnote",
-  "version": "1.6.6",
+  "version": "1.7.0",
   "description": "WYSIWYG rich-text editor built with vanilla JavaScript — zero dependencies, no jQuery. Dark mode, @mention, markdown shortcuts, bubble toolbar. React and Vue 3 wrappers included.",
   "main": "dist/autumnnote.umd.js",
   "module": "dist/autumnnote.es.js",

package/src/js/Context.js

@@ -385,6 +385,22 @@ export class Context {
     this.invoke('editor.clearHistory');
   }
 
+  /**
+   * Returns the number of available undo steps.
+   * @returns {number}
+   */
+  getUndoCount() {
+    return this.invoke('editor.getUndoCount') ?? 0;
+  }
+
+  /**
+   * Returns the number of available redo steps.
+   * @returns {number}
+   */
+  getRedoCount() {
+    return this.invoke('editor.getRedoCount') ?? 0;
+  }
+
   /**
    * Returns true when the editor has no meaningful content.
    * @returns {boolean}
@@ -513,6 +529,22 @@ export class Context {
     });
   }
 
+  /**
+   * Returns an array of heading objects representing the table of contents.
+   * Each entry has: level (1-6), text (heading text), element (DOM element).
+   * @returns {{ level: number, text: string, element: HTMLElement }[]}
+   */
+  getTableOfContents() {
+    const headings = Array.from(
+      this.layoutInfo.editable.querySelectorAll('h1,h2,h3,h4,h5,h6')
+    );
+    return headings.map((el) => ({
+      level: parseInt(el.tagName[1], 10),
+      text: el.textContent?.trim() ?? '',
+      element: /** @type {HTMLElement} */ (el),
+    }));
+  }
+
   /**
    * Sets whether the editor is disabled (readonly).
    * @param {boolean} disabled
@@ -561,15 +593,19 @@ export class Context {
 
     const container = this.layoutInfo.container;
     const wasDark = container?.classList.contains('an-theme-dark');
+    const wasAuto = container?.classList.contains('an-theme-auto');
     if (container?.parentNode) {
       // Restore original element
       this.targetEl.style.display = '';
       container.remove();
     }
-    // If this was a dark editor and no other dark containers remain, clean up body
+    // Clean up body theme classes if no other editors of that type remain
     if (wasDark && !document.querySelector('.an-container.an-theme-dark')) {
       document.body.classList.remove('an-theme-dark');
     }
+    if (wasAuto && !document.querySelector('.an-container.an-theme-auto')) {
+      document.body.classList.remove('an-theme-auto');
+    }
 
     if (typeof this.options.onDestroy === 'function') {
       this.options.onDestroy(this);

package/src/js/editing/History.js

@@ -221,4 +221,14 @@ export class History {
   canRedo() {
     return this.stackOffset < this.stack.length - 1;
   }
+
+  /** @returns {number} */
+  getUndoCount() {
+    return Math.max(0, this.stackOffset);
+  }
+
+  /** @returns {number} */
+  getRedoCount() {
+    return Math.max(0, this.stack.length - 1 - this.stackOffset);
+  }
 }

package/src/js/i18n/de.js

@@ -157,6 +157,7 @@ export const de = {
     replaceAriaLabel:   'Ersetzen durch',
     replaceBtn:         'Ersetzen',
     noResults:          'Keine Ergebnisse',
+    useRegex:           'Regulären Ausdruck verwenden',
     replaceAllBtn:      'Alle ersetzen',
     close:              '×',
   },
@@ -275,6 +276,7 @@ export const de = {
       disableWordWrap:    'Zeilenumbruch deaktivieren',
       convertToParagraph: 'In Absatz umwandeln',
       deleteCodeBlock:    'Codeblock löschen',
+      lineNumbers:        'Zeilennummern umschalten',
     },
     table: {
       ariaLabel:          'Tabellen-Aktionen',
@@ -297,6 +299,11 @@ export const de = {
       tableBorderWidthPx: 'Tabellenrahmenbreite (px)',
       cancelBtn:          'Abbrechen',
       applyBtn:           'Anwenden',
+      sortAsc:            'Aufsteigend sortieren',
+      sortDesc:           'Absteigend sortieren',
+      exportCSV:          'Als CSV exportieren',
+      cellPadding:        'Zellauffüllung',
+      cellPaddingPx:      'Zellauffüllung (px)',
     },
     video: {
       ariaLabel:    'Video-Aktionen',

package/src/js/i18n/en.js

@@ -160,6 +160,7 @@ export const en = {
     replaceBtn:         'Replace',
     replaceAllBtn:      'Replace All',
     noResults:          'No results',
+    useRegex:           'Use Regular Expression',
     close:              '\u00d7',
   },
 
@@ -281,6 +282,7 @@ export const en = {
       disableWordWrap:    'Disable Word Wrap',
       convertToParagraph: 'Convert to Paragraph',
       deleteCodeBlock:    'Delete Code Block',
+      lineNumbers:        'Toggle Line Numbers',
     },
     table: {
       ariaLabel:          'Table actions',
@@ -297,14 +299,26 @@ export const en = {
       columnWidth:        'Column Width',
       rowHeight:          'Row Height',
       tableBorderWidth:   'Table Border Width',
+      tableBorderColor:   'Table Border Color',
       deleteTable:        'Delete Table',
+      cellAlignLeft:      'Align Left',
+      cellAlignCenter:    'Align Center',
+      cellAlignRight:     'Align Right',
+      cellAlignJustify:   'Align Justify',
+      toggleHeaderRow:    'Toggle Header Row',
       cellBackground:     'Cell Background',
       noShading:          'No Shading',
+      noBorderColor:      'No Border Color',
       columnWidthPx:      'Column Width (px)',
       rowHeightPx:        'Row Height (px)',
       tableBorderWidthPx: 'Table Border Width (px)',
       cancelBtn:          'Cancel',
       applyBtn:           'Apply',
+      sortAsc:            'Sort Ascending',
+      sortDesc:           'Sort Descending',
+      exportCSV:          'Export as CSV',
+      cellPadding:        'Cell Padding',
+      cellPaddingPx:      'Cell Padding (px)',
     },
     video: {
       ariaLabel:    'Video actions',

package/src/js/i18n/es.js

@@ -157,6 +157,7 @@ export const es = {
     replaceAriaLabel:   'Reemplazar con',
     replaceBtn:         'Reemplazar',
     noResults:          'Sin resultados',
+    useRegex:           'Usar expresión regular',
     replaceAllBtn:      'Reemplazar todo',
     close:              '×',
   },
@@ -275,6 +276,7 @@ export const es = {
       disableWordWrap:    'Desactivar ajuste de línea',
       convertToParagraph: 'Convertir en párrafo',
       deleteCodeBlock:    'Eliminar bloque de código',
+      lineNumbers:        'Alternar números de línea',
     },
     table: {
       ariaLabel:          'Acciones de tabla',
@@ -297,6 +299,11 @@ export const es = {
       tableBorderWidthPx: 'Grosor del borde (px)',
       cancelBtn:          'Cancelar',
       applyBtn:           'Aplicar',
+      sortAsc:            'Ordenar ascendente',
+      sortDesc:           'Ordenar descendente',
+      exportCSV:          'Exportar como CSV',
+      cellPadding:        'Relleno de celda',
+      cellPaddingPx:      'Relleno de celda (px)',
     },
     video: {
       ariaLabel:    'Acciones de vídeo',

package/src/js/i18n/fr.js

@@ -158,6 +158,7 @@ export const fr = {
     replaceAriaLabel:   'Remplacer par',
     replaceBtn:         'Remplacer',
     noResults:          'Aucun résultat',
+    useRegex:           'Utiliser une expression régulière',
     replaceAllBtn:      'Tout remplacer',
     close:              '\u00d7',
   },
@@ -276,6 +277,7 @@ export const fr = {
       disableWordWrap:    'Désactiver le retour à la ligne',
       convertToParagraph: 'Convertir en paragraphe',
       deleteCodeBlock:    'Supprimer le bloc de code',
+      lineNumbers:        'Activer/désactiver les numéros de ligne',
     },
     table: {
       ariaLabel:          'Actions du tableau',
@@ -298,6 +300,11 @@ export const fr = {
       tableBorderWidthPx: 'Épaisseur des bordures (px)',
       cancelBtn:          'Annuler',
       applyBtn:           'Appliquer',
+      sortAsc:            'Trier par ordre croissant',
+      sortDesc:           'Trier par ordre décroissant',
+      exportCSV:          'Exporter en CSV',
+      cellPadding:        'Rembourrage des cellules',
+      cellPaddingPx:      'Rembourrage des cellules (px)',
     },
     video: {
       ariaLabel:    'Actions de la vidéo',

package/src/js/i18n/ja.js

@@ -158,6 +158,7 @@ export const ja = {
     replaceAriaLabel:   '置換後のテキスト',
     replaceBtn:         '置換',
     noResults:          '結果なし',
+    useRegex:           '正規表現を使用',
     replaceAllBtn:      'すべて置換',
     close:              '\u00d7',
   },
@@ -276,6 +277,7 @@ export const ja = {
       disableWordWrap:    '折り返しを無効にする',
       convertToParagraph: '段落に変換',
       deleteCodeBlock:    'コードブロックを削除',
+      lineNumbers:        '行番号を切り替え',
     },
     table: {
       ariaLabel:          'テーブル操作',
@@ -298,6 +300,11 @@ export const ja = {
       tableBorderWidthPx: 'テーブルの枠幅 (px)',
       cancelBtn:          'キャンセル',
       applyBtn:           '適用',
+      sortAsc:            '昇順で並べ替え',
+      sortDesc:           '降順で並べ替え',
+      exportCSV:          'CSVとしてエクスポート',
+      cellPadding:        'セルの余白',
+      cellPaddingPx:      'セルの余白 (px)',
     },
     video: {
       ariaLabel:    '動画操作',

package/src/js/i18n/ko.js

@@ -157,6 +157,7 @@ export const ko = {
     replaceAriaLabel:   '바꿀 내용',
     replaceBtn:         '바꾸기',
     noResults:          '결과 없음',
+    useRegex:           '정규식 사용',
     replaceAllBtn:      '모두 바꾸기',
     close:              '×',
   },
@@ -275,6 +276,7 @@ export const ko = {
       disableWordWrap:    '줄 바꿈 해제',
       convertToParagraph: '단락으로 변환',
       deleteCodeBlock:    '코드 블록 삭제',
+      lineNumbers:        '줄 번호 전환',
     },
     table: {
       ariaLabel:          '표 작업',
@@ -297,6 +299,11 @@ export const ko = {
       tableBorderWidthPx: '표 테두리 너비 (px)',
       cancelBtn:          '취소',
       applyBtn:           '적용',
+      sortAsc:            '오름차순 정렬',
+      sortDesc:           '내림차순 정렬',
+      exportCSV:          'CSV로 내보내기',
+      cellPadding:        '셀 패딩',
+      cellPaddingPx:      '셀 패딩 (px)',
     },
     video: {
       ariaLabel:    '동영상 작업',

package/src/js/i18n/vi.js

@@ -159,6 +159,7 @@ export const vi = {
     replaceBtn:         'Thay thế',
     replaceAllBtn:      'Thay thế tất cả',
     noResults:          'Không có kết quả',
+    useRegex:           'Dùng biểu thức chính quy',
     close:              '\u00d7',
   },
 
@@ -276,6 +277,7 @@ export const vi = {
       disableWordWrap:    'Tắt xuống dòng',
       convertToParagraph: 'Chuyển thành đoạn văn',
       deleteCodeBlock:    'Xóa khối mã',
+      lineNumbers:        'Bật/Tắt số dòng',
     },
     table: {
       ariaLabel:          'Hành động bảng',
@@ -300,6 +302,11 @@ export const vi = {
       tableBorderWidthPx: 'Độ rộng viền bảng (px)',
       cancelBtn:          'Hủy',
       applyBtn:           'Áp dụng',
+      sortAsc:            'Sắp xếp tăng dần',
+      sortDesc:           'Sắp xếp giảm dần',
+      exportCSV:          'Xuất CSV',
+      cellPadding:        'Khoảng đệm ô',
+      cellPaddingPx:      'Khoảng đệm ô (px)',
     },
     video: {
       ariaLabel:    'Hành động video',

package/src/js/i18n/zh.js

@@ -158,6 +158,7 @@ export const zh = {
     replaceAriaLabel:   '替换为',
     replaceBtn:         '替换',
     noResults:          '没有结果',
+    useRegex:           '使用正则表达式',
     replaceAllBtn:      '全部替换',
     close:              '\u00d7',
   },
@@ -276,6 +277,7 @@ export const zh = {
       disableWordWrap:    '禁用自动换行',
       convertToParagraph: '转换为段落',
       deleteCodeBlock:    '删除代码块',
+      lineNumbers:        '切换行号',
     },
     table: {
       ariaLabel:          '表格操作',
@@ -298,6 +300,11 @@ export const zh = {
       tableBorderWidthPx: '表格边框宽度 (px)',
       cancelBtn:          '取消',
       applyBtn:           '应用',
+      sortAsc:            '升序排列',
+      sortDesc:           '降序排列',
+      exportCSV:          '导出为 CSV',
+      cellPadding:        '单元格内边距',
+      cellPaddingPx:      '单元格内边距 (px)',
     },
     video: {
       ariaLabel:    '视频操作',

package/src/js/index.js

@@ -141,7 +141,7 @@ const AutumnNote = {
   registerButton(btnDef) { registerButton(btnDef); return this; },
 
   /** Library version */
-  version: '1.6.6',
+  version: '1.7.0',
 };
 
 // ---------------------------------------------------------------------------

package/src/js/module/BaseDialog.js

@@ -19,6 +19,13 @@ export class BaseDialog {
     this._removeTrap = null;
   }
 
+  // ---------------------------------------------------------------------------
+  // Abstract — subclasses must override
+  // ---------------------------------------------------------------------------
+
+  /** @returns {HTMLElement} */
+  _buildDialog() { throw new Error('_buildDialog() must be implemented by subclass'); }
+
   // ---------------------------------------------------------------------------
   // Lifecycle (shared)
   // ---------------------------------------------------------------------------

package/src/js/module/CodeTooltip.js

@@ -14,6 +14,7 @@ const ICONS = {
   wrapOn:     `<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="3" y1="6" x2="21" y2="6"/><path d="M3 12h15a3 3 0 0 1 0 6H3"/><polyline points="6 15 3 18 6 21"/></svg>`,
   toParagraph:`<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M13 4v16"/><path d="M17 4v16"/><path d="M9 4h8a4 4 0 0 1 0 8H9V4z"/></svg>`,
   deleteCode: `<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="3 6 5 6 21 6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2"/></svg>`,
+  lineNumbers:  `<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="10" y1="6" x2="21" y2="6"/><line x1="10" y1="12" x2="21" y2="12"/><line x1="10" y1="18" x2="21" y2="18"/><path d="M4 6h1v4"/><path d="M4 10h2"/><path d="M6 18H4c0-1 2-2 2-3s-1-2-2-2"/></svg>`,
 };
 
 export class CodeTooltip {
@@ -26,6 +27,8 @@ export class CodeTooltip {
     this._hideTimer = null;
     this._disposers = [];
     this._copyBtn = null;
+    this._wrapBtn = null;
+    this._lineNumbersBtn = null;
     this._langSelect = null;
     this._prismScript = null; // script element while Prism is loading
   }
@@ -127,6 +130,10 @@ export class CodeTooltip {
     this._wrapBtn = this._makeBtn(ICONS.wrapOn, L.toggleWordWrap, () => this._toggleWrap());
     el.appendChild(this._wrapBtn);
 
+    // Toggle line numbers
+    this._lineNumbersBtn = this._makeBtn(ICONS.lineNumbers, L.lineNumbers, () => this._toggleLineNumbers());
+    el.appendChild(this._lineNumbersBtn);
+
     el.appendChild(this._sep());
 
     // Convert to normal paragraph
@@ -183,6 +190,7 @@ export class CodeTooltip {
     this._showTimer = setTimeout(() => {
       this._activePre = pre;
       this._syncWrapBtn();
+      this._syncLineNumbersBtn();
       this._syncLangSelect();
       this._show(pre);
     }, SHOW_DELAY);
@@ -248,6 +256,13 @@ export class CodeTooltip {
       : this.context.locale.tooltips.code.enableWordWrap;
   }
 
+  _syncLineNumbersBtn() {
+    if (!this._activePre || !this._lineNumbersBtn) return;
+    const on = this._activePre.classList.contains('an-code-line-numbers');
+    this._lineNumbersBtn.classList.toggle('active', on);
+    this._lineNumbersBtn.title = this.context.locale.tooltips.code.lineNumbers;
+  }
+
   _syncLangSelect() {
     if (!this._activePre || !this._langSelect) return;
     const codeEl = this._activePre.querySelector('code');
@@ -301,6 +316,14 @@ export class CodeTooltip {
     this._positionNear(pre);
   }
 
+  _toggleLineNumbers() {
+    const pre = this._activePre;
+    if (!pre) return;
+    pre.classList.toggle('an-code-line-numbers');
+    this._syncLineNumbersBtn();
+    this.context.invoke('editor.afterCommand');
+  }
+
   /**
    * Applies a language to a given <pre> element: sets classes, data-language,
    * and triggers Prism highlighting. Called by the auto-detect flow.

package/src/js/module/Editor.js

@@ -525,6 +525,14 @@ export class Editor {
     return this._history ? this._history.canRedo() : false;
   }
 
+  getUndoCount() {
+    return this._history ? this._history.getUndoCount() : 0;
+  }
+
+  getRedoCount() {
+    return this._history ? this._history.getRedoCount() : 0;
+  }
+
   // ---------------------------------------------------------------------------
   // Style commands (delegated to Style module)
   // ---------------------------------------------------------------------------

package/src/js/module/FindReplace.js

@@ -30,6 +30,7 @@ export class FindReplace extends BaseDialog {
     this._matches = [];
     this._currentIndex = -1;
     this._caseSensitive = false;
+    this._useRegex = false;
     /** @type {'find'|'replace'} */
     this._mode = 'find';
 
@@ -37,6 +38,7 @@ export class FindReplace extends BaseDialog {
     this._queryRegex = null;
     this._lastQuery = null;
     this._lastCaseSensitive = null;
+    this._lastUseRegex = null;
 
     this._focusTimer = null;
   }
@@ -169,6 +171,14 @@ export class FindReplace extends BaseDialog {
     });
     caseBtn.textContent = 'Aa';
 
+    const regexBtn = createElement('button', {
+      type: 'button',
+      class: 'an-fr-icon-btn',
+      title: L.useRegex,
+      'aria-label': L.useRegex,
+    });
+    regexBtn.textContent = '.*';
+
     const prevBtn = createElement('button', {
       type: 'button',
       class: 'an-fr-icon-btn',
@@ -188,7 +198,7 @@ export class FindReplace extends BaseDialog {
     const counter = createElement('span', { class: 'an-fr-counter' });
     this._counterEl = counter;
 
-    searchBar.append(findInput, caseCheckbox, caseBtn, prevBtn, nextBtn, counter);
+    searchBar.append(findInput, caseCheckbox, caseBtn, regexBtn, prevBtn, nextBtn, counter);
     box.appendChild(searchBar);
 
     // ---- Replace row: [input] [Replace] [All]  (hidden by default) ----
@@ -249,7 +259,14 @@ export class FindReplace extends BaseDialog {
         this._replace();
       }
     });
-    this._disposers.push(d1, d2, d3, d4, d5, d6, d7, d8, d9, d10, d11);
+    const dRegex = on(regexBtn, 'click', () => {
+      this._useRegex = !this._useRegex;
+      regexBtn.classList.toggle('an-fr-icon-btn--active', this._useRegex);
+      this._queryRegex = null; // force recompile
+      this._lastQuery = null;
+      this._onSearch();
+    });
+    this._disposers.push(d1, d2, d3, d4, d5, d6, d7, d8, d9, d10, d11, dRegex);
 
     return overlay;
   }
@@ -324,14 +341,22 @@ export class FindReplace extends BaseDialog {
    */
   _findRawMatches(query, root) {
     const results = [];
-    // Reuse compiled regex when query and case-sensitivity haven't changed
-    if (this._lastQuery !== query || this._lastCaseSensitive !== this._caseSensitive) {
+    // Reuse compiled regex when query, case-sensitivity, and regex mode haven't changed
+    if (this._lastQuery !== query || this._lastCaseSensitive !== this._caseSensitive || this._lastUseRegex !== this._useRegex) {
       const flags = this._caseSensitive ? 'g' : 'gi';
-      const escaped = query.replace(/[.*+?^${}()|[\]\\]/g, String.raw`\$&`);
-      this._queryRegex = new RegExp(escaped, flags);
+      try {
+        const pattern = this._useRegex
+          ? query
+          : query.replace(/[.*+?^${}()|[\]\\]/g, String.raw`\$&`);
+        this._queryRegex = new RegExp(pattern, flags);
+      } catch (_) {
+        this._queryRegex = null;
+      }
       this._lastQuery = query;
       this._lastCaseSensitive = this._caseSensitive;
+      this._lastUseRegex = this._useRegex;
     }
+    if (!this._queryRegex) return results;
     const re = this._queryRegex;
 
     // Cap results to prevent blocking the main thread on very large documents

package/src/js/module/Mention.js

@@ -269,14 +269,18 @@ export class Mention {
     this._query = query;
     clearTimeout(this._debounceTimer);
     this._debounceTimer = setTimeout(() => {
-      this._cfg.onSearch(this._query, (items) => {
+      const cb = (items) => {
         if (!Array.isArray(items) || items.length === 0) {
           this._hideDropdown();
           return;
         }
         this._renderItems(items);
         this._showDropdown();
-      });
+      };
+      const result = this._cfg.onSearch(this._query, cb);
+      if (result && typeof result.then === 'function') {
+        result.then(cb).catch(() => this._hideDropdown());
+      }
     }, this._cfg.debounce);
   }
 

package/src/js/module/Statusbar.js

@@ -90,9 +90,9 @@ export class Statusbar {
     }
 
     // Counters
-    this._wordCountEl = createElement('span', { class: 'an-word-count' });
-    this._charCountEl = createElement('span', { class: 'an-char-count' });
-    const info = createElement('div', { class: 'an-status-info' });
+    this._wordCountEl = createElement('span', { class: 'an-word-count', role: 'status', 'aria-live': 'polite', 'aria-atomic': 'true' });
+    this._charCountEl = createElement('span', { class: 'an-char-count', 'aria-live': 'polite', 'aria-atomic': 'true' });
+    const info = createElement('div', { class: 'an-status-info', 'aria-label': 'Editor statistics' });
     info.appendChild(this._wordCountEl);
     info.appendChild(this._charCountEl);
     this.el.appendChild(info);