feat: Add plugin settings, improve internal link handling, and apply a default border to menu items.

2025-11-20 22:12:00 -05:00
parent 8b9e092329
commit fd6cf15700
4 changed files with 321 additions and 194 deletions
--- a/main.js
+++ b/main.js
@@ -29,8 +29,13 @@ __export(main_exports, {
 module.exports = __toCommonJS(main_exports);
 var import_obsidian = require("obsidian");
 var { shell } = require("electron");
+var DEFAULT_SETTINGS = {
+  mySetting: "default"
+};
 var MenuPlugin = class extends import_obsidian.Plugin {
  async onload() {
+    await this.loadSettings();
+    this.addSettingTab(new MenuPluginSettingTab(this.app, this));
    this.registerMarkdownCodeBlockProcessor("menu", (source, el, ctx) => {
      const lines = source.trim().split("\n");
      let layoutOrClass = "";
@@ -149,10 +154,7 @@ var MenuPlugin = class extends import_obsidian.Plugin {
          a.style.cursor = "pointer";
          a.addEventListener("click", (e) => {
            e.preventDefault();
-            const vaultName = this.app.vault.getName();
-            const encodedFile = encodeURIComponent(href);
-            const uri = `obsidian://open?vault=${encodeURIComponent(vaultName)}&file=${encodedFile}`;
-            window.open(uri);
+            this.app.workspace.openLinkText(href, ctx.sourcePath, false);
          });
        } else if (link.match(/^\[.*\]\(.*\)$/)) {
          const match = link.match(/^\[(.*)\]\((.*)\)$/);
@@ -197,6 +199,52 @@ var MenuPlugin = class extends import_obsidian.Plugin {
  }
  onunload() {
  }
+  async loadSettings() {
+    this.settings = Object.assign({}, DEFAULT_SETTINGS, await this.loadData());
+  }
+  async saveSettings() {
+    await this.saveData(this.settings);
+  }
+};
+var MenuPluginSettingTab = class extends import_obsidian.PluginSettingTab {
+  constructor(app, plugin) {
+    super(app, plugin);
+    this.plugin = plugin;
+  }
+  display() {
+    const { containerEl } = this;
+    containerEl.empty();
+    containerEl.createEl("h2", { text: "Menu Plugin Settings" });
+    new import_obsidian.Setting(containerEl).setName("Setting #1").setDesc("It's a secret").addText((text) => text.setPlaceholder("Enter your secret").setValue(this.plugin.settings.mySetting).onChange(async (value) => {
+      this.plugin.settings.mySetting = value;
+      await this.plugin.saveSettings();
+    }));
+    containerEl.createEl("hr");
+    containerEl.createEl("h3", { text: "Usage Guide" });
+    const doc = containerEl.createEl("div");
+    doc.createEl("p", { text: "Create a custom menu using the `menu` code block." });
+    doc.createEl("h4", { text: "Example" });
+    const pre = doc.createEl("pre");
+    pre.createEl("code", {
+      text: `\`\`\`menu
+layout: slate
+bg: #333
+text: white
+[[Internal Link]]
+[External Link](https://example.com)
+\`\`\``
+    });
+    doc.createEl("h4", { text: "Supported Properties" });
+    const ul = doc.createEl("ul");
+    ul.createEl("li", { text: "layout: default, minimal, slate, horizon, aether" });
+    ul.createEl("li", { text: "class: custom CSS classes" });
+    ul.createEl("li", { text: "colors: bg, text, border, font (supports hover- prefix)" });
+    doc.createEl("h4", { text: "Link Types" });
+    const ul2 = doc.createEl("ul");
+    ul2.createEl("li", { text: "[[Internal Link]] - Opens Obsidian note" });
+    ul2.createEl("li", { text: "[External Link](https://...) - Opens in browser" });
+    ul2.createEl("li", { text: "[File Link](file://...) - Opens local file/folder" });
+  }
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {});
--- a/main.ts
+++ b/main.ts
@@ -1,10 +1,24 @@
-import { Plugin } from 'obsidian';
+import { App, Plugin, PluginSettingTab, Setting } from 'obsidian';

 const { shell } = require('electron');

+interface MenuPluginSettings {
+    mySetting: string;
+}
+
+const DEFAULT_SETTINGS: MenuPluginSettings = {
+    mySetting: 'default'
+}

 export default class MenuPlugin extends Plugin {
+    settings: MenuPluginSettings;
+
    async onload() {
+        await this.loadSettings();
+
+        // This adds a settings tab so the user can configure various aspects of the plugin
+        this.addSettingTab(new MenuPluginSettingTab(this.app, this));
+
        this.registerMarkdownCodeBlockProcessor('menu', (source, el, ctx) => {
            const lines = source.trim().split('\n');
            let layoutOrClass = '';
@@ -146,10 +160,7 @@ export default class MenuPlugin extends Plugin {
                    a.style.cursor = 'pointer';
                    a.addEventListener('click', (e) => {
                        e.preventDefault();
-						const vaultName = this.app.vault.getName();
-						const encodedFile = encodeURIComponent(href);
-						const uri = `obsidian://open?vault=${encodeURIComponent(vaultName)}&file=${encodedFile}`;
-						window.open(uri);
+                        this.app.workspace.openLinkText(href, ctx.sourcePath, false);
                    });
                } else if (link.match(/^\[.*\]\(.*\)$/)) {
                    // External link
@@ -199,4 +210,71 @@ export default class MenuPlugin extends Plugin {
    onunload() {
        // Cleanup if needed
    }
+
+    async loadSettings() {
+        this.settings = Object.assign({}, DEFAULT_SETTINGS, await this.loadData());
+    }
+
+    async saveSettings() {
+        await this.saveData(this.settings);
+    }
+}
+
+class MenuPluginSettingTab extends PluginSettingTab {
+    plugin: MenuPlugin;
+
+    constructor(app: App, plugin: MenuPlugin) {
+        super(app, plugin);
+        this.plugin = plugin;
+    }
+
+    display(): void {
+        const { containerEl } = this;
+
+        containerEl.empty();
+
+        containerEl.createEl('h2', { text: 'Menu Plugin Settings' });
+
+        new Setting(containerEl)
+            .setName('Setting #1')
+            .setDesc('It\'s a secret')
+            .addText(text => text
+                .setPlaceholder('Enter your secret')
+                .setValue(this.plugin.settings.mySetting)
+                .onChange(async (value) => {
+                    this.plugin.settings.mySetting = value;
+                    await this.plugin.saveSettings();
+                }));
+
+        // --- Documentation Section ---
+        containerEl.createEl('hr');
+        containerEl.createEl('h3', { text: 'Usage Guide' });
+
+        const doc = containerEl.createEl('div');
+
+        doc.createEl('p', { text: 'Create a custom menu using the `menu` code block.' });
+
+        doc.createEl('h4', { text: 'Example' });
+        const pre = doc.createEl('pre');
+        pre.createEl('code', {
+            text: `\`\`\`menu
+layout: slate
+bg: #333
+text: white
+[[Internal Link]]
+[External Link](https://example.com)
+\`\`\``});
+
+        doc.createEl('h4', { text: 'Supported Properties' });
+        const ul = doc.createEl('ul');
+        ul.createEl('li', { text: 'layout: default, minimal, slate, horizon, aether' });
+        ul.createEl('li', { text: 'class: custom CSS classes' });
+        ul.createEl('li', { text: 'colors: bg, text, border, font (supports hover- prefix)' });
+
+        doc.createEl('h4', { text: 'Link Types' });
+        const ul2 = doc.createEl('ul');
+        ul2.createEl('li', { text: '[[Internal Link]] - Opens Obsidian note' });
+        ul2.createEl('li', { text: '[External Link](https://...) - Opens in browser' });
+        ul2.createEl('li', { text: '[File Link](file://...) - Opens local file/folder' });
+    }
 }
--- a/manifest.json
+++ b/manifest.json
@@ -1,7 +1,7 @@
 {
 	"id": "menu-plugin",
 	"name": "Obsidian Menus",
-	"version": "1.0.1",
+	"version": "1.2",
 	"minAppVersion": "0.15.0",
 	"description": "Create custom menus using code blocks with links and CSS styling.",
 	"author": "Olivier Legendre",
--- a/styles.css
+++ b/styles.css
@@ -128,6 +128,7 @@
        font-size: 0.9em;
        font-weight: normal;
        color: var(--text, var(--text-normal));
+        border: 1px solid var(--border, var(--background-modifier-border));
        background: var(--bg, transparent);
        font-family: var(--font, inherit);