0.0.13

English

Version 0.0.13 of My Own Icons. M.O.I. is the short name of the project.

This release fixes a bug that broke every icon

Versions 0.0.11 and 0.0.12 show no icons at all. Do not use them.

The cause was mine. To satisfy a lint rule I replaced document.createElement("span") with
document.createSpan(). That looks equivalent and is not. Obsidian patches Node.prototype.createEl
and there it always sets parent to the receiver, so the new element is appended. Called on
document, it throws HierarchyRequestError, because a document is allowed exactly one child. The
global createSpan() without a receiver appends only when info.parent is set and otherwise returns
a detached element, which is what document.createElement did.

Seven places were affected: the editor widget, the explorer rows, the badge in tabs and titles, both
color probes, the file input in the export and the icon preview in the settings tab. All of them now
use the global form. A test reads every plugin file and fails if a create helper is ever called with a
document as the receiver again, so this cannot come back silently.

The settings header appeared twice

My own doing as well. The definition set name and the render callback then drew the same name a
second time. Name and slogan now both come from Obsidian, through name and desc. The three CSS
classes that existed only for that custom header are gone.

Also in this version

• The review flagged an assertion in setControlValue that did not change the type. It is replaced
  by a type guard over the five switch names. That was a real fix, not just a lint one: the old
  k in DEFAULT_SETTINGS also matched the two path fields, so a boolean could have landed in a
  string field.
• The review also flagged vault enumeration. listSvgNames walked the whole vault with
  vault.getFiles() just to filter one folder. It now walks that folder through getFolderByPath,
  so the plugin no longer touches file paths outside its own icon folder.

Bundle 198 KB, 78 tests green, both TypeScript checks and the formatter clean.

Install

Download manifest.json, main.js and styles.css from this release and copy them into
<Vault>/.obsidian/plugins/moi-icons/, then enable the plugin under Settings, Community plugins.
If you came from 0.0.11 or 0.0.12, replace all three files.

---

Deutsch

Version 0.0.13 von My Own Icons. M.O.I. ist die Kurzform des Projekts.

Diese Fassung behebt einen Fehler, der jedes Icon kaputt gemacht hat

In 0.0.11 und 0.0.12 wird kein einziges Icon angezeigt. Beide Fassungen nicht benutzen.

Die Ursache war meine. Um eine Lint-Regel zu erfüllen, habe ich document.createElement("span")
durch document.createSpan() ersetzt. Das sieht gleichwertig aus und ist es nicht. Obsidian patcht
Node.prototype.createEl und setzt dort immer parent auf den Empfänger, das Ergebnis wird also
angehängt. Auf document aufgerufen wirft das HierarchyRequestError, weil ein Dokument genau ein
Kind haben darf. Der globale createSpan() ohne Empfänger hängt nur, wenn info.parent gesetzt ist,
und liefert sonst ein losgelöstes Element, genau wie vorher document.createElement.

Betroffen waren sieben Stellen: das Editor-Widget, die Explorer-Zeilen, der Badge in Tabs und Titeln,
beide Farb-Sonden, das Datei-Feld im Export und die Icon-Vorschau im Settings-Tab. Alle nutzen jetzt
die globale Form. Ein Test liest jede Plugin-Datei und schlägt fehl, sobald doch wieder ein
create-Helfer mit document als Empfänger aufgerufen wird.

Der Settings-Kopf stand zweimal da

Ebenfalls mein Fehler. Die Definition setzte name, und der render-Callback malte denselben Namen
noch einmal. Name und Slogan kommen jetzt beide von Obsidian, über name und desc. Die drei
CSS-Klassen, die es nur für diesen eigenen Kopf gab, sind weg.

Ebenfalls in dieser Fassung

• Der Review hat eine Assertion in setControlValue bemängelt, die den Typ nicht ändert. Ersetzt
  durch einen Type Guard über die fünf Schalternamen. Das war eine echte Korrektur: das alte
  k in DEFAULT_SETTINGS traf auch die beiden Pfadfelder, ein Boolean hätte in einem String-Feld
  landen können.
