Changeset 0.25.1 (#161)

src/js/note-editor.js

@@ -20,11 +20,11 @@
 // (editor pane, future notes-studio layout).
 
 const NoteEditor = {
-    _instances: new Map(),
+    ...createComponentRegistry('NoteEditor'),
 
     create(opts) {
         const pfx = opts.id || 'main';
-        const instance = {
+        const instance = componentMixin({
             id: pfx,
             rootEl:        document.getElementById(pfx + 'NoteEditor'),
             listViewEl:    document.getElementById(pfx + 'NotesListView'),
@@ -51,7 +51,6 @@ const NoteEditor = {
             _currentNote:   null,
             _sort:          'updated_desc',
             _cmEditor:      null,
-            _listeners:     [],
 
             // ── View Switching ───────────────────
 
@@ -78,7 +77,7 @@ const NoteEditor = {
 
             async loadNotes(folder, searchQuery) {
                 if (!this.listEl) return;
-                this.listEl.innerHTML = '<div class="notes-loading">Loading…</div>';
+                this.listEl.innerHTML = '<div class="loading">Loading…</div>';
 
                 try {
                     let notes;
@@ -92,7 +91,7 @@ const NoteEditor = {
                     }
 
                     if (notes.length === 0) {
-                        this.listEl.innerHTML = '<div class="notes-empty">' +
+                        this.listEl.innerHTML = '<div class="empty-hint">' +
                             (searchQuery ? 'No results found' : 'No notes yet') + '</div>';
                         return;
                     }
@@ -108,15 +107,15 @@ const NoteEditor = {
                         const date = note.updated_at ? new Date(note.updated_at).toLocaleDateString() : '';
                         item.innerHTML =
                             '<div class="note-content-col">' +
-                                '<div class="note-title">' + _neEsc(title) + '</div>' +
-                                '<div class="note-preview">' + _neEsc(preview) + '</div>' +
-                                '<div class="note-date">' + _neEsc(date) + '</div>' +
+                                '<div class="note-title">' + esc(title) + '</div>' +
+                                '<div class="note-preview">' + esc(preview) + '</div>' +
+                                '<div class="note-date">' + esc(date) + '</div>' +
                             '</div>';
                         item.addEventListener('click', () => self.openNote(note.id));
                         self.listEl.appendChild(item);
                     });
                 } catch (e) {
-                    this.listEl.innerHTML = '<div class="notes-empty">Failed to load: ' + _neEsc(e.message) + '</div>';
+                    this.listEl.innerHTML = '<div class="empty-hint">Failed to load: ' + esc(e.message) + '</div>';
                 }
             },
 
@@ -422,29 +421,15 @@ const NoteEditor = {
                 }
             },
 
-            // ── Lifecycle ───────────────────────
-
-            destroy() {
+            _cleanup() {
                 this._destroyCmEditor();
-                this._listeners.forEach(({ el, event, handler }) => el.removeEventListener(event, handler));
-                this._listeners = [];
                 this._editingNoteId = null;
                 this._currentNote = null;
-                NoteEditor._instances.delete(this.id);
             },
+        }, NoteEditor);
 
-            _on(el, event, handler) {
-                if (!el) return;
-                el.addEventListener(event, handler);
-                this._listeners.push({ el, event, handler });
-            },
-        };
-
-        NoteEditor._instances.set(pfx, instance);
+        NoteEditor._register(pfx, instance);
         return instance;
     },
-
-    get(id) { return this._instances.get(id) || null; },
 };
 
-function _neEsc(s) { const d = document.createElement('div'); d.textContent = s; return d.innerHTML; }