@done-coding/admin-core 0.12.0 → 0.12.1

package/es/hooks/use-admin-theme-apply.mjs

@@ -1,6 +1,6 @@
 import { watch as s } from "vue";
-import { themeScaleDerive as x } from "../utils/theme-scale.mjs";
-const p = "admin-core-theme", $ = [
+import { themeScaleDerive as C, themeScaleParseHex as S, themeScaleMix as $, themeScaleToRgba as _ } from "../utils/theme-scale.mjs";
+const u = "admin-core-theme", y = [
   ["primaryColor", { scale: !0, el: "--el-color-primary" }],
   ["successColor", { scale: !0, el: "--el-color-success" }],
   ["warningColor", { scale: !0, el: "--el-color-warning" }],
@@ -18,47 +18,85 @@ const p = "admin-core-theme", $ = [
   ["blur", {}],
   ["focusRing", {}],
   ["surface", {}]
-], u = [
+], p = [
   "light-3",
   "light-5",
   "light-7",
   "light-8",
   "light-9",
   "dark-2"
-], b = (r) => r.replace(/([A-Z])/g, "-$1").toLowerCase(), g = (r, t) => {
+], L = (r) => r.replace(/([A-Z])/g, "-$1").toLowerCase(), g = (r, t) => {
   const e = [];
-  for (const [l, i] of $) {
+  for (const [l, a] of y) {
     const o = r[l];
     if (o === void 0 || o === "") continue;
-    const n = `--admin-core-${b(l)}`, c = i.el === void 0 ? [] : Array.isArray(i.el) ? i.el : [i.el];
-    if (i.scale) {
-      const d = x(o, t);
+    const n = `--admin-core-${L(l)}`, i = a.el === void 0 ? [] : Array.isArray(a.el) ? a.el : [a.el];
+    if (a.scale) {
+      const d = C(o, t);
       e.push(`${n}: ${o};`);
-      for (const a of u)
-        e.push(`${n}-${a}: ${d[a]};`);
-      for (const a of c) {
-        e.push(`${a}: ${o};`);
-        for (const m of u)
-          e.push(`${a}-${m}: ${d[m]};`);
+      for (const c of p)
+        e.push(`${n}-${c}: ${d[c]};`);
+      for (const c of i) {
+        e.push(`${c}: ${o};`);
+        for (const m of p)
+          e.push(`${c}-${m}: ${d[m]};`);
       }
     } else {
       e.push(`${n}: ${o};`);
-      for (const d of c) e.push(`${d}: ${o};`);
+      for (const d of i) e.push(`${d}: ${o};`);
     }
   }
   return e.join(`
   `);
-}, E = (r) => {
-  const t = g(r.light, "light"), e = g(r.dark, "dark");
+}, A = 0.4, T = 10, v = {
+  light: 0.5,
+  dark: 0.72
+}, f = (r, t) => {
+  if (!r) return "";
+  const e = S(r);
+  if (!e) return "";
+  const l = Math.max(...e), a = l === 0 ? 0 : Math.min(A, T / l), o = $(r, "#000000", a);
+  return `--el-overlay-color-lighter: ${_(
+    o,
+    v[t]
+  )};`;
+}, I = { light: 0.9, dark: 0.8 }, h = (r, t) => {
+  if (!r) return "";
+  const e = _(r, I[t]);
+  return e === r ? "" : `--el-mask-color: ${e};`;
+}, P = 0.88, k = (r, t) => !r || !S(r) ? "" : `--admin-core-dialog-surface: ${$(r, "#ffffff", P)};`, D = (r) => {
+  const t = r.light, e = r.dark, l = g(t, "light"), a = g(e, "dark"), n = [
+    l,
+    "color: var(--admin-core-base-color);",
+    f(t.bodyColor, "light"),
+    h(t.bodyColor, "light")
+  ].filter(Boolean), i = [
+    a,
+    f(e.bodyColor, "dark"),
+    h(e.bodyColor, "dark"),
+    k(e.bodyColor)
+  ].filter(Boolean);
   return `:root {
-  ${t}
-  color: var(--admin-core-base-color);
+  ${n.join(
+    `
+  `
+  )}
 }
 :root.dark {
-  ${e}
+  ${i.join(`
+  `)}
 }
 `;
-}, f = "admin-core-rhythm", h = "admin-core-ep-bridge", y = [
+}, E = "admin-core-rhythm", b = "admin-core-ep-bridge", x = "admin-core-ep-structural", B = [
+  ".el-dialog,",
+  ".el-message-box {",
+  // elevation：暗色下用提亮过的面板底（--admin-core-dialog-surface，仅 :root.dark 派生），
+  // 让整块面板亮于页面底而浮起；缺省（亮色 / 非 hex）退 --el-bg-color，亮色零改动。
+  "  background-color: var(--admin-core-dialog-surface, var(--el-bg-color));",
+  "  border: 1px solid var(--admin-core-border-color, var(--el-border-color));",
+  "}"
+].join(`
+`), R = [
   // T1 必纳：表格行密度（垂直经 td padding，水平经 .cell padding）
   ".el-table .el-table__cell {",
   "  padding-top: var(--admin-core-cell-padding-y, 8px);",
@@ -75,7 +113,7 @@ const p = "admin-core-theme", $ = [
   // 注：dialog/card 内距撤到期二——其 EP 原生值（dialog 16 / card 20）与单一
   // content-gap 无法同时对齐，本期纳入会破"默认档零漂移"；期二用专属 var 补。
 ].join(`
-`), S = {
+`), w = {
   compact: {
     spaceUnit: "4px",
     gap: "8px",
@@ -108,7 +146,7 @@ const p = "admin-core-theme", $ = [
     fontSizeBase: "15px",
     fontScale: "1.25"
   }
-}, C = {
+}, H = {
   snappy: {
     duration: "120ms",
     durationSlow: "180ms",
@@ -127,8 +165,8 @@ const p = "admin-core-theme", $ = [
     easing: "cubic-bezier(0.22, 0.61, 0.36, 1)"
   }
 };
-function _(r, t) {
-  const e = S[r], l = C[t], i = [
+function Y(r, t) {
+  const e = w[r], l = H[t], a = [
     `--admin-core-space-unit: ${e.spaceUnit};`,
     `--admin-core-content-gap: ${e.gap};`,
     `--admin-core-control-height: ${e.controlHeight};`,
@@ -153,7 +191,7 @@ function _(r, t) {
     "--el-transition-duration-fast: 0.01ms;"
   ];
   return `:root {
-  ${i.join(`
+  ${a.join(`
   `)}
 }
 @media (prefers-reduced-motion: reduce) {
@@ -166,17 +204,21 @@ function _(r, t) {
 }
 `;
 }
-function T(r) {
+function U(r) {
   const t = r.document ?? (typeof document < "u" ? document : void 0);
   if (!t) return;
   const e = () => {
-    let o = t.getElementById(p);
-    return o || (o = t.createElement("style"), o.id = p, t.head.appendChild(o)), o;
+    let o = t.getElementById(u);
+    return o || (o = t.createElement("style"), o.id = u, t.head.appendChild(o)), o;
   };
+  if (!t.getElementById(x)) {
+    const o = t.createElement("style");
+    o.id = x, o.textContent = B, t.head.appendChild(o);
+  }
   s(
     r.getThemeConfig,
     (o) => {
-      e().textContent = E(o);
+      e().textContent = D(o);
     },
     { deep: !0, immediate: !0 }
   ), s(
@@ -186,28 +228,28 @@ function T(r) {
     },
     { immediate: !0 }
   );
-  const { getThemeDensity: l, getThemeMotion: i } = r;
-  if (l && i) {
-    if (!t.getElementById(h)) {
+  const { getThemeDensity: l, getThemeMotion: a } = r;
+  if (l && a) {
+    if (!t.getElementById(b)) {
       const n = t.createElement("style");
-      n.id = h, n.textContent = y, t.head.appendChild(n);
+      n.id = b, n.textContent = R, t.head.appendChild(n);
     }
     const o = () => {
       let n = t.getElementById(
-        f
+        E
       );
-      return n || (n = t.createElement("style"), n.id = f, t.head.appendChild(n)), n;
+      return n || (n = t.createElement("style"), n.id = E, t.head.appendChild(n)), n;
     };
     s(
-      () => [l(), i()],
-      ([n, c]) => {
-        o().textContent = _(n, c);
+      () => [l(), a()],
+      ([n, i]) => {
+        o().textContent = Y(n, i);
       },
       { immediate: !0 }
     );
   }
 }
 export {
-  _ as buildRhythmCss,
-  T as useAdminThemeApply
+  Y as buildRhythmCss,
+  U as useAdminThemeApply
 };

package/es/index.mjs

@@ -68,18 +68,18 @@ import { nestFormItem as ut } from "./components/form/nest-form-item.mjs";
 import { nestFormItemList as xt } from "./components/form/nest-form-item-list.mjs";
 import { nestPanelForm as it } from "./components/panel/nest-panel-form.mjs";
 import { nestPanelItem as _t } from "./components/panel/nest-panel-item.mjs";
-import { themeScaleDerive as Et, themeScaleMix as ct, themeScaleToRgba as St } from "./utils/theme-scale.mjs";
-import { timeCountDown as It } from "./utils/time.mjs";
-import { useActivated as Rt, useActivatedEvent as Ft, useActivatedExec as Lt } from "./hooks/activated.mjs";
-import { useAdminViewportApply as Ot } from "./hooks/use-admin-viewport-apply.mjs";
-import { useBreakpoint as ht } from "./hooks/use-breakpoint.mjs";
-import { useChannelViewportHeight as Nt } from "./hooks/use-channel-viewport-height.mjs";
-import { useFeelSize as yt } from "./hooks/feel-size.mjs";
-import { useMenusDataDispatch as Vt } from "./hooks/menus-dispatch.mjs";
-import { useNestForm as bt } from "./components/form/use-nest-form.mjs";
-import { useNestFormList as Ut } from "./components/form/use-nest-form-list.mjs";
-import { useNestLayoutScale as vt } from "./components/form/use-nest-layout-scale.mjs";
-import { useTimeout as Ht } from "./hooks/timeout.mjs";
+import { themeScaleDerive as Et, themeScaleMix as ct, themeScaleParseHex as St, themeScaleToRgba as Tt } from "./utils/theme-scale.mjs";
+import { timeCountDown as Pt } from "./utils/time.mjs";
+import { useActivated as Ft, useActivatedEvent as Lt, useActivatedExec as Mt } from "./hooks/activated.mjs";
+import { useAdminViewportApply as gt } from "./hooks/use-admin-viewport-apply.mjs";
+import { useBreakpoint as Ct } from "./hooks/use-breakpoint.mjs";
+import { useChannelViewportHeight as Dt } from "./hooks/use-channel-viewport-height.mjs";
+import { useFeelSize as Bt } from "./hooks/feel-size.mjs";
+import { useMenusDataDispatch as Yt } from "./hooks/menus-dispatch.mjs";
+import { useNestForm as Gt } from "./components/form/use-nest-form.mjs";
+import { useNestFormList as Kt } from "./components/form/use-nest-form-list.mjs";
+import { useNestLayoutScale as wt } from "./components/form/use-nest-layout-scale.mjs";
+import { useTimeout as Wt } from "./hooks/timeout.mjs";
 export {
   W as ADMIN_BRIDGE_KEY,
   ee as ADMIN_CORE_VIEWPORT_DECOR_ZINDEX_ABOVE,
@@ -188,19 +188,20 @@ export {
   ro as swiftFormItemConfig,
   Et as themeScaleDerive,
   ct as themeScaleMix,
-  St as themeScaleToRgba,
-  It as timeCountDown,
-  Rt as useActivated,
-  Ft as useActivatedEvent,
-  Lt as useActivatedExec,
+  St as themeScaleParseHex,
+  Tt as themeScaleToRgba,
+  Pt as timeCountDown,
+  Ft as useActivated,
+  Lt as useActivatedEvent,
+  Mt as useActivatedExec,
   Do as useAdminThemeApply,
-  Ot as useAdminViewportApply,
-  ht as useBreakpoint,
-  Nt as useChannelViewportHeight,
-  yt as useFeelSize,
-  Vt as useMenusDataDispatch,
-  bt as useNestForm,
-  Ut as useNestFormList,
-  vt as useNestLayoutScale,
-  Ht as useTimeout
+  gt as useAdminViewportApply,
+  Ct as useBreakpoint,
+  Dt as useChannelViewportHeight,
+  Bt as useFeelSize,
+  Yt as useMenusDataDispatch,
+  Gt as useNestForm,
+  Kt as useNestFormList,
+  wt as useNestLayoutScale,
+  Wt as useTimeout
 };

package/es/utils/theme-scale.mjs

@@ -39,5 +39,6 @@ const c = (s) => {
 export {
   h as themeScaleDerive,
   o as themeScaleMix,
+  c as themeScaleParseHex,
   l as themeScaleToRgba
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@done-coding/admin-core",
-  "version": "0.12.0",
+  "version": "0.12.1",
   "description": "后台管理核心",
   "private": false,
   "main": "lib/index.cjs",
@@ -81,5 +81,5 @@
     "node": ">=18.0.0",
     "pnpm": ">=9.0.0"
   },
-  "gitHead": "de49e7d3580a081b7f865fc1a79b76b77221ab99"
+  "gitHead": "d6b53243bbb38460aab7b806e57885a4fcd70172"
 }

package/types/utils/theme-scale.d.ts

@@ -18,6 +18,8 @@ export interface ThemeColorScale {
     "light-9": string;
     "dark-2": string;
 }
+/** `#rgb` / `#rrggbb` → [r,g,b]；非法格式返回 null */
+export declare const themeScaleParseHex: (hex: string) => [number, number, number] | null;
 /**
  * 混色：`c1` 占 `w1`、`c2` 占 `1-w1`，各通道线性混合后四舍五入
  * （复刻 EP/SCSS `mix(c1, c2, w1)` 语义，w1 为 c1 的权重 [0,1]）。