• Der Review hat außerdem die Vault-Enumeration gemeldet. listSvgNames lief mit vault.getFiles()
  über den ganzen Vault, um einen Ordner herauszufiltern. Jetzt läuft es über getFolderByPath nur
  durch diesen Ordner, das Plugin fasst keine Dateipfade außerhalb seines Icon-Ordners mehr an.

Bundle 198 KB, 78 Tests grün, beide TypeScript-Prüfungen und der Formatter sauber.

Installation

manifest.json, main.js und styles.css aus diesem Release herunterladen und nach
<Vault>/.obsidian/plugins/moi-icons/ kopieren, dann unter Einstellungen, Community-Plugins
aktivieren. Wer von 0.0.11 oder 0.0.12 kommt, ersetzt alle drei Dateien.

0.0.12

English

Version 0.0.12 of My Own Icons. M.O.I. is the short name of the project.

Settings tab rebuilt on the declarative API

Obsidian deprecated the imperative display() and expects plugins to describe their settings instead. This version does that. The settings now show up in Obsidian's settings search, which they did not before.

The interesting part was where the values go. For declarative controls, Obsidian persists the settings itself through saveData. This plugin keeps the icon cache, the recently used list and the favorites in the same envelope, so an automatic save would have wiped them the first time you flipped a switch. getControlValue and setControlValue are therefore overridden: reading and writing still go through the plugin's own save queue, text fields stay debounced and switches still apply immediately.

Requires Obsidian 1.13.0 now

The declarative API only exists from 1.13.0, so minAppVersion moved from 1.8.7 to 1.13.0. This does not cut anyone off: if your Obsidian is older, the installer reads versions.json and gives you 0.0.11, which still works from 1.8.7. Update to 1.13 or newer when you want this version.

Also in this version

• One more Object.fromEntries in the CDN cache removed. It sat in the flush path and was missed in the previous round; the return type of Object.fromEntries is any in this TypeScript setup, which is what the review flagged.
• Bundle 199 KB, 77 tests green, both TypeScript checks and the formatter clean.

Install

Download manifest.json, main.js and styles.css from this release and copy them into <Vault>/.obsidian/plugins/moi-icons/, then enable the plugin under Settings, Community plugins.

---

Deutsch

Version 0.0.12 von My Own Icons. M.O.I. ist die Kurzform des Projekts.

Settings-Tab auf der deklarativen API neu gebaut

Obsidian hat display() abgekündigt und erwartet, dass Plugins ihre Einstellungen beschreiben statt sie zu zeichnen. Diese Fassung tut das. Die Einstellungen tauchen jetzt in der Obsidian-Suche auf, vorher nicht.

Interessant war der Datenweg. Bei deklarativen Steuerelementen speichert Obsidian selbst, über saveData. Das Plugin hält aber Icon-Cache, zuletzt benutzt und Favoriten im selben Envelope, ein automatisches Speichern hätte ihnen beim ersten Schalter den Boden entzogen. getControlValue und setControlValue sind deshalb überschrieben: Lesen und Schreiben laufen weiter über die eigene Save-Queue, Textfelder bleiben entprellt und Schalter greifen sofort.

Braucht jetzt Obsidian 1.13.0

Die deklarative API gibt es erst ab 1.13.0, deshalb steht minAppVersion jetzt auf 1.13.0 statt 1.8.7. Das schneidet niemanden ab: Bei einer älteren Obsidian-Version liest der Installer versions.json und nimmt 0.0.11, das läuft weiter ab 1.8.7. Update auf 1.13 oder neuer, wenn du diese Fassung willst.

Ebenfalls in dieser Fassung

