ThemeChooser 1.10.1

Author: dwertheimer

np.ThemeChooser/CHANGELOG.md

@@ -1,5 +1,10 @@
 # np.ThemeChooser Changelog
 
+## [1.10.0] 2026-03-26 @dwertheimer
+
+- Add **Refresh Current Theme** command: re-applies the active theme (`Editor.setTheme` with the current file) to reload theme CSS after editing a theme
+- **setTheme** / frontmatter theme change: apply with `Editor.setTheme(filename)` directly after lookup (avoid routing through `chooseTheme`) so the theme does not snap back
+
 ## [1.9.1] 2025-02-20 @dwertheimer
 
 - Add support for Eduard's hex colors in frontmatter (do not quote the hex color even though it's illegal YAML)

np.ThemeChooser/plugin.json

@@ -4,8 +4,8 @@
   "noteplan.minAppVersion": "3.7.2",
   "plugin.id": "np.ThemeChooser",
   "plugin.name": "🎨 Theme Chooser",
-  "plugin.version": "1.9.1",
-  "plugin.lastUpdateInfo": "1.9.1 Add support for Eduard's hex colors in frontmatter.\nPreviously: Add color picker to choose colors and write to frontmatter",
+  "plugin.version": "1.10.1",
+  "plugin.lastUpdateInfo": "1.10.1 Add /Reload Page with Current Theme to re-apply the active theme and reload CSS.\nPreviously: Add /Refresh Current Theme to re-apply the active theme and reload CSS.",
   "plugin.description": "Choose from your favorite themes",
   "plugin.author": "dwertheimer",
   "plugin.dependencies": [],
@@ -39,6 +39,15 @@
         "theme name"
       ]
     },
+    {
+      "name": "Reload Page with Current Theme",
+      "description": "Re-apply the active theme to reload theme CSS (e.g. after editing the theme file)",
+      "jsFunction": "refreshCurrentTheme",
+      "alias": [
+        "rthm", "refresh"
+      ],
+      "arguments": []
+    },
     {
       "name": "Choose HTML Color for Background",
       "description": "Choose a color and either save to the clipboard or write to frontmatter",

np.ThemeChooser/src/NPThemeChooser.js

@@ -68,7 +68,7 @@ export async function chooseTheme(
       logDebug(pluginJson, `chooseTheme: "${themeName}" chosen`)
       const selected = await getThemeObj(themeName)
       if (selected && selected.filename) {
-        logDebug(pluginJson, `chooseTheme: About to Editor.setTheme(${selected.filename}) Editor.setTheme(${selected.name})`)
+        logDebug(pluginJson, `chooseTheme: About to Editor.setTheme(${selected.filename}) Theme name: ${selected.name}`)
         Editor.setTheme(selected.filename)
       } else {
         logError(pluginJson, `chooseTheme filename does not exist: selected=${JSP(selected)}`)
@@ -268,6 +268,29 @@ export async function toggleTheme() {
   }
 }
 
+/**
+ * Re-apply the active theme so NotePlan reloads theme CSS (same as `Editor.setTheme` with the current theme file).
+ * Plugin entrypoint for "/Refresh Current Theme"
+ * @returns {void}
+ */
+export function refreshCurrentTheme(): void {
+  try {
+    if (!Editor) {
+      showMessage(`You must be in the Editor with a document open to run this command`)
+      return
+    }
+    const filename = Editor.currentTheme?.filename
+    if (filename?.length) {
+      logDebug(pluginJson, `refreshCurrentTheme: Editor.setTheme(${filename})`)
+      Editor.setTheme(filename)
+    } else {
+      logError(pluginJson, `refreshCurrentTheme: no current theme filename`)
+    }
+  } catch (error) {
+    logError(pluginJson, JSP(error))
+  }
+}
+
 /**
  * Change theme from frontmatter:
  *    triggers: onOpen => np.ThemeChooser.setTheme
@@ -281,12 +304,13 @@ export async function changeThemeFromFrontmatter() {
     logDebug(pluginJson, `changeThemeFromFrontmatter running`)
     const frontMatter = getFrontmatterAttributes(Editor)
     if (frontMatter && frontMatter.theme) {
-      const themeName = frontMatter.theme
-      // validate that a theme of that name exists
+      const themeName = String(frontMatter.theme).trim()
+      // validate that a theme of that name exists, then set by filename (avoid chooseTheme name/early-exit + double lookup)
       logDebug(pluginJson, `changeThemeFromFrontmatter: themeName="${themeName}"`)
       const themeObj = getThemeObjByName(themeName)
-      if (themeObj) {
-        await chooseTheme(themeName)
+      if (themeObj && themeObj.filename) {
+        logDebug(pluginJson, `changeThemeFromFrontmatter: Editor.setTheme(${themeObj.filename})`)
+        Editor.setTheme(themeObj.filename)
       } else {
         logDebug(pluginJson, `changeThemeFromFrontmatter: 'Theme named: "${themeName}" does not exist. Please check the exact name of the theme'`)
         await showMessage(`Theme named: "${themeName}" does not exist. Please check the exact name of the theme`)

np.ThemeChooser/src/index.js

@@ -1,6 +1,14 @@
 // @flow
 
-export { chooseTheme, setDefaultLightDarkTheme, toggleTheme, copyCurrentTheme, changeThemeFromFrontmatter, addThemeFrontmatter } from './NPThemeChooser' // add one of these for every command specifified in plugin.json (the function could be in any file as long as it's exported)
+export {
+  chooseTheme,
+  setDefaultLightDarkTheme,
+  toggleTheme,
+  copyCurrentTheme,
+  changeThemeFromFrontmatter,
+  addThemeFrontmatter,
+  refreshCurrentTheme,
+} from './NPThemeChooser' // add one of these for every command specifified in plugin.json (the function could be in any file as long as it's exported)
 export { copyThemeStyle, editStyleAttribute, createThemeSamples, setColor, removeStyle } from './NPThemeCustomizer'
 export { changePreset, runPreset01, runPreset02, runPreset03, runPreset04, runPreset05 } from './NPThemePresets'
 export { onOpenTheme, onOpenRefreshPage, onEdit, onSave, onUpdateOrInstall, init, onSettingsUpdated } from './NPThemeHooks'