@done-coding/admin-core 0.30.1-alpha.0 → 0.31.1-alpha.0

package/es/components/modal/ModalConfirm.vue2.mjs

@@ -1,9 +1,10 @@
-import { defineComponent, computed, shallowRef, ref, inject, provide, openBlock, createBlock, resolveDynamicComponent, mergeProps, createSlots, withCtx, createElementVNode, unref, normalizeClass, renderSlot, createElementBlock, Fragment, createTextVNode, toDisplayString, createCommentVNode, createVNode } from "vue";
+import { defineComponent, computed, shallowRef, ref, inject, provide, openBlock, createBlock, resolveDynamicComponent, mergeProps, createSlots, withCtx, createElementVNode, normalizeClass, renderSlot, createElementBlock, Fragment, createTextVNode, toDisplayString, unref, createCommentVNode, createVNode } from "vue";
 import { ElDrawer, ElDialog, ElButton } from "element-plus";
-import { BODY_CONTENT_VIEWPORT_HEIGHT, SCOPE_VIEWPORT_MAX_HEIGHT } from "../../inject/key.mjs";
+import { SlotRegion } from "../../config/slot-region.mjs";
+import { APP_LAYOUT_BRIDGE_KEY, BODY_CONTENT_VIEWPORT_HEIGHT, SCOPE_VIEWPORT_MAX_HEIGHT } from "../../inject/key.mjs";
+import { gapScaleValue } from "../../utils/gap-scale.mjs";
 import { useActivated } from "../../hooks/activated.mjs";
 import { useObserveSize } from "../../hooks/use-observe-size.mjs";
-import { SlotRegion } from "../../config/slot-region.mjs";
 const _hoisted_1 = { class: "confirm-modal__title" };
 const _hoisted_2 = ["data-dc-slot"];
 const _hoisted_3 = ["reverse"];
@@ -46,6 +47,27 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const showFooterDivider = computed(() => props.footerDivider ?? isDrawer.value);
     const contentRef = shallowRef();
     const drawerBodyHeight = ref(0);
+    const bodySlotRegion = computed(
+      () => isDrawer.value ? SlotRegion.ModalConfirm_DrawerBody : SlotRegion.ModalConfirm_Body
+    );
+    const layoutBridge = inject(APP_LAYOUT_BRIDGE_KEY, void 0);
+    const layerPadVars = computed(() => {
+      const base = (layoutBridge == null ? void 0 : layoutBridge.APP_LAYOUT_GAP_CONFIG.size) ?? 8;
+      const density = layoutBridge == null ? void 0 : layoutBridge.themeDensity.value;
+      return {
+        "--dc-confirm-modal-pad-x": `${gapScaleValue(base, "outer", density)}px`,
+        "--dc-confirm-modal-pad-body-y": `${gapScaleValue(
+          base,
+          "outer",
+          density
+        )}px`,
+        "--dc-confirm-modal-pad-chrome-y": `${gapScaleValue(
+          base,
+          "breath",
+          density
+        )}px`
+      };
+    });
     const outerViewportHeight = inject(BODY_CONTENT_VIEWPORT_HEIGHT, void 0);
     const providedViewportHeight = computed(
       () => isDrawer.value ? drawerBodyHeight.value : (outerViewportHeight == null ? void 0 : outerViewportHeight.value) ?? 0
@@ -136,6 +158,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             "confirm-modal_hidden-header": __props.hiddenHeader
           }
         ],
+        style: layerPadVars.value,
         "show-close": __props.showClose,
         "append-to-body": "",
         "close-on-click-modal": __props.closeOnClickModal,
@@ -147,7 +170,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             ref_key: "contentRef",
             ref: contentRef,
             class: normalizeClass(["confirm-modal__content", { "confirm-modal__content_drawer": isDrawer.value }]),
-            "data-dc-slot": unref(SlotRegion).ModalConfirm_Body
+            "data-dc-slot": bodySlotRegion.value
           }, [
             renderSlot(_ctx.$slots, "main-header", {}, void 0, true),
             renderSlot(_ctx.$slots, "default", {}, () => [
@@ -211,7 +234,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           ]),
           key: "1"
         } : void 0
-      ]), 1040, ["model-value", "class", "show-close", "close-on-click-modal", "close-on-press-escape"]);
+      ]), 1040, ["model-value", "class", "style", "show-close", "close-on-click-modal", "close-on-press-escape"]);
     };
   }
 });

package/es/components/table/TableToolbar.vue.mjs