• Ein weiteres Object.fromEntries im CDN-Cache entfernt. Es steckte im Flush-Pfad und war in der Runde davor übersehen worden; der Rückgabetyp von Object.fromEntries ist in diesem TypeScript-Setup any, das war die Beanstandung.
• Bundle 199 KB, 77 Tests grün, beide TypeScript-Prüfungen und der Formatter sauber.

Installation

manifest.json, main.js und styles.css aus diesem Release herunterladen und nach <Vault>/.obsidian/plugins/moi-icons/ kopieren, dann unter Einstellungen, Community-Plugins aktivieren.

0.0.11

English

First public release of My Own Icons, version 0.0.11. M.O.I. is the short name of the project.

The plugin exists because I wanted to use my own SVG files in Obsidian, and I could not find an existing plugin that did that the way I wanted. The icon in a note is a shortcode, so drawing an SVG and dropping it into _assets/icons is all it takes.

{{icon:my-own-icon}}

What it does

• {{icon:name}} anywhere in a note, with optional size, color and a dark theme variant
• Icons in the file explorer, set with a right click, with color and size per file or folder
• The same icon in the tab bar and in the note title
• Frontmatter fields icon, iconColor, iconSize and iconDark
• One icon per file extension as a fallback
• Icon picker with search, preview, favorites, a free hex color and autocomplete
• Icon gallery listing every assignment, plus unused files
• Devicon, Simple Icons and the selfh.st homelab set loaded on demand, cached on the device
• Export and import of the whole setup as a JSON package
• Interface in German, English, French and Spanish
• No runtime dependencies

Details worth knowing

• Icons inside code blocks are left alone, both in the editor and in reading view, so the shortcode syntax can be written down.
• A missing file keeps the text intact and reports the name it looked for, in the tooltip and the console.
• SVGs are cleaned before they are rendered. Scripts, event handlers, external references and embedded styles are removed, and what remains is parsed with DOMParser and inserted as real nodes instead of being written into innerHTML.
• Loading from CDN is off by default. When it is on, icons are fetched from jsdelivr only.
• Requires Obsidian 1.8.7 or newer, because the plugin uses getLanguage().
• Owning several plugins that claim the same interface spots at once (Iconic, Iconize, Icon Folder) leads to overlapping icons. The plugin shows a notice once per session.
• The settings tab still uses the imperative display() API. The declarative one exists only from Obsidian 1.13, and the plugin supports 1.8.7 and newer, so its settings do not show up in the settings search on 1.13.

State of the code

The automated review Obsidian runs on every submission rejected an earlier version, and fixing what it found is most of what changed here. All four errors were the same class of problem: SVG strings were written into innerHTML. They now go through DOMParser and importNode, so the string never reaches an HTML parser at all. Alongside that, static style assignments moved to setCssStyles and to a CSS class, the deprecated builtin-modules package is gone, and an unused function was removed.

Three review rounds before that, each one found real bugs rather than cosmetics. Two tabs writing at the same time could overwrite a mapping, icons in code blocks were turned into pictures, and unchecked values from data.json could break the icon lookup. The bundle went from 289 KB down to 199 KB. The test suite has 77 tests, npm run typecheck covers the plugin tree and the test scripts, Prettier keeps the formatting in one shape, and a GitHub Actions workflow builds every tagged version and attaches it to a draft release.

This version was written with opencode, mostly with Claude models. The code is mine and I understand it, but not every line was written by hand.

Install

Download manifest.json, main.js and styles.css from this release and copy them into <Vault>/.obsidian/plugins/moi-icons/, then enable the plugin under Settings, Community plugins. The plugin id is moi-icons.

---

Deutsch

Erste öffentliche Fassung von My Own Icons, Version 0.0.11. M.O.I. ist die Kurzform des Projekts.

Das Plugin gibt es, weil ich meine eigenen SVG-Dateien in Obsidian benutzen wollte und kein vorhandenes Plugin das so konnte, wie ich es wollte. Das Icon in einer Notiz ist ein Shortcode, ein selbst gezeichnetes SVG in _assets/icons legen genügt.

{{icon:my-own-icon}}

