chore: add inquirer, add blank theme

templates/blank/build-theme.ts

@@ -0,0 +1,40 @@
+import fs from "fs";
+import archiver from "archiver";
+import path from "path";
+
+export const toSafeName = (name: string) => {
+  return name
+    .toLowerCase()
+    .replace(/[<>:"/\\|?*]/g, "_")
+    .replace(/[\x00-\x1F\x7F]/g, "_")
+    .replace(/[\s-]+/g, "_")
+    .replace(/_+/g, "_")
+    .replace(/[. ]+$/g, "_");
+};
+
+const themeInfo = JSON.parse(fs.readFileSync("theme.json", "utf-8"));
+
+const distDir = path.resolve("dist");
+const output = fs.createWriteStream(
+  path.join(distDir, `${toSafeName(themeInfo.name)}.ezpplauncher-theme`),
+);
+
+const archive = archiver("zip", { zlib: { level: 9 } });
+archive.pipe(output);
+
+archive.file("theme.json", { name: "theme.json" });
+archive.file(path.join(distDir, "bundle.js"), { name: "bundle.js" });
+
+if (fs.existsSync(path.join(distDir, "ezpp-theme.css"))) {
+  archive.file(path.join(distDir, "ezpp-theme.css"), { name: "style.css" });
+}
+
+if (fs.existsSync("public/assets")) {
+  archive.directory("public/assets", "assets");
+}
+
+archive.finalize();
+
+output.on("close", () => {
+  console.log("✅ Theme packaged:", output.path);
+});

templates/blank/index.html

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html>
+  <body>
+    <div id="app"></div>
+
+    <script type="module">
+      import { mountTheme } from '/src/main.ts';
+
+      mountTheme(document.getElementById('app'), {
+        assets: "yes"
+      });
+    </script>
+  </body>
+</html>

templates/blank/package.json

@@ -0,0 +1,19 @@
+{
+  "name": "ezpp-theme",
+  "version": "1.0.0",
+  "scripts": {
+    "dev": "vite dev",
+    "build": "vite build && ts-node build-theme.ts"
+  },
+  "devDependencies": {
+    "@sveltejs/vite-plugin-svelte": "^7.0.0",
+    "@types/archiver": "^7.0.0",
+    "archiver": "^7.0.1",
+    "svelte": "^5.55.0",
+    "ts-node": "^10.0.0",
+    "typescript": "^6.0.3",
+    "vite": "^8.0.10",
+    "tailwindcss": "^4.0.0",
+    "@tailwindcss/vite": "^4.0.0"
+  }
+}

templates/blank/src/App.svelte

@@ -0,0 +1,6 @@
+<script lang="ts">
+  import { asset } from "./lib/assets";
+  import type { EZPPLauncherThemeAPI } from "./types";
+
+  const props: { api: EZPPLauncherThemeAPI } = $props();
+</script>

templates/blank/src/app.css

@@ -0,0 +1,2 @@
+@import "tailwindcss";
+/* generate custom tailwindcss themes using https://tweakcn.com/editor/theme */

templates/blank/src/app.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="vite/client" />
+
+declare module '*.png';
+declare module '*.jpg';
+declare module '*.jpeg';
+declare module '*.gif';
+declare module '*.webp';
+declare module '*.svg';

templates/blank/src/lib/assets.ts

@@ -0,0 +1,9 @@
+import type { EZPPLauncherThemeAPI } from "../types";
+
+export function asset(api: EZPPLauncherThemeAPI, path: string) {
+  const isDev = import.meta.env.DEV;
+
+  return isDev
+    ? `/assets/${path}`
+    : `${api.assets}/${path}`;
+}

templates/blank/src/main.ts

@@ -0,0 +1,14 @@
+// @ts-ignore: side-effect CSS import declaration not available in this context
+import "./app.css";
+import App from "./App.svelte";
+import { mount } from "svelte";
+import type { EZPPLauncherThemeAPI } from "./types";
+
+export function mountTheme(target: HTMLElement, api: EZPPLauncherThemeAPI) {
+  mount(App, {
+    target,
+    props: {
+      api,
+    },
+  });
+}

templates/blank/src/types.ts

@@ -0,0 +1,3 @@
+export type EZPPLauncherThemeAPI = {
+  assets: string;
+}

templates/blank/theme.json

@@ -0,0 +1,9 @@
+{
+  "name": "ezpp-theme",
+  "version": "1.0.0",
+  "apiVersion": "1.0",
+  "author": "HorizonCode",
+  "entry": "bundle.js",
+  "style": "style.css",
+  "preview": "preview.png"
+}

templates/blank/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "include": ["src"]
+}

templates/blank/vite.config.ts

@@ -0,0 +1,26 @@
+import { defineConfig } from "vite";
+import { svelte } from "@sveltejs/vite-plugin-svelte";
+import tailwindcss from "@tailwindcss/vite";
+
+export default defineConfig({
+  plugins: [svelte(), tailwindcss()],
+  build: {
+    cssCodeSplit: false,
+    lib: {
+      entry: "src/main.ts",
+      formats: ["es"],
+      name: "EZPPTheme",
+    },
+    rollupOptions: {
+      output: {
+        entryFileNames: "bundle.js",
+        assetFileNames: (assetInfo) => {
+          if (assetInfo.names?.some((n) => n.endsWith(".css"))) {
+            return "ezpp-theme.css";
+          }
+          return "assets/[name]-[hash][extname]";
+        },
+      },
+    },
+  },
+});