@@ -1,7 +1,7 @@
 import _sfc_main from "./TableToolbar.vue2.mjs";
 /* empty css                   */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
-const TableToolbar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-0220e327"]]);
+const TableToolbar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-bdf7a873"]]);
 export {
   TableToolbar as default
 };

package/es/components/table/TableToolbar.vue2.mjs

@@ -1,13 +1,16 @@
-import { defineComponent, useModel, computed, ref, withDirectives, openBlock, createElementBlock, createElementVNode, createBlock, unref, withCtx, createVNode, createTextVNode, createCommentVNode, vShow, mergeModels } from "vue";
+import { defineComponent, useCssVars, inject, computed, useModel, ref, withDirectives, openBlock, createElementBlock, createElementVNode, createBlock, unref, withCtx, createVNode, createTextVNode, createCommentVNode, vShow, mergeModels } from "vue";
 import { ElDropdown, ElButton, ElIcon, ElDropdownMenu, ElDropdownItem, ElSwitch, ElMessageBox, ElMessage } from "element-plus";
 import { ArrowDown, Calendar, Grid } from "@element-plus/icons-vue";
 import _sfc_main$1 from "./ToolbarButtons.vue.mjs";
 import AutoRefreshGroup from "../misc/AutoRefreshGroup.vue.mjs";
+import { APP_LAYOUT_BRIDGE_KEY } from "../../inject/key.mjs";
+import { gapScaleValue } from "../../utils/gap-scale.mjs";
 import { countAll, fetchListAll } from "../../helpers/list-helper.mjs";
 import { EXPORT_MAX_LIMIT, exportCSV } from "../../utils/export.mjs";
 const _hoisted_1 = { class: "table-toolbar" };
 const _hoisted_2 = { class: "table-toolbar-left" };
 const _hoisted_3 = { class: "table-toolbar-right" };
+const DEFAULT_GAP_BASE = 8;
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "TableToolbar",
   props: /* @__PURE__ */ mergeModels({
@@ -34,7 +37,18 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   }),
   emits: ["update:isAutoRefresh", "update:refreshInterval", "update:customView"],
   setup(__props) {
+    useCssVars((_ctx) => ({
+      "v5e2681ca": groupGapPx.value
+    }));
     const props = __props;
+    const layoutBridge = inject(APP_LAYOUT_BRIDGE_KEY, void 0);
+    const groupGapPx = computed(
+      () => `${gapScaleValue(
+        (layoutBridge == null ? void 0 : layoutBridge.APP_LAYOUT_GAP_CONFIG.size) ?? DEFAULT_GAP_BASE,
+        "breath",
+        layoutBridge == null ? void 0 : layoutBridge.themeDensity.value
+      )}px`
+    );
     const isAutoRefresh = useModel(__props, "isAutoRefresh");
     const refreshInterval = useModel(__props, "refreshInterval");
     const customView = useModel(__props, "customView");

package/es/components/view-layout/ViewLayout.vue.mjs

@@ -1,7 +1,7 @@
 import _sfc_main from "./ViewLayout.vue2.mjs";
 /* empty css                 */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
-const ViewLayout = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-f386aec7"]]);
+const ViewLayout = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-2a70d3bc"]]);
 export {
   ViewLayout as default
 };

package/es/components/view-layout/ViewLayout.vue2.mjs

@@ -34,11 +34,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     showNavigation: { type: Boolean, default: true },
     leftExtraButtons: { default: () => [] },
     rightExtraButtons: { default: () => [] },
-    appBar: { type: Boolean },
-    back: {},
-    moreOptions: {},
-    onMoreSelect: {},
-    onMore: {}
+    titleField: {}
   }, {
     "isAutoRefresh": { type: Boolean },
     "isAutoRefreshModifiers": {}
@@ -46,13 +42,15 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   emits: ["update:isAutoRefresh"],
   setup(__props) {
     useCssVars((_ctx) => ({
-      "v5975c734": padXPx.value
+      "v4035b64a": padXPx.value
     }));
     const props = __props;
     const { ctxRefine } = useContextDefaults({
       getProps: () => props,
       defaults: {
-        refine: ({ parentInfo, props: rawProps }) => rawProps.refine ?? (parentInfo === SlotRegion.AppPage_Default || parentInfo === SlotRegion.TabsMain_Item || parentInfo === SlotRegion.ModalConfirm_Body ? true : void 0)
+        refine: ({ parentInfo, props: rawProps }) => rawProps.refine ?? (parentInfo === SlotRegion.AppPage_Default || parentInfo === SlotRegion.TabsMain_Item || parentInfo === SlotRegion.ModalConfirm_Body || // 🔴 抽屉档 [MUST] 一起列上：两档都 provide 有界可用高，
+        // 漏它就是「抽屉里掉回自然流」（k2vnfp 换标时的连带）
+        parentInfo === SlotRegion.ModalConfirm_DrawerBody ? true : void 0)
       }
     });
     const { viewportHeightFinal, nearestScope } = useChannelViewportHeight(props);
@@ -87,6 +85,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       goNext: listDetailCtx == null ? void 0 : listDetailCtx.goNext,
       refreshList: listDetailCtx == null ? void 0 : listDetailCtx.refreshList
     }));
