@picloom/create-theme 0.1.0 → 0.1.1

package/README.md

@@ -7,7 +7,7 @@ system `zip` is required.
 Create a project:
 
 ```sh
-bun create @picloom/theme@0.1.0 ./my-theme
+bun create @picloom/theme@0.1.1 ./my-theme
 cd my-theme
 bun install
 bun run dev
@@ -17,18 +17,21 @@ bun run preview
 
 The target must not exist; its parent must exist. The creator copies files only;
 it does not install dependencies, initialize Git or publish. Both home and login
-pages start from the same source used by Picloom's built-in default theme.
+pages start from the template maintained in this package.
 `--help` prints usage.
 
 To test local packages, use the `.tgz` workflow in
 [theme tooling](https://llleixx.github.io/picloom/development/theme-tooling.html).
 Maintainers run `bun run build:create-theme` before `bun pm pack --ignore-scripts`.
-The build copies `themes/default/` into the distribution template and bundles
-shared pure helpers into private preview tooling. Do not edit `dist/template/`.
+The build copies `template/` into `dist/template/` without reading the host repository. Preview and ZIP builds are provided
+by `@picloom/theme-tools`; generated projects do not contain a copy of the preview host.
+Do not edit `dist/template/`. Use exact npm version 0.1.1.
 
 ## 中文
 
-基于宿主同一份默认主题源码创建独立 Vue 3 主题。提供模拟预览、热更新、生产产物预览与 ZIP 打包。
+基于工具链仓库独立维护的模板创建 Vue 3 主题。提供模拟预览、热更新、生产产物预览与 ZIP 打包。
 创建工具只复制文件，不覆盖已有目录、不安装依赖、不初始化 Git、不发布。
 模拟预览不连接真实服务；上传、登录与权限必须在隔离测试实例安装后验证。
-通过 npm 创建项目，也可按文档使用本地 `.tgz` 验证开发版本。模板在创建工具构建时自动生成，不手工维护第二份默认主题。
+通过 npm 创建项目，也可按文档使用本地 `.tgz` 验证开发版本。编辑 `template/` 维护模板，构建时复制到 `dist/template/`，不依赖主仓库默认主题源码。
+
+协议类型来自 `@picloom/theme-sdk`，预览与构建调用 `@picloom/theme-tools`；生成项目不复制通用工具代码。

package/dist/template/README.md

@@ -40,7 +40,7 @@ there. Increase `theme.json.version` before distributing changed content; packag
 versions are immutable on the host. The package builder checks structure and
 resources; full configuration/manifest validation still runs on installation.
 
-The SDK dependency is pinned to a published npm version.
+SDK and tool dependencies use exact versions after publication. During local validation, install the matching local tarballs; the current development versions are not yet published.
 Commit your generated `bun.lock` to your own repository after installation.
 
 ## 中文
@@ -49,9 +49,12 @@ Commit your generated `bun.lock` to your own repository after installation.
 - `bun run dev` 提供模拟首页、登录页、上传状态、语言和明暗模式；只用于界面开发。
 - 修改 Vue 组件及样式会热更新；入口、清单和本地配置修改后刷新预览。
 - 首次启动时按 Schema 默认值创建 `dev/config.json`，之后清空或删除值不会自动补回。
-- `bun run build` 先检查类型，再构建并生成可安装 ZIP；`bun run preview` 检查已有构建产物。
+- `bun run typecheck` 单独检查类型；`bun run build` 构建并生成可安装 ZIP；`bun run preview` 检查已有构建产物。
 - 修改主题 ID、显示名称和版本均以 `theme.json` 为准，静态资源放入 `public/assets/`。
 - 入口导入的样式合并为 `style.css`，须保留清单全局样式声明；页面专属样式通过各页面的 `styles` 引用，切页时分别加载和卸载。
 - 主题包不包含开发面板、本地配置、凭据或源码映射。所有主题配置可能公开，不要保存密钥。
 - 在隔离 Picloom 测试实例安装 ZIP 后验证真实上传和登录；模拟成功不代表真实服务已验证。
-- SDK 依赖固定到 npm 版本；首次安装后将生成的 `bun.lock` 提交到自己的仓库。
+- SDK 和开发工具在发布后使用 npm 精确版本；当前未发布版本使用本地包验证，安装时同步更新锁文件。
+
+Local preview and ZIP builds are provided by `@picloom/theme-tools` using this theme’s Vite configuration.
+本地预览和 ZIP 构建由 `@picloom/theme-tools` 统一提供，使用本主题的 Vite 配置，不复制预览宿主源码。

package/dist/template/gitignore

@@ -2,3 +2,6 @@ node_modules/
 dist/
 .env
 .env.*
+
+# Local preview configuration
+**/dev/config.json

package/dist/template/package.json

@@ -7,21 +7,21 @@
     "bun": ">=1.4.3"
   },
   "scripts": {
-    "dev": "bun scripts/serve.ts",
+    "dev": "bun --bun picloom-theme dev",
     "typecheck": "bun --bun vue-tsc --noEmit",
-    "build": "bun run typecheck && bun scripts/build.ts",
-    "preview": "bun scripts/serve.ts --preview"
+    "build": "bun --bun picloom-theme build",
+    "preview": "bun --bun picloom-theme preview"
   },
   "devDependencies": {
-    "@picloom/theme-sdk": "0.1.0",
+    "@picloom/theme-sdk": "0.1.1",
     "@tailwindcss/vite": "4.3.3",
     "@types/bun": "1.3.10",
     "@vitejs/plugin-vue": "6.0.10",
-    "fflate": "0.8.2",
     "tailwindcss": "4.3.3",
     "typescript": "5.9.3",
     "vite": "8.3.4",
     "vue": "3.5.44",
-    "vue-tsc": "3.3.13"
+    "vue-tsc": "3.3.13",
+    "@picloom/theme-tools": "0.1.0"
   }
 }

package/dist/template/tsconfig.json

@@ -9,14 +9,19 @@
     "skipLibCheck": true,
     "resolveJsonModule": true,
     "esModuleInterop": true,
-    "lib": ["ES2022", "DOM", "DOM.Iterable"],
-    "types": ["bun", "vite/client"]
+    "lib": [
+      "ES2022",
+      "DOM",
+      "DOM.Iterable"
+    ],
+    "types": [
+      "bun",
+      "vite/client"
+    ]
   },
   "include": [
     "src/**/*.ts",
     "src/**/*.vue",
-    "dev/**/*.ts",
-    "scripts/**/*.ts",
     "vite.config.ts"
   ]
 }

package/dist/template/vite.config.ts

@@ -2,10 +2,13 @@ import { defineConfig } from "vite";
 import vue from "@vitejs/plugin-vue";
 import tailwindcss from "@tailwindcss/vite";
 import { resolve } from "node:path";
-export default defineConfig({
+export default defineConfig(({ command }) => ({
   plugins: [vue(), tailwindcss()],
   publicDir: false,
-  define: { "process.env.NODE_ENV": JSON.stringify("production") },
+  define:
+    command === "build"
+      ? { "process.env.NODE_ENV": JSON.stringify("production") }
+      : {},
   build: {
     outDir: "dist/package",
     emptyOutDir: true,
@@ -17,4 +20,4 @@ export default defineConfig({
       cssFileName: "style",
     },
   },
-});
+}));

package/index.js

@@ -50,7 +50,7 @@ if (args.length === 1 && ["--help", "-h"].includes(args[0])) {
     await writeFile(packagePath, JSON.stringify(pkg, null, 2) + "\n");
     const quotedDirectory = "'" + args[0].replaceAll("'", "'\\''") + "'";
     console.log(
-      `Created ${target}\n\nNext:\n  cd ${quotedDirectory}\n  bun install\n  bun run dev\n  bun run build\n\nUpload dist/${manifest.id}-${manifest.version}.zip to Picloom.`,
+      `Created ${target}\n\nNext:\n  cd ${quotedDirectory}\n  bun install\n  bun run typecheck\n  bun run dev\n  bun run build\n\nUpload dist/${manifest.id}-${manifest.version}.zip to Picloom.`,
     );
   } catch (error) {
     console.error(

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@picloom/create-theme",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "Create a standalone Picloom Vue theme with local preview and ZIP packaging",
   "type": "module",
   "license": "MIT",
@@ -22,7 +22,7 @@
   ],
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/llleixx/picloom.git",
+    "url": "git+https://github.com/llleixx/picloom-tooling.git",
     "directory": "tools/create-theme"
   },
   "publishConfig": {

package/dist/template/dev/context.ts

@@ -1,363 +0,0 @@
-import type {
-  Config,
-  Manifest,
-  Page,
-  Snapshot,
-  ThemeContext,
-  Upload,
-} from "@picloom/theme-sdk";
-import { languages, messageText } from "./helpers.js";
-export const scenarios = [
-  "ready",
-  "loading",
-  "uploading",
-  "success",
-  "failed",
-  "no-profiles",
-  "login-error",
-] as const;
-export type Scenario = (typeof scenarios)[number];
-const copy = <T>(value: T): T => structuredClone(value);
-export function createPreview(
-  manifest: Manifest,
-  config: Config,
-  navigate: (page: Page) => void,
-) {
-  const listeners = new Set<(snapshot: Snapshot) => void>();
-  const timers = new Set<ReturnType<typeof setTimeout>>();
-  const motion = matchMedia("(prefers-color-scheme: dark)");
-  const state: Snapshot = {
-    page: location.pathname === "/login" ? "login" : "home",
-    site: {
-      name: "Preview gallery",
-      homeTitle: "Preview gallery",
-      description: "SIMULATED uploads and login · 模拟上传与登录",
-      logoUrl: "",
-      faviconUrl: "",
-    },
-    user: null,
-    locale: manifest.defaultLocale,
-    locales: manifest.supportedLocales,
-    languages: languages.filter((language) =>
-      manifest.supportedLocales.includes(language.tag),
-    ),
-    defaultLocale: manifest.defaultLocale,
-    mode: "auto",
-    dark: motion.matches,
-    profiles: [
-      {
-        id: "mock",
-        name: "Simulated / 模拟上传",
-        enabled: true,
-        available: true,
-        maxUploadBytes: 50 * 1024 ** 2,
-        allowedMimeTypes: [
-          "image/jpeg",
-          "image/png",
-          "image/webp",
-          "image/svg+xml",
-        ],
-        reason: null,
-      },
-    ],
-    selectedProfileId: "mock",
-    uploads: [],
-    loading: false,
-    error: "",
-    login: { busy: false, error: "", expired: false, unavailable: false },
-    copy: {
-      format: "URL",
-      auto: false,
-      formats: ["URL", "Markdown", "HTML", "BBCode"],
-    },
-    notice: "",
-  };
-  let scenario: Scenario = "ready",
-    alive = true;
-  const text = (en: string, zh: string) => (state.locale === "zh-CN" ? zh : en);
-  function emit() {
-    if (alive) for (const listener of listeners) listener(copy(state));
-  }
-  function later(callback: () => void, delay: number) {
-    const timer = setTimeout(() => {
-      timers.delete(timer);
-      if (alive) callback();
-    }, delay);
-    timers.add(timer);
-  }
-  function clear() {
-    for (const timer of timers) clearTimeout(timer);
-    timers.clear();
-  }
-  function notify(en: string, zh: string) {
-    state.notice = text(en, zh);
-    emit();
-  }
-  function result(id: string) {
-    return { id, url: `https://example.invalid/simulated/${id}.png` };
-  }
-  function format(url: string) {
-    switch (state.copy.format) {
-      case "Markdown":
-        return `![](${url})`;
-      case "HTML":
-        return `<img src="${url}" alt="">`;
-      case "BBCode":
-        return `[img]${url}[/img]`;
-      default:
-        return url;
-    }
-  }
-  async function copyText(value: string) {
-    try {
-      await navigator.clipboard.writeText(value);
-      notify("Copied", "已复制");
-    } catch {
-      notify("Clipboard unavailable", "剪贴板不可用");
-    }
-  }
-  function run(item: Upload) {
-    later(() => {
-      if (
-        !state.uploads.includes(item) ||
-        !["queued", "uploading"].includes(item.status)
-      )
-        return;
-      item.status = "uploading";
-      item.progress = Math.min(100, item.progress + 25);
-      if (item.progress === 100) {
-        item.status = "success";
-        item.result = result(item.id);
-        if (state.copy.auto) void copyText(format(item.result.url));
-      } else run(item);
-      emit();
-    }, 400);
-  }
-  function add(name: string, size: number, sourceUrl?: string) {
-    if (
-      !state.profiles.some(
-        (profile) =>
-          profile.id === state.selectedProfileId && profile.available,
-      )
-    ) {
-      notify(
-        "Choose an available simulated profile",
-        "请选择可用的模拟上传方案",
-      );
-      return;
-    }
-    const item: Upload = {
-      id: crypto.randomUUID(),
-      name,
-      size,
-      profileName: state.profiles[0]!.name,
-      sourceUrl,
-      status: "queued",
-      progress: 0,
-    };
-    state.uploads = [...state.uploads, item];
-    run(item);
-    emit();
-  }
-  function setScenario(value: Scenario) {
-    clear();
-    scenario = value;
-    state.uploads = [];
-    state.loading = value === "loading";
-    state.login.busy = false;
-    state.login.error =
-      value === "login-error"
-        ? text("Simulated login failure", "模拟登录失败")
-        : "";
-    state.notice = "";
-    state.profiles = state.profiles.map((profile) => ({
-      ...profile,
-      available: value !== "no-profiles",
-    }));
-    state.selectedProfileId = value === "no-profiles" ? "" : "mock";
-    if (["uploading", "success", "failed"].includes(value)) {
-      const item: Upload = {
-        id: "preview-image",
-        name: "simulated-image.png",
-        size: 128 * 1024,
-        profileName: state.profiles[0]!.name,
-        status: value as Upload["status"],
-        progress: value === "uploading" ? 50 : value === "success" ? 100 : 0,
-      };
-      if (value === "success") item.result = result(item.id);
-      if (value === "failed") {
-        item.error = text("Simulated upload failure", "模拟上传失败");
-        item.resumable = true;
-      }
-      state.uploads = [item];
-    }
-    emit();
-  }
-  function appearance() {
-    state.dark = state.mode === "auto" ? motion.matches : state.mode === "dark";
-    document.documentElement.classList.toggle("dark", state.dark);
-    emit();
-  }
-  motion.addEventListener("change", appearance);
-  const ctx: ThemeContext = {
-    apiVersion: 1,
-    config: copy(config),
-    getSnapshot: () => copy(state),
-    subscribe(listener) {
-      listeners.add(listener);
-      listener(copy(state));
-      return () => {
-        listeners.delete(listener);
-      };
-    },
-    asset(path) {
-      if (
-        !path ||
-        path.startsWith("/") ||
-        /[\\:?*<>"|]/.test(path) ||
-        path.split("/").some((part) => !part || part === "." || part === "..")
-      )
-        throw Error("Invalid package asset path");
-      return new URL("/" + path, location.origin).href;
-    },
-    t(key, params = {}) {
-      return messageText(manifest, state.locale, key).replace(
-        /\{(\w+)\}/g,
-        (match, name: string) => String(params[name] ?? match),
-      );
-    },
-    localized(value) {
-      if (typeof value === "string") return value;
-      if (!value || typeof value !== "object" || Array.isArray(value))
-        return "";
-      return typeof value[state.locale] === "string"
-        ? (value[state.locale] as string)
-        : "";
-    },
-    setLocale(language) {
-      if (!state.locales.includes(language))
-        throw Error("Language is not supported");
-      state.locale = language;
-      document.documentElement.lang = language;
-      if (state.login.error)
-        state.login.error = text("Simulated login failure", "模拟登录失败");
-      for (const item of state.uploads)
-        if (item.error)
-          item.error = text("Simulated upload failure", "模拟上传失败");
-      emit();
-    },
-    setMode(mode) {
-      state.mode = mode;
-      appearance();
-    },
-    navigate(page) {
-      if (page === "app")
-        notify(
-          "Workspace is unavailable in simulated preview",
-          "模拟预览不提供管理后台",
-        );
-      else navigate(page);
-    },
-    selectProfile(id) {
-      state.selectedProfileId = id;
-      emit();
-    },
-    async refresh() {
-      state.error = "";
-      setScenario("ready");
-    },
-    uploads: {
-      add(files) {
-        for (const file of files) add(file.name, file.size);
-      },
-      addUrls(urls) {
-        for (const sourceUrl of urls) {
-          try {
-            const url = new URL(sourceUrl);
-            if (!["http:", "https:"].includes(url.protocol)) throw Error();
-            add(
-              url.pathname.split("/").pop() || "remote-image",
-              1024,
-              sourceUrl,
-            );
-          } catch {
-            notify("Invalid image URL", "图片地址无效");
-          }
-        }
-      },
-      async cancel(id) {
-        const item = state.uploads.find((item) => item.id === id);
-        if (item && ["queued", "uploading"].includes(item.status))
-          item.status = "cancelled";
-        emit();
-      },
-      resume(id) {
-        const item = state.uploads.find((item) => item.id === id);
-        if (item?.resumable) {
-          item.status = "queued";
-          item.error = undefined;
-          run(item);
-          emit();
-        }
-      },
-      async dismiss(id) {
-        state.uploads = state.uploads.filter((item) => item.id !== id);
-        emit();
-      },
-    },
-    links: {
-      format,
-      async copy(url) {
-        await copyText(format(url));
-      },
-      async copyAll() {
-        await copyText(
-          state.uploads
-            .flatMap((item) => (item.result ? [format(item.result.url)] : []))
-            .join("\n"),
-        );
-      },
-      setPreferences(format, auto) {
-        if (!state.copy.formats.includes(format))
-          throw Error("Unknown copy format");
-        state.copy = { ...state.copy, format, auto };
-        emit();
-      },
-    },
-    async login(username, _password) {
-      state.login.busy = true;
-      state.login.error = "";
-      emit();
-      await new Promise<void>((resolve) => setTimeout(resolve, 150));
-      if (!alive) return;
-      state.login.busy = false;
-      if (scenario === "login-error")
-        state.login.error = text("Simulated login failure", "模拟登录失败");
-      else {
-        state.user = { name: username || "Preview user" };
-        navigate("home");
-      }
-      emit();
-    },
-  };
-  appearance();
-  document.documentElement.lang = state.locale;
-  return {
-    ctx,
-    setScenario,
-    setPage(page: Page) {
-      state.page = page;
-      emit();
-    },
-    setUser(signedIn: boolean) {
-      state.user = signedIn ? { name: "Preview user" } : null;
-      emit();
-    },
-    dispose() {
-      alive = false;
-      clear();
-      listeners.clear();
-      motion.removeEventListener("change", appearance);
-    },
-  };
-}