Was es kann

• {{icon:name}} irgendwo in einer Notiz, mit optionaler Größe, Farbe und dunkler Variante
• Icons in der Seitenleiste, per Rechtsklick gesetzt, mit Farbe und Größe je Datei oder Ordner
• Dasselbe Icon in der Tableiste und im Notiztitel
• Frontmatter-Felder icon, iconColor, iconSize und iconDark
• Ein Icon je Dateiendung als Rückfall
• Icon-Auswahl mit Suche, Vorschau, Favoriten, freiem Hex-Wert und Vorschlägen
• Galerie mit allen Zuordnungen und ungenutzten Dateien
• Devicon, Simple Icons und die selfh.st-Homelab-Sammlung bei Bedarf, Geräte-Cache
• Gesamten Bestand als JSON-Paket exportieren und wieder einlesen
• Oberfläche auf Deutsch, Englisch, Französisch und Spanisch
• Ohne Laufzeitabhängigkeiten

Wissenswertes

• Icons in Codeblöcken bleiben unangetastet, im Editor wie im Lesemodus, die Shortcode-Syntax lässt sich also aufschreiben.
• Fehlt eine Datei, bleibt der Text stehen und der gesuchte Name steht im Tooltip und in der Konsole.
• SVGs werden vor dem Rendern bereinigt. Skripte, Event-Handler, externe Verweise und eingebettete Stile werden entfernt, der Rest wird mit DOMParser geparst und als echter Knoten eingesetzt statt über innerHTML geschrieben.
• Das Nachladen vom CDN ist standardmäßig aus. Wenn es an ist, kommen Icons ausschließlich von jsdelivr.
• Braucht Obsidian 1.8.7 oder neuer, weil das Plugin getLanguage() nutzt.
• Werden mehrere Plugins mit denselben UI-Stellen gleichzeitig aktiv (Iconic, Iconize, Icon Folder), überlappen die Icons. Das Plugin meldet das einmal pro Sitzung.
• Der Settings-Tab nutzt weiterhin display(). Die deklarative API gibt es erst ab 1.13, das Plugin läuft ab 1.8.7, deshalb tauchen seine Einstellungen ab 1.13 nicht in der Settings-Suche auf.

Stand des Codes

Die automatische Prüfung, die Obsidian bei jeder Einreichung laufen lässt, hat eine frühere Version mit Fehlern zurückgewiesen. Was hier geändert wurde, ist im Wesentlichen ihre Behebung. Alle vier Fehler waren dieselbe Art Problem: SVG-Strings wurden über innerHTML geschrieben. Sie laufen jetzt über DOMParser und importNode, der String erreicht also gar keinen HTML-Parser mehr. Dazu kommen statische Style-Zuweisungen über setCssStyles und eine CSS-Klasse, das abgekündigte Paket builtin-modules ist raus und eine unbenutzte Funktion wurde entfernt.

Davor drei Review-Runden, jede hat echte Fehler gefunden, nicht Kosmetik. Zwei parallel schreibende Tabs konnten eine Zuordnung überschreiben, Icons in Codeblöcken wurden zu Bildern, und ungeprüfte Werte aus data.json konnten die Icon-Suche brechen. Das Bundle ging von 289 KB auf 199 KB. Die Testsuite umfasst 77 Tests, npm run typecheck prüft Plugin-Baum und Testskripte, Prettier hält die Formatierung in einer Form, und ein GitHub-Workflow baut jede getaggte Version und hängt sie an einen Release-Entwurf.

Diese Fassung entstand mit opencode, meist mit Claude-Modellen. Der Code ist meiner und ich verstehe ihn, aber nicht jede Zeile ist handgeschrieben.

Installation

manifest.json, main.js und styles.css aus diesem Release herunterladen und nach <Vault>/.obsidian/plugins/moi-icons/ kopieren, dann unter Einstellungen, Community-Plugins aktivieren. Die Plugin-ID ist moi-icons.