+    watch(
+      () => [props.titleField, props.title],
+      ([field, t]) => field == null ? void 0 : field.changeTitle(t),
+      { immediate: true }
+    );
     const hasHeader = computed(() => !!slots.header || !!props.title);
     const hasBottom = computed(() => !!slots.bottom);
     const toolbarProps = computed(() => ({
@@ -102,12 +105,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       showAutoRefresh: props.showAutoRefresh,
       showRefresh: props.showRefresh,
       padXPx: padXPx.value,
-      // appBar 形态四件套原样下传（gate 判定收在子组件里，见其 showBack / showMore）
-      appBar: props.appBar,
-      back: props.back,
-      moreOptions: props.moreOptions,
-      onMoreSelect: props.onMoreSelect,
-      onMore: props.onMore
+      groupGapPx: toolbarGroupGapPx.value
     }));
     const hasToolbarContent = computed(
       () => {
@@ -134,6 +132,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       )
     );
     const gapUnitPx = computed(() => `${gapUnit.value}px`);
+    const toolbarGroupGapPx = computed(
+      () => `${gapScaleValue(
+        (layoutBridge == null ? void 0 : layoutBridge.APP_LAYOUT_GAP_CONFIG.size) ?? DEFAULT_GAP_BASE,
+        "breath",
+        layoutBridge == null ? void 0 : layoutBridge.themeDensity.value
+      )}px`
+    );
     const padXPx = computed(() => gapUnitPx.value);
     const contentPaddingVertical = computed(() => gapUnit.value * 2);
     const heightProviderViewportHeight = computed(
@@ -178,19 +183,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 fn: withCtx(() => [
                   renderSlot(_ctx.$slots, "header", {
                     data: data.value,
-                    loading: loading.value
+                    loading: loading.value,
+                    title: __props.title
                   }, () => [
                     createTextVNode(toDisplayString(__props.title), 1)
                   ], true)
                 ]),
                 key: "0"
-              } : void 0,
-              _ctx.$slots.more ? {
-                name: "more",
-                fn: withCtx(() => [
-                  renderSlot(_ctx.$slots, "more", {}, void 0, true)
-                ]),
-                key: "1"
               } : void 0
             ]), 1040, ["isAutoRefresh"])
           ]),
@@ -233,19 +232,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               fn: withCtx(() => [
                 renderSlot(_ctx.$slots, "header", {
                   data: data.value,
-                  loading: loading.value
+                  loading: loading.value,
+                  title: __props.title
                 }, () => [
                   createTextVNode(toDisplayString(__props.title), 1)
                 ], true)
               ]),
               key: "0"