package/dist/template/dev/helpers.d.ts

@@ -1,18 +0,0 @@
-import type { Field, Json } from "@picloom/theme-sdk";
-export function initialValue(schema: Field, value?: Json): Json | undefined;
-export function messageText(
-  catalog: {
-    defaultLocale: string;
-    messages: Record<string, Record<string, string>>;
-  },
-  locale: string,
-  key: string,
-): string;
-export const supportedLocales: readonly string[];
-export const languages: readonly {
-  tag: string;
-  name: string;
-  direction: string;
-}[];
-export function safeName(value: unknown): value is string;
-export function assetPath(value: unknown): value is string;

package/dist/template/dev/helpers.js

@@ -1,114 +0,0 @@
-// ../../shared/field-schema.ts
-function cloneJson(value) {
-  return JSON.parse(JSON.stringify(value));
-}
-function pointer(key) {
-  return key.replace(/~/g, "~0").replace(/\//g, "~1");
-}
-function sensitivePaths(schema, path = "") {
-  if (schema["x-sensitive"] === true || schema.type === "array" && schema.items && sensitivePaths(schema.items).length > 0)
-    return [path];
-  return Object.entries(schema.properties ?? {}).flatMap(([key, rule]) => sensitivePaths(rule, path + "/" + pointer(key)));
-}
-var keywords = new Set([
-  "$schema",
-  "type",
-  "properties",
-  "required",
-  "additionalProperties",
-  "items",
-  "enum",
-  "const",
-  "default",
-  "minimum",
-  "maximum",
-  "exclusiveMinimum",
-  "exclusiveMaximum",
-  "multipleOf",
-  "minLength",
-  "maxLength",
-  "pattern",
-  "format",
-  "minItems",
-  "maxItems",
-  "uniqueItems",
-  "if",
-  "then",
-  "else",
-  "allOf",
-  "anyOf",
-  "oneOf",
-  "not",
-  "x-localized",
-  "x-sensitive",
-  "x-immutable",
-  "x-ui"
-]);
-function initialValue(schema, value) {
-  if (schema["x-sensitive"] === true || schema.type === "array" && sensitivePaths(schema).length)
-    return;
-  const seed = value === undefined ? schema.default : value;
-  if (schema.type === "object") {
-    if (seed !== undefined && (!seed || typeof seed !== "object" || Array.isArray(seed)))
-      return cloneJson(seed);
-    const result = seed === undefined ? {} : cloneJson(seed);
-    for (const [key, rule] of Object.entries(schema.properties ?? {})) {
-      const child = initialValue(rule, Object.hasOwn(result, key) ? result[key] : undefined);
-      if (child !== undefined)
-        result[key] = child;
-      else
-        delete result[key];
-    }
-    return seed !== undefined || Object.keys(result).length ? result : undefined;
-  }
-  if (schema.type === "array" && Array.isArray(seed))
-    return seed.map((item) => initialValue(schema.items, item) ?? null);
-  return seed === undefined ? undefined : cloneJson(seed);
-}
-// ../../shared/package-localization.ts
-function localeCandidates(locale, fallback) {
-  const tag = Intl.getCanonicalLocales(locale)[0];
-  return [
-    ...new Set([
-      tag,
-      tag.split("-")[0],
-      Intl.getCanonicalLocales(fallback)[0]
-    ])
-  ];
-}
-function messageText(resource, locale, key) {
-  for (const tag of localeCandidates(locale, resource.defaultLocale)) {
-    const dictionary = resource.messages[tag];
-    const value = dictionary && Object.hasOwn(dictionary, key) ? dictionary[key] : undefined;
-    if (value !== undefined)
-      return value;
-  }
-  return key;
-}
-// ../../shared/locales.ts
-var languages = [
-  {
-    tag: "zh-CN",
-    name: "简体中文",
-    direction: "ltr",
-    aliases: ["zh"]
-  },
-  {
-    tag: "en-US",
-    name: "English",
-    direction: "ltr",
-    aliases: ["en"]
-  }
-];
-var supportedLocales = languages.map((language) => language.tag);
-// ../../shared/theme-package.ts
-var safeName = (v) => typeof v === "string" && /^[a-zA-Z0-9][a-zA-Z0-9._-]{0,99}$/.test(v) && !v.endsWith(".");
-var assetPath = (v) => typeof v === "string" && v.length <= 240 && !/[\\:< >"|?*\x00-\x1f]/.test(v) && v.split("/").every((p) => !!p && p !== "." && p !== ".." && !/[. ]$/.test(p));
-export {
-  assetPath,
-  initialValue,
-  languages,
-  messageText,
-  safeName,
-  supportedLocales
-};

package/dist/template/dev/index.html

@@ -1,12 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <title>Picloom theme preview</title>
-  </head>
-  <body>
-    <div id="app"></div>
-    <script type="module" src="/dev/main.ts"></script>
-  </body>
-</html>

package/dist/template/dev/main.ts

@@ -1,179 +0,0 @@
-import { manifest, config, production } from "virtual:picloom-preview";
-import { createPreview, scenarios, type Scenario } from "./context";
-import type { Page, ThemeModule } from "@picloom/theme-sdk";
-const root = document.getElementById("app")!;
-let instance: { dispose(): void } | undefined,
-  generation = 0;
-const sourceModule = production ? "/entry.js" : "/src/entry.ts";
-const runtime = createPreview(manifest, config, navigate);
-const preview = document.createElement("aside");
-preview.id = "picloom-preview-tools";
-const shadow = preview.attachShadow({ mode: "open" });
-shadow.innerHTML = `<style>:host{position:fixed;right:12px;bottom:12px;z-index:2147483647;font:13px system-ui;color:#eee}details{background:#15212e;border:1px solid #617080;border-radius:10px;padding:12px;max-width:300px;box-shadow:0 4px 20px #0005}summary{cursor:pointer;font-weight:bold}label{display:grid;gap:4px;margin-top:10px}select{background:#fff;color:#17212c;padding:5px;min-width:220px}p{max-width:260px;font-size:12px}output{display:block;color:#ffd37c;white-space:pre-wrap;overflow-wrap:anywhere}</style>
-<details open><summary>Picloom · Preview / 预览</summary><p>${production ? "Production build / 构建产物" : "Source HMR / 源码热更新"}<br>SIMULATED uploads and login<br>模拟上传与登录，不连接真实服务</p>
-<label>Page / 页面<select id="page"><option value="home">Home / 首页</option><option value="login">Login / 登录</option></select></label>
-<label>Language / 语言<select id="language"></select></label>
-<label>Appearance / 外观<select id="mode"><option value="auto">System / 跟随系统</option><option value="light">Light / 浅色</option><option value="dark">Dark / 深色</option></select></label>
-<label>Identity / 身份<select id="identity"><option value="guest">Guest / 访客</option><option value="user">Signed in / 已登录</option></select></label>
-<label>Scenario / 场景<select id="scenario"></select></label><output role="alert"></output></details>`;
-document.body.append(preview);
-const select = (id: string) => shadow.getElementById(id) as HTMLSelectElement;
-const errors = shadow.querySelector("output")!;
-function option(value: string, label: string) {
-  const node = document.createElement("option");
-  node.value = value;
-  node.textContent = label;
-  return node;
-}
-for (const language of runtime.ctx.getSnapshot().languages)
-  select("language").append(option(language.tag, language.name));
-const labels: Record<Scenario, string> = {
-  ready: "Ready / 就绪",
-  loading: "Loading / 加载中",
-  uploading: "Uploading / 上传中",
-  success: "Success / 上传成功",
-  failed: "Failed / 上传失败",
-  "no-profiles": "No profiles / 无可用方案",
-  "login-error": "Login error / 登录失败",
-};
-for (const scenario of scenarios)
-  select("scenario").append(option(scenario, labels[scenario]));
-select("page").onchange = () => navigate(select("page").value as Page);
-select("language").onchange = () =>
-  runtime.ctx.setLocale(select("language").value);
-select("mode").onchange = () =>
-  runtime.ctx.setMode(select("mode").value as "auto" | "light" | "dark");
-select("identity").onchange = () =>
-  runtime.setUser(select("identity").value === "user");
-select("scenario").onchange = () =>
-  runtime.setScenario(select("scenario").value as Scenario);
-const stop = runtime.ctx.subscribe((state) => {
-  select("page").value = state.page;
-  select("language").value = state.locale;
-  select("mode").value = state.mode;
-  select("identity").value = state.user ? "user" : "guest";
-});
-function cleanup() {
-  const previous = instance;
-  instance = undefined;
-  try {
-    previous?.dispose();
-  } catch (error) {
-    errors.textContent = String(error);
-  } finally {
-    root.replaceChildren();
-  }
-}
-async function mount() {
-  const current = ++generation;
-  errors.textContent = "";
-  cleanup();
-  const subscriptions = new Set<() => void>();
-  const links: HTMLLinkElement[] = [];
-  const container = document.createElement("div");
-  root.append(container);
-  let mounted: Awaited<ReturnType<ThemeModule["mount"]>> | undefined;
-  let cleaned = false;
-  const context = {
-    ...runtime.ctx,
-    subscribe(listener: Parameters<typeof runtime.ctx.subscribe>[0]) {
-      // An async mount may continue after its page has already been unmounted.
-      if (cleaned) return () => {};
-      const stop = runtime.ctx.subscribe(listener);
-      subscriptions.add(stop);
-      return () => {
-        stop();
-        subscriptions.delete(stop);
-      };
-    },
-  };
-  const dispose = () => {
-    if (cleaned) return;
-    cleaned = true;
-    try {
-      if (typeof mounted?.dispose === "function") mounted.dispose();
-    } finally {
-      for (const stop of subscriptions) stop();
-      subscriptions.clear();
-      for (const link of links) link.remove();
-      container.remove();
-    }
-  };
-  instance = { dispose };
-  try {
-    const page = runtime.ctx.getSnapshot().page;
-    const declaration = manifest.pages[page];
-    if (!declaration)
-      throw Error(
-        `Theme does not declare ${page}; the real host will use its default page`,
-      );
-    const styles = new Set([
-      ...(manifest.styles ?? []),
-      ...(declaration.styles ?? []),
-    ]);
-    await Promise.all(
-      [...styles]
-        .filter((path) => production || path !== "style.css")
-        .map(
-          (path) =>
-            new Promise<void>((resolve, reject) => {
-              // The source entry imports src/style.css; other declared styles are public assets.
-              const link = document.createElement("link");
-              link.rel = "stylesheet";
-              link.href = runtime.ctx.asset(path);
-              link.onload = () => resolve();
-              link.onerror = () =>
-                reject(Error(`Missing theme style: ${path}`));
-              links.push(link);
-              document.head.append(link);
-            }),
-        ),
-    );
-    if (current !== generation || cleaned) return;
-    const module: ThemeModule = await import(/* @vite-ignore */ sourceModule);
-    if (typeof module.mount !== "function")
-      throw Error("Theme must export mount(container, context)");
-    if (current !== generation || cleaned) return;
-    mounted = await module.mount(container, context);
-    if (!mounted || typeof mounted.dispose !== "function")
-      throw Error("mount() must return { dispose() }");
-    if (current !== generation || cleaned) {
-      if (cleaned) mounted.dispose();
-      else dispose();
-    }
-  } catch (error) {
-    try {
-      dispose();
-    } finally {
-      if (current === generation) errors.textContent = String(error);
-    }
-  }
-}
-function navigate(page: Page) {
-  history.pushState(null, "", page === "login" ? "/login" : "/");
-  runtime.setPage(page);
-  void mount();
-}
-function popstate() {
-  runtime.setPage(location.pathname === "/login" ? "login" : "home");
-  void mount();
-}
-window.addEventListener("popstate", popstate);
-function dispose() {
-  generation++;
-  cleanup();
-  stop();
-  runtime.dispose();
-  preview.remove();
-  window.removeEventListener("popstate", popstate);
-}
-function pagehide(event: PageTransitionEvent) {
-  if (!event.persisted) dispose();
-}
-window.addEventListener("pagehide", pagehide);
-import.meta.hot?.dispose(() => {
-  window.removeEventListener("pagehide", pagehide);
-  dispose();
-});
-// Vue SFC/CSS updates use normal HMR. Entry changes invalidate the importer and reload.
-await mount();

package/dist/template/dev/virtual.d.ts

@@ -1,5 +0,0 @@
-declare module "virtual:picloom-preview" {
-  export const manifest: import("@picloom/theme-sdk").Manifest;
-  export const config: import("@picloom/theme-sdk").Config;
-  export const production: boolean;
-}

package/dist/template/scripts/build.ts

@@ -1,119 +0,0 @@
-import {
-  mkdir,
-  readdir,
-  readFile,
-  lstat,
-  writeFile,
-  cp,
-  rm,
-} from "node:fs/promises";
-import { resolve, relative, dirname } from "node:path";
-import { build } from "vite";
-import { zipSync, strToU8 } from "fflate";
-import { assetPath, readManifest } from "./manifest";
-const manifest = await readManifest();
-const output = resolve("dist/package");
-const archive = resolve("dist", `${manifest.id}-${manifest.version}.zip`);
-// A failed build must not leave an older ZIP looking like the new result.
-await rm(archive, { force: true });
-await build();
-async function files(root: string): Promise<string[]> {
-  if ((await lstat(root)).isSymbolicLink())
-    throw Error(`Do not package symbolic links: ${root}`);
-  const result: string[] = [];
-  for (const name of await readdir(root)) {
-    const path = resolve(root, name),
-      stat = await lstat(path);
-    if (stat.isSymbolicLink())
-      throw Error(`Do not package symbolic links: ${path}`);
-    if (stat.isDirectory()) result.push(...(await files(path)));
-    else if (stat.isFile()) result.push(path);
-    else throw Error(`Unsupported file: ${path}`);
-  }
-  return result;
-}
-try {
-  for (const path of await files(resolve("public/assets"))) {
-    const name = relative(resolve("public"), path).replaceAll("\\", "/");
-    if (
-      !assetPath(name) ||
-      /(?:^|\/)\./.test(name) ||
-      /\.(?:map|env|pem|key|ts|vue)$/i.test(name)
-    )
-      throw Error(`Not a distributable theme asset: ${name}`);
-    const destination = resolve(output, name);
-    if (await Bun.file(destination).exists())
-      throw Error(`Asset collides with build output: ${name}`);
-    await mkdir(dirname(destination), { recursive: true });
-    await cp(path, destination);
-  }
-} catch (error) {
-  if ((error as NodeJS.ErrnoException).code !== "ENOENT") throw error;
-}
-await cp("LICENSE", output + "/LICENSE");
-const declaration = JSON.stringify(manifest, null, 2) + "\n";
-if (strToU8(declaration).byteLength > 256 * 1024)
-  throw Error("theme.json exceeds 256 KiB");
-await writeFile(output + "/theme.json", declaration);
-const entries: Record<string, Uint8Array> = {};
-const names = new Set<string>();
-let total = 0;
-for (const path of await files(output)) {
-  const name = relative(output, path).replaceAll("\\", "/");
-  if (
-    !assetPath(name) ||
-    names.has(name.toLowerCase()) ||
-    /(?:^|\/)(con|prn|aux|nul|com[1-9]|lpt[1-9])(?:\.|\/|$)/i.test(name) ||
-    /(?:^|\/)\./.test(name) ||
-    name.endsWith(".map")
-  )
-    throw Error(`Invalid or duplicate package path: ${name}`);
-  names.add(name.toLowerCase());
-  const bytes = new Uint8Array(await readFile(path));
-  total += bytes.byteLength;
-  if (total > 50 * 1024 * 1024 || names.size > 512)
-    throw Error("Theme exceeds 50 MiB expanded or 512 files");
-  if (/\.m?js$/.test(name)) {
-    const code = new TextDecoder().decode(bytes);
-    const imports = new Bun.Transpiler({
-      loader: "js",
-      target: "browser",
-    }).scanImports(code);
-    if (imports.length)
-      throw Error(
-        `Unbundled runtime imports in ${name}; this template produces a self-contained entry`,
-      );
-    if (
-      /["'`]\/(?:@vite|@id|@fs|src|dev)\/|localhost:\d|127\.0\.0\.1:\d|\/\/[#@]\s*sourceMappingURL=/.test(
-        code,
-      )
-    )
-      throw Error(`Development reference in ${name}`);
-  }
-  if (
-    name.endsWith(".css") &&
-    /localhost:\d|127\.0\.0\.1:\d|(?:url|@import)\s*\(?["']?\/(?:src|dev|@vite)\//.test(
-      new TextDecoder().decode(bytes),
-    )
-  )
-    throw Error(`Development reference in ${name}`);
-  entries[name] = bytes;
-}
-if (entries["style.css"] && !manifest.styles?.includes("style.css"))
-  throw Error(
-    "The template bundles imported CSS into style.css; declare it in theme.json styles",
-  );
-for (const name of [
-  ...(manifest.styles ?? []),
-  ...(manifest.preview ? [manifest.preview] : []),
-  ...Object.values(manifest.pages).flatMap((page) => [
-    page.entry,
-    ...(page.styles ?? []),
-  ]),
-]) {
-  if (!entries[name]) throw Error(`Missing theme resource: ${name}`);
-}
-const zip = zipSync(entries);
-if (zip.byteLength > 20 * 1024 * 1024) throw Error("Theme ZIP exceeds 20 MiB");
-await Bun.write(archive, zip);
-console.log(archive);

package/dist/template/scripts/manifest.ts

@@ -1,61 +0,0 @@
-import { readFile } from "node:fs/promises";
-import type { Manifest } from "@picloom/theme-sdk";
-import { supportedLocales, safeName, assetPath } from "../dev/helpers.js";
-export { assetPath } from "../dev/helpers.js";
-export async function readManifest(path = "theme.json"): Promise<Manifest> {
-  const value = JSON.parse(await readFile(path, "utf8"));
-  const object = (v: unknown): v is Record<string, any> =>
-    !!v && typeof v === "object" && !Array.isArray(v);
-  if (
-    !object(value) ||
-    !safeName(value.id) ||
-    value.id.startsWith("builtin.") ||
-    !safeName(value.version) ||
-    value.apiVersion !== 1 ||
-    !Array.isArray(value.supportedLocales) ||
-    !value.supportedLocales.length ||
-    value.supportedLocales.some((v: string) => !supportedLocales.includes(v)) ||
-    new Set(value.supportedLocales).size !== value.supportedLocales.length ||
-    !value.supportedLocales.includes(value.defaultLocale) ||
-    !object(value.pages) ||
-    !Object.keys(value.pages).length ||
-    Object.keys(value.pages).some((key) => !["home", "login"].includes(key)) ||
-    !object(value.messages) ||
-    !object(value.messages[value.defaultLocale]) ||
-    typeof value.nameKey !== "string" ||
-    typeof value.messages[value.defaultLocale][value.nameKey] !== "string" ||
-    !value.messages[value.defaultLocale][value.nameKey].trim()
-  )
-    throw Error(
-      "Invalid theme.json: check identity, API, pages and language declarations",
-    );
-  for (const page of Object.values(value.pages) as Array<{
-    entry: string;
-    styles?: string[];
-  }>) {
-    if (!object(page) || page.entry !== "entry.js")
-      throw Error(
-        "This template builds src/entry.ts as entry.js; use that entry for each page",
-      );
-    if (
-      page.styles !== undefined &&
-      (!Array.isArray(page.styles) ||
-        page.styles.some((p) => !assetPath(p) || !p.endsWith(".css")))
-    )
-      throw Error("Invalid page styles");
-  }
-  if (
-    value.styles !== undefined &&
-    (!Array.isArray(value.styles) ||
-      value.styles.some((p: unknown) => !assetPath(p) || !p.endsWith(".css")))
-  )
-    throw Error("Invalid styles");
-  if (
-    value.preview !== undefined &&
-    (!assetPath(value.preview) || !/\.(png|jpe?g|webp)$/i.test(value.preview))
-  )
-    throw Error("Invalid preview image");
-  if (value.configSchema !== undefined && value.configSchema?.type !== "object")
-    throw Error("configSchema must be an object schema");
-  return value as Manifest;
-}

package/dist/template/scripts/serve.ts

@@ -1,127 +0,0 @@
-import { createServer, type Plugin } from "vite";
-import vue from "@vitejs/plugin-vue";
-import tailwindcss from "@tailwindcss/vite";
-import { resolve } from "node:path";
-import { readFile, mkdir, writeFile } from "node:fs/promises";
-import { initialValue } from "../dev/helpers.js";
-import { assetPath, readManifest } from "./manifest";
-const args = process.argv.slice(2),
-  production = args.includes("--preview");
-const portIndex = args.indexOf("--port");
-const port = portIndex === -1 ? 5173 : Number(args[portIndex + 1]);
-if (
-  !Number.isInteger(port) ||
-  port < 1 ||
-  port > 65535 ||
-  args.some(
-    (arg, i) =>
-      arg !== "--preview" &&
-      arg !== "--port" &&
-      !(portIndex >= 0 && i === portIndex + 1),
-  )
-)
-  throw Error(
-    "Usage: bun run dev [--port 5173] / bun run preview [--port 5173]",
-  );
-if (production && !(await Bun.file("dist/package/entry.js").exists()))
-  throw Error("No production build. Run bun run build first.");
-const manifestPath = production ? "dist/package/theme.json" : "theme.json";
-try {
-  if (!(await Bun.file("dev/config.json").exists())) {
-    const manifest = await readManifest(manifestPath);
-    await mkdir("dev", { recursive: true });
-    await writeFile(
-      "dev/config.json",
-      JSON.stringify(
-        initialValue(manifest.configSchema ?? { type: "object" }) ?? {},
-        null,
-        2,
-      ) + "\n",
-      { flag: "wx" },
-    );
-  }
-} catch (error) {
-  if ((error as NodeJS.ErrnoException).code !== "EEXIST")
-    console.error(String(error));
-}
-const virtual = "virtual:picloom-preview",
-  resolved = "\0" + virtual;
-const plugin: Plugin = {
-  name: "picloom-preview",
-  resolveId(id) {
-    if (id === virtual) return resolved;
-  },
-  async load(id) {
-    if (id !== resolved) return;
-    const manifest = await readManifest(manifestPath);
-    const config = JSON.parse(await readFile("dev/config.json", "utf8"));
-    if (!config || Array.isArray(config) || typeof config !== "object")
-      throw Error("dev/config.json must contain an object");
-    return `export const manifest=${JSON.stringify(manifest)};export const config=${JSON.stringify(config)};export const production=${production};`;
-  },
-  configureServer(server) {
-    server.watcher.add([manifestPath, "dev/config.json"]);
-    server.watcher.on("all", (_event, path) => {
-      if (
-        [manifestPath, "dev/config.json"].some(
-          (name) => resolve(path) === resolve(name),
-        )
-      ) {
-        const module = server.moduleGraph.getModuleById(resolved);
-        if (module) server.moduleGraph.invalidateModule(module);
-        server.ws.send({ type: "full-reload" });
-      }
-    });
-    server.middlewares.use(async (req, res, next) => {
-      try {
-        const path = decodeURIComponent(req.url?.split("?")[0] ?? "");
-        // Built resources are served verbatim, including encoded names and ?import.
-        if (production && assetPath(path.slice(1))) {
-          const file = Bun.file(resolve("dist/package", path.slice(1)));
-          if (await file.exists()) {
-            res.setHeader("Content-Type", file.type);
-            res.setHeader("Cache-Control", "no-cache");
-            res.end(new Uint8Array(await file.arrayBuffer()));
-            return;
-          }
-        }
-        if (path !== "/" && path !== "/login") return next();
-        const html = await server.transformIndexHtml(
-          req.url!,
-          await readFile("dev/index.html", "utf8"),
-        );
-        res.setHeader("Content-Type", "text/html; charset=utf-8");
-        res.end(html);
-      } catch (error) {
-        next(error);
-      }
-    });
-  },
-};
-const server = await createServer({
-  configFile: false,
-  appType: "mpa",
-  plugins: [plugin, vue(), tailwindcss()],
-  publicDir: production ? false : "public",
-  server: {
-    host: "127.0.0.1",
-    port,
-    strictPort: true,
-    // Bun's native filesystem watcher can miss repeated replace/write events.
-    watch: { usePolling: true, interval: 150 },
-  },
-});
-await server.listen();
-console.log(
-  `${production ? "Production build" : "Source HMR"} · SIMULATED uploads and login / 模拟上传与登录`,
-);
-server.printUrls();
-let closing = false;
-async function close() {
-  if (closing) return;
-  closing = true;
-  await server.close();
-  process.exit(0);
-}
-process.on("SIGINT", close);
-process.on("SIGTERM", close);