dsh-folia 4.10.0 → 4.12.2

package/cordis.patch.yml

@@ -1,16 +1,23 @@
-# dsh-plugin-folia bundle patch — single-row form.
+# dsh-plugin-folia bundle patch.
 #
-# This bundle used to contribute EIGHT host rows (the plugin itself plus seven
-# subpackage rows: about-notice / mascot-avatar / media-bridge / fonts / fx /
-# parallax / pet-link). Those seven now live in this package under
-# `lib/components/` and are mounted from `apply()` in `lib/index.js`, so the row
-# set is exactly one row: this bundle.
+# Row set: this bundle + the skin centre it brings along.
 #
-# Why the merge (see lib/index.js "BUNDLE-MERGE"): each subpackage browser half
-# used to reach the host half through `require('<main package name>')`, which is
-# the most fragile edge in the plugin — it broke every time the main package was
-# renamed, and an id mismatch silently blanked the font / effect panels. One
-# package means no cross-package module id at all.
+# ── 为什么这里有第二条 row ──────────────────────────────────────────────────
+# 我们不再自己实现皮肤渲染：皮肤包（`skin.json` + `skin.css` + 可选 `hooks.mjs`）由
+# `@linxin666/dsh-client-ui-skin-center` 加载与启用，我们的「助手皮肤」页签只负责把站点 zip
+# 解到它读的那个目录（`$DSH_HOME/skins`）。所以它必须是**装得上的**：本包把它列为
+# `dependencies`，并在下面插一条 row —— 用户装 dsh-folia 就同时得到两件套，不用再单独装。
+#
+# ── 重复 row 为什么不会打起来（实测依据，不是猜测）────────────────────────
+# 1) 宿主半边：它的 `apply` 走 `mountOnce('@linxin666/dsh-client-ui-skin-center', …)`，
+#    以 `globalThis[Symbol.for('dsh-web.mounted-plugins')]` 记账 ⇒ 第二次挂载是空操作，
+#    不会重复注册 webserver 路由。
+# 2) 客户端半边：它的设置分区注册包在 `try { ctx.slots.register(...) } catch { return () => {} }`，
+#    重复注册被吞掉 ⇒ 不会出现两张「皮肤」设置页。
+# 于是「用户已有 dsh-web-all（它也插了一条 row）」与「只用我们」两种情形都成立。
+#
+# 版本：依赖写 `^0.4.8`（本仓实测过的版本线）；它若大改 v1alpha1 契约，我们跟着升级即可。
+# 判据：test/verify-skin-center-bundle.mjs 会同时钉住「声明了依赖」与「插了唯一 id 的 row」。
 #
 # A patch replaces the targeted row's whole `config`, so only additive `insert`
 # rows appear here (we never override an existing shipped row).
@@ -18,3 +25,13 @@
 - insert:
     - id: folia
       name: 'dsh-folia'
+    # 皮肤中心：独立 npm 包（BSD-3-Clause），本包作为依赖携带。
+    #
+    # ⚠️ row id **不能**以 `folia-` 开头：`lib/subpackage-boot.js#subpackageSpecifiers` 把
+    #    「id 以 `folia-` 开头的行」当作**我们自己的子包行**做启动自检（解析不到就抛，因为宿主
+    #    对行级失败是静默的）。给第三方行起 `folia-skin-center` 这种 id 会被误判成"我们的子包"
+    #    ⇒ 自检去仓库 node_modules 里解析它，开发树里没有这个依赖就直接抛，整个 apply 失败。
+    #    所以这里用不撞前缀的 `skin-center`（也与 web-all 的 `web-ui-skin-center`、
+    #    官方包的 `ui-skin-center` 都不同名）。
+    - id: skin-center
+      name: '@linxin666/dsh-client-ui-skin-center'

package/lib/client.js