-            } : void 0,
-            _ctx.$slots.more ? {
-              name: "more",
-              fn: withCtx(() => [
-                renderSlot(_ctx.$slots, "more", {}, void 0, true)
-              ]),
-              key: "1"
             } : void 0
           ]), 1040, ["isAutoRefresh"]),
           createElementVNode("div", _hoisted_3, [

package/es/components/view-layout/ViewLayoutToolbar.vue.mjs

@@ -1,7 +1,7 @@
 import _sfc_main from "./ViewLayoutToolbar.vue2.mjs";
 /* empty css                        */
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
-const ViewLayoutToolbar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-99d466e9"]]);
+const ViewLayoutToolbar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-56bbc322"]]);
 export {
   ViewLayoutToolbar as default
 };

package/es/components/view-layout/ViewLayoutToolbar.vue2.mjs

@@ -1,16 +1,14 @@
-import { defineComponent, useCssVars, useSlots, computed, withDirectives, openBlock, createElementBlock, normalizeClass, createElementVNode, withKeys, withModifiers, createVNode, unref, withCtx, createCommentVNode, renderSlot, createBlock, Fragment, renderList, createTextVNode, toDisplayString, vShow } from "vue";
-import { ElIcon, ElDropdown, ElDropdownMenu, ElDropdownItem } from "element-plus";
-import { ArrowLeft, MoreFilled } from "@element-plus/icons-vue";
+import { defineComponent, useCssVars, withDirectives, openBlock, createElementBlock, createElementVNode, renderSlot, createCommentVNode, createVNode, unref, createBlock, vShow } from "vue";
 import AutoRefreshGroup from "../misc/AutoRefreshGroup.vue.mjs";
 import _sfc_main$1 from "../display/ActionBtnGroup.vue.mjs";
 import ViewLayoutNavigation from "./ViewLayoutNavigation.vue.mjs";
-const _hoisted_1 = { class: "view-layout-toolbar__left" };
-const _hoisted_2 = {
-  key: 1,
+const _hoisted_1 = { class: "view-layout-toolbar" };
+const _hoisted_2 = { class: "view-layout-toolbar__left" };
+const _hoisted_3 = {
+  key: 0,
   class: "dc-view-layout__header view-layout-header"
 };
-const _hoisted_3 = { class: "view-layout-toolbar__right" };
-const _hoisted_4 = { class: "view-layout-toolbar__more" };
+const _hoisted_4 = { class: "view-layout-toolbar__right" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "ViewLayoutToolbar",
   props: {
@@ -27,65 +25,19 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     showAutoRefresh: { type: Boolean },
     showRefresh: { type: Boolean },
     padXPx: {},
-    appBar: { type: Boolean },
-    back: { type: Function },
-    moreOptions: {},
-    onMoreSelect: { type: Function },
-    onMore: { type: Function }
+    groupGapPx: {}
   },
   emits: ["update:isAutoRefresh"],
   setup(__props, { emit: __emit }) {
     useCssVars((_ctx) => ({
-      "v507b6fb2": _ctx.padXPx
+      "v466ae854": _ctx.padXPx,
+      "v93b5fbf4": _ctx.groupGapPx
     }));
-    const props = __props;
     const emit = __emit;
-    const slots = useSlots();
-    const showBack = computed(() => !!props.appBar && !!props.back);
-    const hasMoreMenu = computed(() => {
-      var _a;
-      return !!((_a = props.moreOptions) == null ? void 0 : _a.length);
-    });
-    const showMore = computed(
-      () => !!props.appBar && (hasMoreMenu.value || !!props.onMore || !!slots.more)
-    );
-    const rootClass = computed(() => ({
-      "view-layout-toolbar_app-bar": !!props.appBar
-    }));
     return (_ctx, _cache) => {
-      return withDirectives((openBlock(), createElementBlock("div", {
-        class: normalizeClass(["view-layout-toolbar", rootClass.value])
-      }, [
-        createElementVNode("div", _hoisted_1, [
-          showBack.value ? (openBlock(), createElementBlock("span", {
-            key: 0,
-            class: "view-layout-toolbar__back",
-            role: "button",
-            tabindex: "0",
-            "aria-label": "返回",
-            onClick: _cache[0] || (_cache[0] = ($event) => {
-              var _a;
-              return (_a = __props.back) == null ? void 0 : _a.call(__props);
-            }),
-            onKeydown: [
-              _cache[1] || (_cache[1] = withKeys(withModifiers(($event) => {
-                var _a;
-                return (_a = __props.back) == null ? void 0 : _a.call(__props);
-              }, ["prevent"]), ["enter"])),
-              _cache[2] || (_cache[2] = withKeys(withModifiers(($event) => {
-                var _a;
-                return (_a = __props.back) == null ? void 0 : _a.call(__props);
-              }, ["prevent"]), ["space"]))
-            ]
-          }, [
-            createVNode(unref(ElIcon), null, {
-              default: withCtx(() => [
-                createVNode(unref(ArrowLeft))
-              ]),
-              _: 1
-            })
-          ], 32)) : createCommentVNode("", true),
-          __props.hasHeader ? (openBlock(), createElementBlock("div", _hoisted_2, [
+      return withDirectives((openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("div", _hoisted_2, [
+          __props.hasHeader ? (openBlock(), createElementBlock("div", _hoisted_3, [
             renderSlot(_ctx.$slots, "header", {}, void 0, true)
           ])) : createCommentVNode("", true),
           createVNode(unref(_sfc_main$1), {
@@ -94,7 +46,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             "default-size": "small"
           }, null, 8, ["configs", "ctx"])
         ]),
-        createElementVNode("div", _hoisted_3, [
+        createElementVNode("div", _hoisted_4, [
           __props.showNavigation ? (openBlock(), createBlock(ViewLayoutNavigation, {
             key: 0,
             ctx: __props.navigationCtx
@@ -110,75 +62,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             loading: __props.loading,
             showAutoRefresh: __props.showAutoRefresh,
             showRefresh: __props.showRefresh,
-            "onUpdate:isAutoRefresh": _cache[3] || (_cache[3] = ($event) => emit("update:isAutoRefresh", $event))
-          }, null, 8, ["isAutoRefresh", "refreshFn", "loading", "showAutoRefresh", "showRefresh"]),
-          showMore.value && hasMoreMenu.value ? (openBlock(), createBlock(unref(ElDropdown), {
-            key: 1,
-            trigger: "click",
-            onCommand: __props.onMoreSelect
-          }, {
-            dropdown: withCtx(() => [
-              createVNode(unref(ElDropdownMenu), null, {
-                default: withCtx(() => [
-                  (openBlock(true), createElementBlock(Fragment, null, renderList(__props.moreOptions, (item) => {
-                    return openBlock(), createBlock(unref(ElDropdownItem), {
-                      key: item.value,
-                      command: item
-                    }, {
-                      default: withCtx(() => [
-                        createTextVNode(toDisplayString(item.label), 1)
-                      ]),
-                      _: 2
-                    }, 1032, ["command"]);
-                  }), 128))
-                ]),
-                _: 1
-              })
-            ]),
-            default: withCtx(() => [
-              createElementVNode("span", _hoisted_4, [
-                renderSlot(_ctx.$slots, "more", {}, () => [
-                  createVNode(unref(ElIcon), null, {
-                    default: withCtx(() => [
-                      createVNode(unref(MoreFilled))
-                    ]),
-                    _: 1
-                  })
-                ], true)
-              ])
-            ]),
-            _: 3
-          }, 8, ["onCommand"])) : showMore.value ? (openBlock(), createElementBlock("span", {
-            key: 2,
-            class: "view-layout-toolbar__more",
-            role: "button",
-            tabindex: "0",
-            onClick: _cache[4] || (_cache[4] = ($event) => {
-              var _a;
-              return (_a = __props.onMore) == null ? void 0 : _a.call(__props);
-            }),
-            onKeydown: [
-              _cache[5] || (_cache[5] = withKeys(withModifiers(($event) => {
-                var _a;
-                return (_a = __props.onMore) == null ? void 0 : _a.call(__props);
-              }, ["prevent"]), ["enter"])),
-              _cache[6] || (_cache[6] = withKeys(withModifiers(($event) => {
-                var _a;
-                return (_a = __props.onMore) == null ? void 0 : _a.call(__props);
-              }, ["prevent"]), ["space"]))
-            ]
-          }, [
-            renderSlot(_ctx.$slots, "more", {}, () => [
-              createVNode(unref(ElIcon), null, {
-                default: withCtx(() => [
-                  createVNode(unref(MoreFilled))
-                ]),
-                _: 1
-              })
-            ], true)
-          ], 32)) : createCommentVNode("", true)
+            "onUpdate:isAutoRefresh": _cache[0] || (_cache[0] = ($event) => emit("update:isAutoRefresh", $event))
+          }, null, 8, ["isAutoRefresh", "refreshFn", "loading", "showAutoRefresh", "showRefresh"])
         ])
-      ], 2)), [
+      ], 512)), [
         [vShow, __props.visible]
       ]);
     };

package/es/config/slot-region.mjs

@@ -7,6 +7,7 @@ var SlotRegion = /* @__PURE__ */ ((SlotRegion2) => {
   SlotRegion2[SlotRegion2["AppPage_Left"] = 5] = "AppPage_Left";
   SlotRegion2[SlotRegion2["TabsMain_Item"] = 6] = "TabsMain_Item";
   SlotRegion2[SlotRegion2["ModalConfirm_Body"] = 7] = "ModalConfirm_Body";
+  SlotRegion2[SlotRegion2["ModalConfirm_DrawerBody"] = 8] = "ModalConfirm_DrawerBody";
   return SlotRegion2;
 })(SlotRegion || {});
 const parseSlotRegion = (raw) => {

package/es/hooks/use-surface.mjs

@@ -7,6 +7,11 @@ const useSurface = (getProps) => {
   const { ctxSurface } = useContextDefaults({
     getProps,
     defaults: {
+      // 🔴 只对 **modal 正文**关面：那一档的底是抬升面（`--el-bg-color-overlay`）。
+      // **抽屉正文自 v0.32.0 起取底色**（`ModalConfirm_DrawerBody`）⇒ 那儿 [MUST] 自持面，
+      // 否则内容直接摊在底色上（与「空占位没有面」是同一种坏法，范围更大）。
+      // [MUST NOT] 写成 `parentInfo !== ModalConfirm_Body` 之外再排除抽屉档 ——
+      // 判据是「**脚下是不是一块面**」，抽屉那档的答案是「不是」。
       surface: ({ parentInfo, props: rawProps }) => rawProps.surface ?? parentInfo !== SlotRegion.ModalConfirm_Body
     }
   });

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

@@ -158,6 +158,24 @@ const RHYTHM_STYLE_EL_ID = "dc-core-rhythm";
 const EP_BRIDGE_STYLE_EL_ID = "dc-core-ep-bridge";
 const EP_STRUCTURAL_STYLE_EL_ID = "dc-core-ep-structural";
 const EP_STRUCTURAL_CSS = [
+  // ElSwitch 关闭态：EP 默认 `--el-switch-off-color: var(--el-border-color)`，
+  // 而边框色是**给分隔线用的最浅档** ⇒ 开关整体几乎看不见。
+  // 🔴 依据是 CDP 实测对比度（对白底 / 对近黑底），[MUST NOT] 只看顺眼：
+  //   --el-border-color（EP 默认，现状）  1.33 / 2.18  ← 两侧都远低于下限
+  //   --el-border-color-dark             1.44 / 2.60
+  //   --el-text-color-placeholder        2.30 / 5.75  ← 亮色仍不过
+  //   --el-text-color-secondary          3.08 / 7.56  ← **取它**：两侧都过且最轻
+  //   --el-text-color-regular            6.11 / 12.29 ← 过重，关闭态会读成开启
+  // 下限取 3:1 —— WCAG 1.4.11 对**非文字 UI 控件**的可辨识要求；开关的轨道就是它的边界。
+  // ⚠️ 落点 [MUST] 在此而非组件 scoped：开关广泛散在各族与业务页，
+  // 逐处改既漏又会各定各的（同 .el-badge__content 那条的理由）。
+  // ⚠️ 这是**全仓所有 ElSwitch** 的关闭态观感变更，[MUST] 在 migrations 登记。
+  ".el-switch {",
+  "  --el-switch-off-color: var(",
+  "    --dc-core-text-color-secondary,",
+  "    var(--el-text-color-secondary)",
+  "  );",
+  "}",
   // 居中浮层（Dialog / MessageBox）+ 抽屉（Drawer）：1px 主题描边硬边界
   // （--el-border-color 类明暗自换：亮色浅灰近隐形、暗色中灰清晰）。
   ".el-dialog,",

package/es/index.mjs

@@ -32,7 +32,7 @@ import { APP_GLOBAL_IMAGE_PREVIEW_KEY, APP_GLOBAL_VIDEO_PREVIEW_KEY, GLOBAL_MODA
 import { APP_LAYOUT_APP_STORE_KEY, APP_LAYOUT_BRIDGE_KEY, APP_LAYOUT_USER_STORE_KEY, APP_PAGE_CONTENT_INSET, APP_PAGE_LIST_DETAIL_CONTEXT, BODY_CONTENT_VIEWPORT_HEIGHT, BODY_CONTENT_VIEWPORT_INSET, BODY_CONTENT_VIEWPORT_RECT, CORE_BRIDGE_KEY, FORM_NEST_REGISTRY_KEY, FORM_VALIDATE_ERROR_KEYS, NEST_LAYOUT_SCALE_KEY, SCOPE_VIEWPORT_MAX_HEIGHT, TABS_MAIN_VISUAL_LEVEL, getModalShelfInjectionKey } from "./inject/key.mjs";
 import { APP_PAGE_LIST_LAYOUT_RECOMMENDED } from "./components/app-layout/app-page-recommended.mjs";
 import { APP_PAGE_SIDE_SLOTS, DC_SLOT_ATTR, SlotRegion, parseSlotRegion, resolveAppPageSlotName } from "./config/slot-region.mjs";
-import { APP_PAGE_SLOT_Z_INDEX, computeAppPageContentInset, computeAppPageReducedViewportHeight, computeAppPageReducedViewportWidth, computeAppPageSlotShimStyles, computeAppPageSlotStyles } from "./components/app-layout/app-page-geometry.mjs";
+import { APP_PAGE_SLOT_Z_INDEX, appPageSlotInset, computeAppPageContentInset, computeAppPageReducedViewportHeight, computeAppPageReducedViewportWidth, computeAppPageSlotShimStyles, computeAppPageSlotStyles } from "./components/app-layout/app-page-geometry.mjs";
 import { default as default32 } from "./components/display/ActionConfirm.vue.mjs";
 import { default as default33 } from "./components/app-layout/AppAside.vue.mjs";
 import { default as default34 } from "./components/app-layout/AppBody.vue.mjs";
@@ -112,6 +112,7 @@ import { resolveBreakpointByWidth, resolveRootEl, useCustomBreakpoint } from "./
 import { themeScaleDerive, themeScaleIsNearBlack, themeScaleMix, themeScalePageColor, themeScaleParseHex, themeScaleSurfaceColor, themeScaleToRgba } from "./utils/theme-scale.mjs";
 import { timeCountDown } from "./utils/time.mjs";
 import { useActivated, useActivatedEvent, useActivatedExec } from "./hooks/activated.mjs";
+import { useAppPageTitleField } from "./components/app-layout/use-app-page-title-field.mjs";
 import { useBreakpoint } from "./hooks/use-breakpoint.mjs";
 import { useChannelViewportHeight } from "./hooks/use-channel-viewport-height.mjs";
 import { useCoreViewportApply } from "./hooks/use-viewport-apply.mjs";
@@ -240,6 +241,7 @@ export {
   default77 as VideoPreviewTrigger,
   default78 as ViewLayout,
   default31 as WatchSize,
+  appPageSlotInset,
   buildRhythmCss,
   ceilToTier,
   checkFormItemIsIgnore,
@@ -314,6 +316,7 @@ export {
   useActivated,
   useActivatedEvent,
   useActivatedExec,
+  useAppPageTitleField,
   useBreakpoint,
   useChannelViewportHeight,
   useCoreThemeApply,

package/es/store/app.mjs

@@ -126,7 +126,13 @@ function createAppStore(deps) {
       () => hasHeader.value ? `calc(${viewportPadding.value.top} + ${gpx.value} + ${headerStyle.value.height} + ${gpx.value})` : `calc(${viewportPadding.value.top} + ${gpx.value})`
     );
     const contentTop = computed(
-      () => hasHeader.value ? `calc(${viewportPadding.value.top} + ${gpx.value} + ${headerStyle.value.height} + ${outerPx.value})` : `calc(${viewportPadding.value.top} + ${outerPx.value})`
+      () => hasHeader.value ? `calc(${viewportPadding.value.top} + ${gpx.value} + ${headerStyle.value.height} + ${outerPx.value})` : (
+        // 🔴 **无 header ⇒ 内容自己就是最外层**，该拿**模块档**（chrome 贴视口边那一档），
+        // [MUST NOT] 继续拿外圈档（r8kvnd）：外圈档量的是「内容 ↔ chrome」，
+        // 没有 chrome 时它顶替的是 header 的位置，理应与 header 同档
+        // —— 否则最外层距视口边随有没有 chrome 在 8 / 16 之间跳。
+        `calc(${viewportPadding.value.top} + ${gpx.value})`
+      )
     );
     const footerStyle = computed(() => {
       const cfg = bridge.APP_LAYOUT_FOOTER_CONFIG;
@@ -186,16 +192,26 @@ function createAppStore(deps) {
     });
     const bodyStyle = computed(() => {
       return {
-        // 🔴 内容四边一律让**外圈档**（huhyx7）：内容 ↔ chrome、内容 ↔ viewport 边
-        // 都是「内容对外」的那一档，比 chrome 模块彼此的 ×1 多一档。
+        // 🔴 **内容 ↔ chrome 让外圈档，内容 ↔ viewport 边让模块档**（r8kvnd 更正 huhyx7）：
+        // 原口径把两者当成同一件事（都算「内容对外」）—— 其实是两件。没有 chrome 时
+        // **内容接替的是 chrome 的角色（最外层元素）**，就该拿 chrome 那一档。
+        // ⚠️ 底边（`paddingBottom`）暂未改：它是**无条件**的（footer 在流内），
+        // 动它全仓每页都变，[MUST] 由甲方拍板 —— 见回池条目。
         // 它同时**接替了已废弃的 shimPadding** —— 此前这段留白由
         // `gap + shimPadding` 两处各给一半，同一段空白两个来源正是要消除的冗余。
         // 内容左让位：外框左 + 外圈；有 sidebar 再加 sidebar 宽（sidebar 自身左边已让模块档）。
-        paddingLeft: showSidebar.value ? `calc(${viewportPadding.value.left} + ${gpx.value} + ${sidebarStyle.value.width} + ${outerPx.value})` : `calc(${viewportPadding.value.left} + ${outerPx.value})`,
+        paddingLeft: showSidebar.value ? `calc(${viewportPadding.value.left} + ${gpx.value} + ${sidebarStyle.value.width} + ${outerPx.value})` : (
+          // 无 sidebar ⇒ 内容就是最外层，取模块档（同 contentTop 的注释，r8kvnd）
+          `calc(${viewportPadding.value.left} + ${gpx.value})`
+        ),
         // 顶让位 = 内容行顶（与 sidebar/aside 同行，但内容对 header 让外圈档）。
         paddingTop: contentTop.value,
         // 右让位（对称左）：外框右 + 外圈；有 aside 再加 aside 宽。
-        paddingRight: showAside.value ? `calc(${viewportPadding.value.right} + ${gpx.value} + ${asideStyle.value.width} + ${outerPx.value})` : `calc(${viewportPadding.value.right} + ${outerPx.value})`,
+        paddingRight: showAside.value ? `calc(${viewportPadding.value.right} + ${gpx.value} + ${asideStyle.value.width} + ${outerPx.value})` : (
+          // 无 aside ⇒ 同上（[MUST NOT] 只改左右不改上 —— 那会变成左右 8 / 上下 16，
+          // 上下比左右宽一倍，比原来四边都 16 更怪）
+          `calc(${viewportPadding.value.right} + ${gpx.value})`
+        ),
         // 底让位：外框下 + 外圈（footer 在流内，其底悬浮由此承担）。
         paddingBottom: `calc(${viewportPadding.value.bottom} + ${outerPx.value})`,
         // 底色：**缺省不铺**（akw76r）——.app-body 是容器，容器一律透明，布局底由全局
@@ -214,19 +230,18 @@ function createAppStore(deps) {
       const vpCfg = bridge.APP_LAYOUT_VIEWPORT_CONFIG;
       const asideEffWidth = showAside.value && !bridge.layout.asideCollapsed.value ? bridge.APP_LAYOUT_ASIDE_CONFIG.width : 0;
       return {
-        top: hasHeader.value ? vpCfg.paddingTop + g + headerHeight.value + o : vpCfg.paddingTop + o,
+        top: hasHeader.value ? vpCfg.paddingTop + g + headerHeight.value + o : vpCfg.paddingTop + g,
         bottom: hasFooter.value ? vpCfg.paddingBottom + g + footerHeight.value + o : vpCfg.paddingBottom + o,
-        left: showSidebar.value ? vpCfg.paddingLeft + g + sidebarWidth.value + o : vpCfg.paddingLeft + o,
-        right: showAside.value ? vpCfg.paddingRight + g + asideEffWidth + o : vpCfg.paddingRight + o
+        left: showSidebar.value ? vpCfg.paddingLeft + g + sidebarWidth.value + o : vpCfg.paddingLeft + g,
+        right: showAside.value ? vpCfg.paddingRight + g + asideEffWidth + o : vpCfg.paddingRight + g
       };
     });
     const bodyShimStyle = computed(() => {
       const headerSub = hasHeader.value ? ` - ${headerStyle.value.height} - ${gpx.value}` : "";
       const footerSub = hasFooter.value ? ` - ${footerStyle.value.height} - ${gpx.value}` : "";
+      const topSub = hasHeader.value ? outerPx.value : gpx.value;
       return {
-        // 上下两处从 gap 改**外圈档**：与 bodyStyle 的 paddingTop/Bottom 逐项同式
-        // （内容对外恒让外圈），[MUST] 一起改，否则可用高与实际内容盒对不上。
-        minHeight: `calc(100vh - ${viewportPadding.value.top} - ${viewportPadding.value.bottom} - ${outerPx.value} - ${outerPx.value}${headerSub}${footerSub})`
+        minHeight: `calc(100vh - ${viewportPadding.value.top} - ${viewportPadding.value.bottom} - ${topSub} - ${outerPx.value}${headerSub}${footerSub})`
         // 🔴 **不铺 padding**（huhyx7 A 条）：四周留白已由 bodyStyle 的外圈档给过，
         // 这里再铺一层就是同一段空白两个来源 —— 那正是本批要消除的冗余。
         // 原 `shimPadding` 已废弃（见 APP_LAYOUT_BODY_CONFIG.shimPadding 的 @deprecated）。