@eox/pages-theme-eox 0.1.1 → 0.3.0

package/.prettierignore

@@ -0,0 +1 @@
+package-lock.json

package/config.mjs

@@ -0,0 +1,20 @@
+import { register } from "node:module";
+import { fileURLToPath, pathToFileURL } from "node:url";
+import path from "node:path";
+
+const __filename = fileURLToPath(import.meta.url); // get the resolved path to the file
+const __dirname = path.dirname(__filename); // get the name of the directory
+
+export default async (brandId = "eox") => {
+  // Register the https-hooks.mjs module
+  register(pathToFileURL(path.join(__dirname, "./src/https-hooks.mjs")));
+
+  // Load the remote brand configuration
+  const brand = await import(`https://hub-brands.eox.at/${brandId}/config.mjs`);
+
+  // Load the base VitePress configuration
+  const vitepressConfig = await import("./src/vitepressConfig.mjs");
+
+  // Generate the VitePress configuration for the brand
+  return vitepressConfig.generate(brand.config);
+};

package/package.json

@@ -1,9 +1,16 @@
 {
   "name": "@eox/pages-theme-eox",
-  "version": "0.1.1",
+  "version": "0.3.0",
   "type": "module",
   "description": "Vitepress Theme with EOX branding",
   "main": "src/index.js",
   "author": "EOX",
-  "license": "MIT"
+  "license": "MIT",
+  "scripts": {
+    "format": "npx prettier --write ."
+  },
+  "devDependencies": {
+    "@eox/eslint-config": "^2.0.0",
+    "vitepress": "^1.6.3"
+  }
 }

package/src/https-hooks.mjs

@@ -0,0 +1,31 @@
+/**
+ * This is required to be able to import modules from https
+ * See https://nodejs.org/api/module.html#import-from-https
+ */
+import { get } from "node:https";
+
+export function load(url, context, nextLoad) {
+  // For JavaScript to be loaded over the network, we need to fetch and
+  // return it.
+  if (url.startsWith("https://")) {
+    return new Promise((resolve, reject) => {
+      get(url, (res) => {
+        let data = "";
+        res.setEncoding("utf8");
+        res.on("data", (chunk) => (data += chunk));
+        res.on("end", () =>
+          resolve({
+            // This example assumes all network-provided JavaScript is ES module
+            // code.
+            format: "module",
+            shortCircuit: true,
+            source: data,
+          }),
+        );
+      }).on("error", (err) => reject(err));
+    });
+  }
+
+  // Let Node.js handle all other URLs.
+  return nextLoad(url);
+}

package/src/index.js

@@ -2,7 +2,13 @@ import DefaultTheme from "vitepress/theme";
 
 export default {
   extends: DefaultTheme,
-  enhanceApp({ siteData }) {
+  enhanceApp({ router, siteData }) {
+    router.onAfterRouteChanged = () => {
+      if (!import.meta.env.SSR) {
+        window.scrollTo(0, 0);
+      }
+    };
+
     if (!import.meta.env.SSR) {
       const brandStyle = document.createElement("style");
       brandStyle.appendChild(
@@ -20,7 +26,7 @@ export default {
         --vp-c-brand-3: color-mix(in srgb, ${siteData.value.themeConfig.theme.primaryColor} 80%, white);
         --vp-c-brand-soft: color-mix(in srgb, ${siteData.value.themeConfig.theme.primaryColor} 16%, transparent);
       }
-    `)
+    `),
       );
       document.head.appendChild(brandStyle);
     }

package/src/vitepressConfig.mjs

@@ -0,0 +1,34 @@
+/**
+ * Base configuration for VitePress
+ * Documentation: see https://vitepress.dev/reference/site-config
+ * @param {object} brandConfig The brand config
+ * @returns
+ */
+export const generate = (brandConfig) => ({
+  appearance: false,
+  cleanUrls: true,
+  themeConfig: {
+    siteTitle: false,
+    theme: {
+      primaryColor: brandConfig.theme?.primary_color,
+    },
+    logo: brandConfig.logo,
+    footer: {
+      message: `Powered by <img src="https://cockpit.hub.eox.at/storage/uploads/eoxhub/eoxhub_icon.svg" style="display: inline; height: 20px; transform: translateY(5px)" />`,
+      copyright:
+        'Copyright © 2014-present <a href="https://eox.at" target="_blank">EOX IT Services GmbH</a>',
+    },
+  },
+  title: brandConfig.meta?.title,
+  description: brandConfig.meta?.description,
+  head: [["link", { rel: "icon", href: brandConfig.meta?.favicon }]],
+  vue: {
+    template: {
+      compilerOptions: {
+        isCustomElement: (tag) => {
+          return tag.toLowerCase().includes("-");
+        },
+      },
+    },
+  },
+});