@@ -801,6 +801,31 @@ window.__ModuleLoader__.load({
 				  "下载地址不在白名单里": "The download host is not allow-listed",
 				  "站点被关闭了（DSH_FOLIA_SITE=off）": "The site is disabled (DSH_FOLIA_SITE=off)",
 				  "这个文件不是 zip": "This file is not a zip",
+
+				  // ── 助手皮肤：皮肤中心缺失时的引导（4.10.1）──────────────────────────
+				  "皮肤中心没装：它是**独立插件** @linxin666/dsh-client-ui-skin-center（不在 dsh-web-all 里，那个只是聚合包）。装它才能启用皮肤：": "The skin centre is not installed: it is its own plugin, @linxin666/dsh-client-ui-skin-center (dsh-web-all is only an aggregate). Install it to enable skins:",
+				  "已复制安装命令": "Install command copied",
+				  "复制失败，请手动选中上面的命令": "Copy failed — select the command above manually",
+				  "复制命令": "Copy command",
+				  "先装皮肤中心，否则皮肤装好也没法启用": "Install the skin centre first, or the skin cannot be enabled",
+
+				  // ── 助手皮肤：页签内直接切换（4.12.0）────────────────────────────────
+				  " · 使用中：{name}": " · active: {name}",
+				  "✓ ": "✓ ",
+				  "正在恢复…": "Restoring…",
+				  "恢复默认外观": "Restore default look",
+				  "应用": "Apply",
+				  "切换中…": "Switching…",
+				  "使用中": "Active",
+				  "正在使用，先切到别的再卸": "Currently active — switch to another skin before removing",
+				  "已切换到：{name}": "Switched to: {name}",
+				  "已恢复官方默认外观": "Restored the default look",
+				  "这个皮肤不在本机（先安装）": "This skin is not installed locally — install it first",
+				  "装皮肤中心后才能切换皮肤（见下面的安装命令）": "The skin centre is required to switch skins (install command below)",
+				  "皮肤 id 不合法": "Invalid skin id",
+				  "已安装：{name} —— 点「应用」就能切换": "Installed: {name} — press Apply to switch",
+				  "本页签可以直接切换皮肤：装完点「应用」即可，无需打开设置页。皮肤包落在皮肤中心目录，两边读同一份。":
+				    "This tab switches skins directly: install, then press Apply — no need to open the settings page. Packs land in the skin centre's folder and both sides read the same files.",
 				};
 
 				// ── 内联模块：src/i18n-copy-picker.js —— 英文词表域：壁纸选择器与快捷面板（picker-* · quick-panel · sidebar-right · theme-follow）（构建期注入；勿手改本段）──
@@ -18272,6 +18297,16 @@ window.__ModuleLoader__.load({
 				  return (v / 1048576).toFixed(1) + " MB";
 				}
 
+				/**
+				 * 皮肤 id 的归一键：站点上的 slug 是**全站唯一**的，撞名时上传工具会加 `skin-` 前缀
+				 * （实测：blue-throated-bee-eater 同时是桌宠 id ⇒ 站上叫 skin-blue-throated-bee-eater），
+				 * 而本机目录名用的是 skin.json 里的原始 id。两边比对必须先归一，否则"已安装"会显示成未安装。
+				 */
+				function normSkinId(raw) {
+				  const s = String(raw || "").trim().toLowerCase();
+				  return s.startsWith("skin-") ? s.slice(5) : s;
+				}
+
 				function SkinsTabPanel() {
 				  const [state, setState] = React.useState(null);
 				  const [busy, setBusy] = React.useState("");
@@ -18282,6 +18317,17 @@ window.__ModuleLoader__.load({
 				      const resp = await apiJson("/skins/list" + (force ? "?refresh=1" : ""), { parse: "always" });
 				      const doc = (resp && resp.data) || null;
 				      if (resp && resp.ok && doc && doc.ok) {
+				        // 读"当前在用哪套皮肤"必须**由浏览器发**，不能走宿主代理：
+				        // `/api/skin-center/v2/*` 的读写被 DSH 自己的会话鉴权挡着，宿主 fetch 没有 cookie
+				        // ⇒ 代理拿到 401（实测报错「操作失败：skin-center-401」）。
+				        // 但**不许裸 fetch**（src/api-client.js 的不变量：业务代码零裸 fetch）——
+				        // apiUrl() 对带 scheme 的地址原样放行，而 location.origin 是同源 ⇒ 照旧带会话。
+				        if (doc.skinCenter === "present") {
+				          try {
+				            const a = await apiJson(location.origin + "/api/skin-center/v2/active", { parse: "always" });
+				            if (a && a.ok) doc.active = (a.data && a.data.active) || "";
+				          } catch { /* 读不到就显示"无使用中" */ }
+				        }
 				        setState(doc);
 				        if (doc.siteError && doc.siteError !== "site-off") {
 				          setNote({ ok: false, text: weT("站点清单读不到：{msg}", { msg: String(doc.siteError) }) });
@@ -18297,10 +18343,45 @@ window.__ModuleLoader__.load({
 				  React.useEffect(() => { load(false); }, [load]);
 
 				  const act = async (kind, payload, label) => {
+				    // 结构性操作才锁整块 UI；`activate` 是幂等的、而且要让人能连点换皮肤，所以不锁。
 				    const structural = kind === "install" || kind === "remove";
 				    if (structural) setBusy(kind + ":" + ((payload && payload.id) || ""));
+				    if (kind === "activate") setBusy("activate:" + ((payload && payload.id) || ""));
 				    setNote(null);
 				    try {
+				      // 切换皮肤**由浏览器直接写**皮肤中心自己的端点（同源请求自带会话）；
+				      // 走宿主代理会 401 —— DSH 对 `/api/skin-center/v2/*` 的读写都做会话鉴权，宿主 fetch 没有 cookie。
+				      if (kind === "activate") {
+				        const wantId = (payload && payload.id) || null;
+				        // 只允许切到本机已装的那几套（state.installed 是权威清单）
+				        if (wantId) {
+				          const known = ((state && state.installed) || []).some((s) => normSkinId(s.id) === normSkinId(wantId));
+				          if (!known) {
+				            setNote({ ok: false, text: weT("这个皮肤不在本机（先安装）") });
+				            return;
+				          }
+				        }
+				        // 切换皮肤**由浏览器直接写**皮肤中心自己的端点（同源、自带会话）；
+				        // 走宿主代理会 401 —— DSH 对 `/api/skin-center/v2/*` 的读写都做会话鉴权，宿主 fetch 没有 cookie。
+				        // 统一走 api-client（不裸 fetch）：绝对 URL 原样放行，`location.origin` 是同源 ⇒ 会话照旧带上。
+				        const resp = await apiPostJson(location.origin + "/api/skin-center/v2/active", { active: wantId }, { parse: "always" });
+				        if (!(resp && resp.ok)) {
+				          setNote({ ok: false, text: weT("操作失败：{code}", { code: "skin-center-" + ((resp && resp.status) || 0) }) });
+				          return;
+				        }
+				        // 两条收敛路径：① 广播皮肤中心自己监听的 `dsh-skin-applied`（立即就地切换）；
+				        // ② 它另外每 2 秒轮询 /api/skin-center/v2/active（事件丢了也会在 2 秒内跟上）。
+				        try {
+				          window.dispatchEvent(new CustomEvent("dsh-skin-applied", { detail: { id: wantId } }));
+				        } catch { /* 老环境没有 CustomEvent 也无所谓，②会兜住 */ }
+				        setNote({
+				          ok: true,
+				          text: wantId ? weT("已切换到：{name}", { name: label || "" }) : weT("已恢复官方默认外观"),
+				        });
+				        await load(true);
+				        return;
+				      }
+
 				      const resp = await apiPostJson("/skins/" + kind, payload || {}, { parse: "always" });
 				      const r = (resp && resp.data) || null;
 				      if (resp && resp.ok && r && r.ok) {
@@ -18309,7 +18390,7 @@ window.__ModuleLoader__.load({
 				            ok: true,
 				            text: r.exists
 				              ? weT("已安装过：{name}", { name: label || "" })
-				              : weT("已安装：{name} —— 到「设置 → 皮肤中心」点它即可启用", { name: label || "" }),
+				              : weT("已安装：{name} —— 点「应用」就能切换", { name: label || "" }),
 				          });
 				        }
 				        if (kind === "remove") setNote({ ok: true, text: weT("已卸载：{name}", { name: label || "" }) });
@@ -18323,6 +18404,9 @@ window.__ModuleLoader__.load({
 				          'host-not-allowed': weT("下载地址不在白名单里"),
 				          'site-off': weT("站点被关闭了（DSH_FOLIA_SITE=off）"),
 				          'not-a-zip': weT("这个文件不是 zip"),
+				          'not-installed': weT("这个皮肤不在本机（先安装）"),
+				          'skin-center-missing': weT("装皮肤中心后才能切换皮肤（见下面的安装命令）"),
+				          'bad-id': weT("皮肤 id 不合法"),
 				        };
 				        setNote({ ok: false, text: map[code] || weT("操作失败：{code}", { code }) });
 				      }
@@ -18343,11 +18427,33 @@ window.__ModuleLoader__.load({
 				    }, weT("刷新")),
 				  ));
 
-				  children.push(React.createElement("div", {
-				    key: "hint",
-				    className: "we-picker__hint",
-				    style: { margin: "6px 0 4px", opacity: 0.8 },
-				  }, weT("皮肤包安装到皮肤中心目录；装完到「设置 → 皮肤中心」里点选即可启用。皮肤中心与本插件读同一个目录，无需重启。")));
+				  // 皮肤中心在不在，决定这段提示说什么：
+				  //   在   → "装完去皮肤中心点它"（本页签只负责落盘）
+				  //   不在 → 明说它是个**独立插件**（不在 dsh-web-all 里），给一条可复制的安装命令
+				  //   unknown（探测失败）→ 保守地按"在"讲，不吓唬用户
+				  const skinCenter = (state && state.skinCenter) || "unknown";
+				  if (skinCenter === "absent") {
+				    children.push(React.createElement("div", {
+				      key: "hint-absent",
+				      className: "we-picker__hint",
+				      style: { margin: "6px 0 4px", color: "#ffd08a", lineHeight: "1.6" },
+				    }, weT("皮肤中心没装：它是**独立插件** @linxin666/dsh-client-ui-skin-center（不在 dsh-web-all 里，那个只是聚合包）。装它才能启用皮肤：")));
+				    children.push(React.createElement("div", { key: "cmd", style: { display: "flex", gap: "8px", alignItems: "center", margin: "0 0 6px" } },
+				      React.createElement("code", {
+				        style: { fontSize: "11px", padding: "3px 8px", borderRadius: "6px", background: "rgba(255,255,255,0.08)" },
+				      }, "dsh plugin --profile web add @linxin666/dsh-client-ui-skin-center"),
+				      React.createElement("button", {
+				        className: "we-picker__btn", type: "button",
+				        onClick: () => { try { navigator.clipboard.writeText("dsh plugin --profile web add @linxin666/dsh-client-ui-skin-center"); setNote({ ok: true, text: weT("已复制安装命令") }); } catch { setNote({ ok: false, text: weT("复制失败，请手动选中上面的命令") }); } },
+				      }, weT("复制命令")),
+				    ));
+				  } else {
+				    children.push(React.createElement("div", {
+				      key: "hint",
+				      className: "we-picker__hint",
+				      style: { margin: "6px 0 4px", opacity: 0.8 },
+				    }, weT("本页签可以直接切换皮肤：装完点「应用」即可，无需打开设置页。皮肤包落在皮肤中心目录，两边读同一份。")));
+				  }
 
 				  // 提示行常驻占位（与开机动画/桌宠页签同一条纪律：不因 note 出现/消失让面板跳高度）
 				  children.push(React.createElement("div", {
@@ -18361,25 +18467,56 @@ window.__ModuleLoader__.load({
 				  }, note ? note.text : "\u00a0"));
 
 				  const installed = (state && state.installed) || [];
+				  const activeId = (state && state.active) || "";
+				  /** 这个 id 是不是"正在用"的那套（两边都归一后比，站点 slug 可能带 skin- 前缀）。 */
+				  const isActiveSkin = (id) => Boolean(activeId) && normSkinId(activeId) === normSkinId(id);
 				  if (state) {
 				    children.push(React.createElement("div", { key: "installed-head", className: "we-picker__hint" },
-				      weT("本机已装（{n}）", { n: installed.length })));
+				      weT("本机已装（{n}）", { n: installed.length }),
+				      activeId ? weT(" · 使用中：{name}", { name: activeId }) : ""));
+				    // 「恢复默认」：清空选择、回到官方外观。只有确实有皮肤在用的时候才有意义。
+				    if (activeId) {
+				      children.push(React.createElement("button", {
+				        key: "clear",
+				        className: "we-picker__btn", type: "button",
+				        style: { alignSelf: "flex-start", margin: "0 0 6px" },
+				        disabled: Boolean(busy),
+				        onClick: () => act("activate", { id: "" }, ""),
+				      }, busy === "activate:" ? weT("正在恢复…") : weT("恢复默认外观")));
+				    }
 				    children.push(React.createElement("div", { key: "installed", style: SKIN_STYLE.grid },
 				      installed.length === 0
 				        ? [React.createElement("span", { key: "none", className: "we-picker__hint" }, weT("还没有安装任何皮肤 —— 从下面的站点清单里挑一个。"))]
-				        : installed.map((s) => React.createElement("div", { key: s.id, style: SKIN_STYLE.card },
-				          React.createElement("div", { style: { ...SKIN_STYLE.title, color: s.accent || undefined } }, s.name || s.id),
+				        : installed.map((s) => {
+				          const isActive = isActiveSkin(s.id);
+				          const busyThis = busy === "activate:" + s.id;
+				          return React.createElement("div", {
+				            key: s.id,
+				            style: isActive ? { ...SKIN_STYLE.card, borderColor: "rgba(120,220,150,0.75)" } : SKIN_STYLE.card,
+				          },
+				          React.createElement("div", { style: { ...SKIN_STYLE.title, color: s.accent || undefined } },
+				            (isActive ? weT("✓ ") : "") + (s.name || s.id)),
 				          React.createElement("div", { style: SKIN_STYLE.meta },
 				            [s.version ? "v" + s.version : "", skinFmtBytes(s.bytes), s.hasHooks ? weT("含动效钩子") : ""]
 				              .filter(Boolean).join(" · ")),
 				          React.createElement("div", { style: { display: "flex", gap: "6px", alignItems: "center" } },
+				            // 「应用」= 写皮肤中心的 active + 广播 `dsh-skin-applied`，就地切换（不刷新页面）。
+				            isActive
+				              ? React.createElement("span", { style: { ...SKIN_STYLE.badge, background: "rgba(60,160,90,0.55)" } }, weT("使用中"))
+				              : React.createElement("button", {
+				                className: "we-picker__btn", type: "button",
+				                disabled: Boolean(busy),
+				                onClick: () => act("activate", { id: s.id }, s.name),
+				              }, busyThis ? weT("切换中…") : weT("应用")),
 				            React.createElement("button", {
 				              className: "we-picker__btn", type: "button",
-				              disabled: Boolean(busy),
+				              disabled: Boolean(busy) || isActive,
+				              title: isActive ? weT("正在使用，先切到别的再卸") : undefined,
 				              onClick: () => act("remove", { id: s.id }, s.name),
 				            }, busy === "remove:" + s.id ? weT("卸载中…") : weT("卸载")),
 				          ),
-				        )),
+				        );
+				        }),
 				    ));
 				  }
 
@@ -18400,13 +18537,29 @@ window.__ModuleLoader__.load({
 				          React.createElement("div", { style: SKIN_STYLE.title, title: s.title }, s.title),
 				          React.createElement("div", { style: SKIN_STYLE.meta },
 				            [skinFmtBytes(s.bytes), (s.tags || []).includes("动态") ? weT("动态") : ""].filter(Boolean).join(" · ")),
-				          s.installed
-				            ? React.createElement("div", { style: SKIN_STYLE.badge }, weT("已安装"))
-				            : React.createElement("button", {
-				              className: "we-picker__btn", type: "button",
-				              disabled: Boolean(busy),
-				              onClick: () => act("install", { id: s.id, url: s.url }, s.title),
-				            }, busyThis ? weT("安装中…") : weT("安装")),
+				          React.createElement("div", { style: { display: "flex", gap: "6px", alignItems: "center", flexWrap: "wrap" } },
+				            s.installed
+				              // 已装的站点卡片也要能**直接应用**：用户是照着站点缩略图挑的，
+				              // 让他再滚回上面的「本机已装」区去点一次是多余的一步（实测反馈）。
+				              // 站点 slug 与本机目录名可能差一个 `skin-` 前缀 ⇒ 用归一后的比较。
+				              ? [
+				                isActiveSkin(s.id)
+				                  ? React.createElement("span", { key: "on", style: { ...SKIN_STYLE.badge, background: "rgba(60,160,90,0.55)" } }, weT("使用中"))
+				                  : React.createElement("button", {
+				                    key: "apply",
+				                    className: "we-picker__btn", type: "button",
+				                    disabled: Boolean(busy),
+				                    onClick: () => act("activate", { id: normSkinId(s.id) }, s.title),
+				                  }, busy === "activate:" + normSkinId(s.id) ? weT("切换中…") : weT("应用")),
+				                React.createElement("span", { key: "done", style: SKIN_STYLE.badge }, weT("已安装")),
+				              ]
+				              : React.createElement("button", {
+				                className: "we-picker__btn", type: "button",
+				                disabled: Boolean(busy),
+				                title: skinCenter === "absent" ? weT("先装皮肤中心，否则皮肤装好也没法启用") : undefined,
+				                onClick: () => act("install", { id: s.id, url: s.url }, s.title),
+				              }, busyThis ? weT("安装中…") : weT("安装")),
+				          ),
 				        );
 				      }),
 				  ));

package/lib/routes/skins.js

@@ -49,6 +49,30 @@ function siteBase() {
   return base.replace(/\/+$/, '');
 }
 
+/**
+ * 皮肤中心是否在线。
+ *
+ * 为什么由宿主探而不是前端探：两个插件跑在同一个 webServer 上，用请求自带的 Host 就能问到自己 —— 
+ * 前端也能问，但宿主这一侧拿到的结果与"装没装"一一对应，而且不受浏览器缓存/跨源策略影响。
+ * 判据用**它自己的 catalog 路由**：该路由不需要鉴权（实测 200），404 就是没装。
+ */
+const skinCenterProbe = { at: 0, state: 'unknown' };
+async function probeSkinCenter(hostHeader, force) {
+  const now = Date.now();
+  if (!force && skinCenterProbe.at && now - skinCenterProbe.at < 30000) return skinCenterProbe.state;
+  let state = 'unknown';
+  if (hostHeader) {
+    try {
+      const r = await fetch('http://' + hostHeader + '/api/skin-center/v2/catalog', { signal: AbortSignal.timeout(4000) });
+      state = r.status === 404 ? 'absent' : (r.ok ? 'present' : 'present');
+      // 401/403 也说明插件在（只是该路由被别的版本加了鉴权）；只有 404 才代表没装。
+    } catch { state = 'unknown'; }
+  }
+  skinCenterProbe.at = now;
+  skinCenterProbe.state = state;
+  return state;
+}
+
 /** 站点列表缓存（30 秒）：面板打开与"刷新"共用，避免每次都打站点。 */
 const siteCache = { at: 0, items: [], error: null };
 const SITE_TTL_MS = 30000;
@@ -238,6 +262,7 @@ export function registerSkinsRoutes(webServer, c) {
       const force = /[?&]refresh=1/.test(req.url || '');
       const site = await fetchSiteSkins(force);
       const installed = listInstalled();
+      const skinCenter = await probeSkinCenter(req.headers && req.headers.host, force);
       // ⚠️ 站点 slug 与本机皮肤 id **不总是同一个字符串**：站点上 slug 是全站唯一的，
       // 撞名时上传工具会加 `skin-` 前缀（实测 blue-throated-bee-eater 同时是桌宠 id）。
       // 所以比对要归一：两边都去掉可选的 `skin-` 前缀再比，否则会显示成"未安装"。
@@ -248,6 +273,7 @@ export function registerSkinsRoutes(webServer, c) {
       }
       sendJson(res, 200, {
         ok: true,
+        skinCenter,
         siteBase: siteBase(),
         siteError: site.error,
         installed,
@@ -365,4 +391,7 @@ export function registerSkinsRoutes(webServer, c) {
       sendJson(res, 200, { ok: true, id });
     },
   }));
+
+  // 切换皮肤与"当前皮肤"都由**浏览器**直接读写皮肤中心的 /api/skin-center/v2/active：
+  // DSH 对该路径的读写做会话鉴权（cookie），宿主 fetch 没有会话 ⇒ 代理只会得到 401（实测）。
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-folia",
-  "version": "4.10.0",
+  "version": "4.12.2",
   "description": "Folia 壁纸引擎：把本机 Wallpaper Engine 壁纸搬进 DSH 界面（场景实时渲染 / 视频 / 网页），内置液态玻璃与 Folia 吉祥物，并可从自建站点拉取壁纸。单包形态（组件已合并）。",
   "type": "module",
   "engines": {
@@ -193,6 +193,7 @@
     }
   },
   "dependencies": {
+    "@linxin666/dsh-client-ui-skin-center": "^0.4.8",
     "webwallgl": "^3.0.0",
     "x11": "^4.3.1"
   },