@agile-team/wl-skills-ui 1.9.7 → 1.9.8

package/CHANGELOG.md

@@ -4,6 +4,15 @@ All notable changes to **@agile-team/wl-skills-ui** will be documented in this f
 
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/).
 
+## [1.9.8] - 2026-07-29
+
+### Fixed
+
+- 统一紧凑业务表单 label、输入值、选择值、placeholder、textarea 与数字值为 12px，并继续豁免登录页和显式定制区域。
+- 修复 textarea 聚焦后品牌色边框不清晰，以及数字输入框在不同 wrapper DOM、hover + focus 组合态下边框消失或双描边的问题。
+- 补强原生 Element Table 与 AG Grid 长文本单行省略样式，继续由 R039 / `defineColumns()` 负责悬停完整提示与业务例外。
+- 修复 BaseToolbar 分裂下拉按钮的箭头独立色块与菜单项内嵌按钮描边；规则仅命中 `action-button-wrap` 和 `action-dropdown-menu`，不影响普通按钮组与普通下拉菜单。
+
 ## [1.9.7] - 2026-07-28
 
 ### Added

package/README.md

@@ -200,7 +200,7 @@ yarn add @agile-team/wl-skills-ui
 |---|---|---|
 | `element-plus` | **`2.2.6-prod.3`** | 集团 jh- 定制版；EP 2.3.0 起引入 `.el-input__wrapper`，与 jh-ui 3.x 不兼容 |
 | `@jhlc/jh-ui` | **`3.1.0`** | SCSS 皮肤包，`.com-text` label 包裹 + `.has-colon` 冒号注入（wl-skills-ui 已统一屏蔽表单冒号） |
-| `@agile-team/wl-skills-ui` | `^1.9.7` | 已对齐上述组合的 DOM 假设、客户主题锁、圆角契约与定制页样式边界 |
+| `@agile-team/wl-skills-ui` | `^1.9.8` | 已对齐上述组合的 DOM 假设、客户主题锁、圆角契约与定制页样式边界 |
 
 三种识别方式，任选其一：
 
@@ -214,10 +214,13 @@ yarn add @agile-team/wl-skills-ui
 
 ## 版本亮点
 
-当前 v1.9.7：
+当前 v1.9.8：
 
 - **主操作按钮不再漏色**：新增/新建/添加/创建类按钮强制使用客户主题 `primary` 填充样式，扫描器可识别并自动修复漏写 `type` 或误带 `plain` 的存量代码。
 - **长文本交互统一**：普通数据列在空间不足时单行省略，悬停显示完整内容；Tag、操作列、自定义渲染和主动换行列不被机械覆盖。
+- **紧凑表单字号闭环**：业务表单 label、输入值、选择值、placeholder、textarea 与数字输入统一为 12px；登录页和显式定制区域继续保持项目自身设计。
+- **输入边框状态闭环**：textarea 聚焦始终显示品牌色边框；数字输入兼容 Element Plus 新旧及混合 wrapper DOM，默认、hover、focus、错误、禁用态均只保留一层正确边框。
+- **分裂操作保持一体**：BaseToolbar 的主动作与下拉箭头共用外轮廓和状态色，下拉菜单中的业务按钮扁平化为菜单项；规则精准限定在平台工具栏结构，不污染普通按钮组和普通下拉菜单。
 - **Vite 4 运行时兼容**：浏览器 ESM 产物不再暴露可被开发转换误替换的 Node 环境变量成员链，预构建与直接加载均保持合法语法。
 - **登录页精准退出**：内置识别 `.lp-root` 与 `.session-login`，其内部表单、按钮、焦点和校验态保留登录页自身设计；业务页面仍由包高权重统一管控。
 - **通用定制页边界**：其他定制页在根节点增加 `.wl-ui-skin-exempt` 或 `data-wl-ui-skin="off"` 即可退出组件级强覆盖，不需要删除全局化妆包。

package/docs/compat-matrix.md

@@ -11,7 +11,7 @@
 | `element-plus` | **`2.2.6-prod.3`** | 集团 jh- 定制版，搭配 `@jhlc/jh-ui` 使用，DOM 仍为 `.el-input > .el-input__inner` 直挂结构（**EP 2.3.0 起才引入 `.el-input__wrapper`**） |
 | `@jhlc/jh-ui` | **`3.1.0`** | SCSS 皮肤包，`.com-text` label 包裹、`.has-colon ::after` 冒号注入、`.el-form-item--default { margin-bottom: 24px }` 等强约束 |
 | `@jhlc/common-core` | `3.1.0` 或 `3.1.0-prod.x` | 基础 util/types，`@jhlc/jh-ui` 间接依赖 |
-| `@agile-team/wl-skills-ui` | `^1.9.7` | 已对齐 jh-ui 3.1.0 + EP 2.2.6-prod.3 的 DOM 假设、客户主题锁、6px 基础圆角、定制页样式边界与 Vite 4 开发转换 |
+| `@agile-team/wl-skills-ui` | `^1.9.8` | 已对齐 jh-ui 3.1.0 + EP 2.2.6-prod.3 的 DOM 假设、客户主题锁、6px 基础圆角、紧凑表单、分裂按钮、长文本提示、定制页样式边界与 Vite 4 开发转换 |
 
 ## 项目集群当前实测
 
@@ -35,7 +35,7 @@
 
 ## 适配建议
 
-- 集团内项目：**统一锚定 `element-plus@2.2.6-prod.3` + `@jhlc/jh-ui@3.1.0`**，与 wl-skills-ui v1.9.7 三方对齐。
+- 集团内项目：**统一锚定 `element-plus@2.2.6-prod.3` + `@jhlc/jh-ui@3.1.0`**，与 wl-skills-ui v1.9.8 三方对齐。
 - 升级 `element-plus` 到 2.3+ 前，必须同步升级 `@jhlc/jh-ui` 到对应支持版本，否则 `.com-text` / `.el-input__inner` DOM 与 EP `__wrapper` 体系不兼容。
 - 新项目接入：见 README 「快速接入」章节，默认会按本表声明 peerDependency 范围。
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agile-team/wl-skills-ui",
-  "version": "1.9.7",
+  "version": "1.9.8",
   "description": "企业级 UI 风格对齐框架 — Vue + Element Plus 项目通用化妆/原生双模式（tokens / element / vendors / layouts / runtime / scanner / fixer / skills）",
   "type": "module",
   "main": "./es/index.js",

package/skills/element/el-form/SKILL.md

@@ -59,6 +59,18 @@ el-date-picker 默认宽度不会自动撑满 el-form-item，必须显式设置
 
 ---
 
+## 表单字号与状态边框一致性 【中危】
+
+- 紧凑业务表单的 label、输入值、选择值、picker、textarea、数字值和 placeholder
+  统一使用 `--wk-form-font-size: 12px`；不要在某一种组件上单独保留 13px/14px。
+- textarea focus 必须是清晰的品牌色实线与轻外环，不能只改 `border-color` 或依赖
+  平台默认阴影。
+- 数字输入框必须同时检查社区版“wrapper 子节点”和 jh-ui“wrapper 与
+  input-number 同节点”两种 DOM，并确保只存在一层可见边框。
+- 登录页和显式定制页继续使用自身样式，不套用上述高权重规则。
+
+---
+
 ## 表单列数与输入宽度 【中危】
 
 - 全宽业务表单默认 4 列，严禁使用 5～8 列把输入框压缩到无法阅读或填写。

package/standards/ui/02-button.md

@@ -49,6 +49,21 @@
 
 ---
 
+## BaseToolbar 分裂下拉按钮
+
+当一个工具栏动作同时包含主动作 `onClick` 与子动作 `children` 时，BaseToolbar
+会生成 split-button。它在交互语义上仍是两个点击区域，但视觉上必须表现为一个
+完整按钮：
+
+- 主动作与箭头段共用同一背景色、hover/focus/active 状态和外轮廓。
+- 箭头段不得拥有独立圆角、外边距、阴影或 Element Plus 默认分割线。
+- `action-dropdown-menu` 中的 jh-button 必须扁平为菜单内容，边框和背景由
+  `el-dropdown-menu__item` 统一承担。
+- 上述规则不得扩散到普通 `el-button-group`、普通 `el-dropdown-menu` 或页面
+  自定义编辑器工具栏。
+
+---
+
 ## 操作列按钮（表格行内）
 
 统一使用 `renderOps` 图标按钮系统，**禁止** `<el-button>` 在行内使用：

package/standards/ui/03-form.md

@@ -67,6 +67,31 @@ textarea 不强制 26px 高度，只继承统一圆角、字体和状态样式
 
 ---
 
+## 规则：紧凑业务表单字号统一为 12px
+
+页面正文仍使用 14px；业务表单的 label、输入值、选择值、picker、textarea、
+数字输入框和 placeholder 统一使用：
+
+```scss
+--wk-form-font-size: 12px;
+```
+
+该规则同时覆盖 Element Plus 2.2 直挂 input DOM、2.3+ wrapper DOM 与 jh-* 封装，
+登录页及 `.wl-ui-skin-exempt` / `data-wl-ui-skin="off"` 定制页不参与覆盖。
+
+---
+
+## 规则：textarea 与数字输入框只保留一层状态边框
+
+- textarea 默认使用中性 1px 边框，hover 使用 hover 边框色，focus 强制使用品牌色
+  1px 实线与轻外环，不能只依赖平台已有 box-shadow。
+- 数字输入框兼容 `.el-input-number > .el-input__wrapper` 和
+  `.el-input-number.el-input__wrapper` 两种 DOM；由 wrapper 层绘制唯一边框，
+  内部 input 不得再画第二层边框。
+- error / disabled 状态继续分别使用危险色和禁用色，不得被 focus 覆盖。
+
+---
+
 ## 规则：表单 label 不强制冒号
 
 Element Plus 原生控件、picker 类控件和 jh-\* 封装控件的 label 后不强制追加 `:`。`@jhlc/jh-ui` 的 `.has-colon .com-text:after` / `.text-line-2:after` 冒号注入由 wl-skills-ui 统一屏蔽，避免 input / select / picker 之间出现有的带冒号、有的不带冒号。

package/styles/element/_form.scss

@@ -5,6 +5,7 @@
 html body {
   --wk-form-control-radius: var(--el-border-radius-base, 6px);
   --wk-form-control-height: 26px;
+  --wk-form-font-size: 12px !important;
   --wk-form-label-control-gap: 16px;
   --wk-form-label-line-height: 22px;
 }
@@ -24,6 +25,31 @@ html body {
     padding-right: var(--wk-form-label-control-gap) !important;
   }
 
+  // ── 紧凑业务表单字号统一 ──────────────────────────────────────────────────
+  // 正文仍使用 14px；这里只治理表单 label、控件值与 placeholder。
+  &.el-form-item__label,
+  &.el-form-item__label > .com-text,
+  &.el-form-item__label .com-text,
+  &.el-form-item__label > .text-line-2,
+  &.el-form-item__label .text-line-2,
+  &.el-input__inner,
+  &.el-textarea__inner,
+  &.el-select__selected-item,
+  &.el-select__placeholder,
+  &.el-select__tags-text,
+  &.el-date-editor .el-range-input,
+  &.el-date-editor .el-range-separator,
+  &.el-radio__label,
+  &.el-checkbox__label {
+    font-size: var(--wk-form-font-size, 12px) !important;
+  }
+
+  &.el-input__inner::placeholder,
+  &.el-textarea__inner::placeholder,
+  &.el-date-editor .el-range-input::placeholder {
+    font-size: var(--wk-form-font-size, 12px) !important;
+  }
+
   &.el-input__wrapper,
   &.el-select__wrapper,
   &.el-select .el-select__wrapper,
@@ -47,9 +73,10 @@ html body {
     line-height: calc(var(--wk-form-control-height) - 2px) !important;
   }
 
-  // common-core 的 InputNumberComponent 即使传入 controls=false，部分版本仍会
-  // 输出 controls-right 步进按钮。数值框保留 Element Plus 的 wrapper 作为唯一
-  // 可见边框，根节点仅负责尺寸，避免 wrapper 聚焦阴影与根边框叠成双层描边。
+  // common-core / jh-ui 有两种数字框 DOM：
+  // A. .el-input-number > .el-input > .el-input__wrapper（社区版）
+  // B. .el-input-number.el-input__wrapper > .el-input（jh 同节点 wrapper）
+  // 两种结构都只允许 wrapper 层绘制唯一可见边框。
   &.el-input-number,
   &.el-input-number:focus,
   &.el-input-number:focus-within {
@@ -61,6 +88,11 @@ html body {
     outline: none !important;
     box-sizing: border-box !important;
     background: transparent !important;
+  }
+
+  &.el-input-number:not(.el-input__wrapper),
+  &.el-input-number:not(.el-input__wrapper):focus,
+  &.el-input-number:not(.el-input__wrapper):focus-within {
     box-shadow: none !important;
   }
 
@@ -73,7 +105,8 @@ html body {
     box-shadow: none !important;
   }
 
-  &.el-input-number .el-input__wrapper {
+  &.el-input-number .el-input__wrapper,
+  &.el-input-number.el-input__wrapper {
     width: 100% !important;
     height: 100% !important;
     min-height: 0 !important;
@@ -86,23 +119,35 @@ html body {
     transition: box-shadow 0.15s ease !important;
   }
 
-  &.el-input-number:not(.is-disabled):hover .el-input__wrapper {
+  &.el-input-number:not(.is-disabled):hover .el-input__wrapper,
+  &.el-input-number.el-input__wrapper:not(.is-disabled):hover {
     box-shadow:
       0 0 0 1px var(--el-border-color-hover, #c0c4cc) inset !important;
   }
 
-  &.el-input-number .el-input__wrapper.is-focus,
-  &.el-input-number:focus-within .el-input__wrapper {
+  &.el-input-number:not(.is-disabled) .el-input__wrapper.is-focus,
+  &.el-input-number:not(.is-disabled):focus-within .el-input__wrapper,
+  &.el-input-number.el-input__wrapper:not(.is-disabled).is-focus,
+  &.el-input-number.el-input__wrapper:not(.is-disabled):focus,
+  &.el-input-number.el-input__wrapper:not(.is-disabled):focus-within {
     box-shadow:
       0 0 0 1.5px var(--el-color-primary, #002a8f) inset !important;
   }
 
-  &.el-input-number.is-disabled .el-input__wrapper {
+  &.el-input-number.is-disabled .el-input__wrapper,
+  &.el-input-number.el-input__wrapper.is-disabled {
     background: var(--el-disabled-bg-color, #f5f7fa) !important;
     box-shadow:
       0 0 0 1px var(--el-disabled-border-color, #e4e7ed) inset !important;
   }
 
+  // 极少数过渡版本会同时输出“同节点 wrapper + 子 wrapper”；
+  // 此时由外层绘制边框，明确清掉内层，防止双描边。
+  &.el-input-number.el-input__wrapper > .el-input > .el-input__wrapper {
+    background: transparent !important;
+    box-shadow: none !important;
+  }
+
   &.el-input-number .el-input__inner,
   &.el-input-number .el-input__inner:focus,
   &.el-input-number .el-input__inner:focus-visible {
@@ -139,7 +184,35 @@ html body {
     -moz-appearance: textfield !important;
   }
 
-  &.el-textarea__inner {
+  // ── textarea 默认 / hover / focus ─────────────────────────────────────────
+  // focus 使用“品牌色实线 + 轻外环”，不依赖平台原有 border-width/box-shadow。
+  &.el-textarea > .el-textarea__inner,
+  &.com-input > .el-textarea > .el-textarea__inner,
+  &.com-textarea > .el-textarea > .el-textarea__inner {
+    border: 1px solid var(--el-border-color, #dcdfe6) !important;
     border-radius: var(--wk-form-control-radius) !important;
+    box-shadow: none !important;
+    transition:
+      border-color 0.15s ease,
+      box-shadow 0.15s ease !important;
+  }
+
+  &.el-textarea:not(.is-disabled) > .el-textarea__inner:hover:not(:focus),
+  &.com-input > .el-textarea:not(.is-disabled) > .el-textarea__inner:hover:not(:focus),
+  &.com-textarea > .el-textarea:not(.is-disabled) > .el-textarea__inner:hover:not(:focus) {
+    border-color: var(--el-border-color-hover, #c0c4cc) !important;
+  }
+
+  &.el-textarea.is-focus > .el-textarea__inner,
+  &.el-textarea > .el-textarea__inner:focus,
+  &.el-textarea > .el-textarea__inner:focus-visible,
+  &.com-input > .el-textarea.is-focus > .el-textarea__inner,
+  &.com-input > .el-textarea > .el-textarea__inner:focus,
+  &.com-textarea > .el-textarea.is-focus > .el-textarea__inner,
+  &.com-textarea > .el-textarea > .el-textarea__inner:focus {
+    border: 1px solid var(--el-color-primary, #002a8f) !important;
+    outline: none !important;
+    box-shadow:
+      0 0 0 2px rgba(var(--el-color-primary-rgb, 0, 42, 143), 0.12) !important;
   }
 }

package/styles/element/_table.scss

@@ -15,6 +15,7 @@ html body .el-table {
   // 仅命中 show-overflow-tooltip 生成的单元格，不压制 Tag/操作列等自定义内容。
   .el-table__body .cell.el-tooltip {
     min-width: 0;
+    max-width: 100%;
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;

package/styles/vendors/_ag-grid.scss

@@ -119,6 +119,7 @@
 }
 
 .ag-cell-value {
+  min-width: 0;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;

package/styles/vendors/_base-components.scss

@@ -453,20 +453,11 @@
   &.el-textarea {
     .el-textarea__inner {
       border-radius: 6px !important;
-      font-size: 13px !important;
+      font-size: var(--wk-form-font-size, 12px) !important;
       line-height: 1.65 !important;
       padding: 7px 10px !important;
       resize: vertical !important; // 只允许垂直拉伸，不允许水平
       transition: border-color 0.15s, box-shadow 0.15s;
-
-      &:hover:not(:focus) {
-        border-color: var(--el-border-color-hover, #c0c4cc) !important;
-      }
-
-      &:focus {
-        border-color: var(--el-color-primary) !important;
-        box-shadow: 0 0 0 2px rgba(var(--el-color-primary-rgb), 0.12) !important;
-      }
     }
 
     // 字数统计：更小、更淡、不遮挡内容
@@ -495,8 +486,7 @@
   &.el-select__wrapper.is-focused,
   &.el-select__wrapper:focus-within,
   &.el-date-editor.el-input__wrapper.is-focus,
-  &.el-date-editor.el-input__wrapper:focus-within,
-  &.el-textarea__inner:focus {
+  &.el-date-editor.el-input__wrapper:focus-within {
     box-shadow: 0 0 0 1.5px var(--el-color-primary, #002a8f) inset !important;
   }
 
@@ -514,13 +504,13 @@
   &.el-form.el-form--label-left .el-form-item__label,
   &.el-form.el-form--label-right .el-form-item__label {
     align-items: baseline !important;
-    font-size: 12px !important;
+    font-size: var(--wk-form-font-size, 12px) !important;
     line-height: var(--wk-form-label-line-height, 22px) !important;
   }
 
   &.el-form.el-form--label-left .el-form-item__label > .com-text,
   &.el-form.el-form--label-right .el-form-item__label > .com-text {
-    font-size: 12px !important;
+    font-size: var(--wk-form-font-size, 12px) !important;
     line-height: var(--wk-form-label-line-height, 22px) !important;
   }
 
@@ -529,7 +519,7 @@
   &.el-form.el-form--label-right .el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label::before {
     content: "*" !important;
     color: var(--el-color-danger, #f56c6c) !important;
-    font-size: 12px !important;
+    font-size: var(--wk-form-font-size, 12px) !important;
     font-weight: 400 !important;
     line-height: var(--wk-form-label-line-height, 22px) !important;
     display: inline-block !important;
@@ -545,7 +535,7 @@
   &.el-form.el-form--label-right .el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label > .com-text::before {
     content: "*" !important;
     color: var(--el-color-danger, #f56c6c) !important;
-    font-size: 12px !important;
+    font-size: var(--wk-form-font-size, 12px) !important;
     font-weight: 400 !important;
     line-height: var(--wk-form-label-line-height, 22px) !important;
     display: inline-block !important;
@@ -572,7 +562,7 @@
   &.el-form.el-form--label-right .el-form-item.is-required:not(.is-no-asterisk).asterisk-right > .el-form-item__label::after {
     content: "*" !important;
     color: var(--el-color-danger, #f56c6c) !important;
-    font-size: 12px !important;
+    font-size: var(--wk-form-font-size, 12px) !important;
     font-weight: 400 !important;
     line-height: var(--wk-form-label-line-height, 22px) !important;
     display: inline-block !important;
@@ -606,6 +596,20 @@
     .el-textarea__inner {
       box-shadow: 0 0 0 1px var(--el-color-danger, #f56c6c) inset !important;
     }
+
+    // InputNumber 的 focus 兼容规则权重较高；非禁用 error 必须最终覆盖 focus。
+    .el-input-number:not(.is-disabled) .el-input__wrapper,
+    .el-input-number.el-input__wrapper:not(.is-disabled) {
+      box-shadow:
+        0 0 0 1px var(--el-color-danger, #f56c6c) inset !important;
+    }
+
+    // 过渡版双 wrapper 由外层表达 error，内层不得出现第二道危险色边框。
+    .el-input-number.el-input__wrapper:not(.is-disabled)
+      > .el-input
+      > .el-input__wrapper {
+      box-shadow: none !important;
+    }
   }
 }
 

package/styles/vendors/_base-query-toolbar.scss

@@ -354,7 +354,7 @@
   cursor: not-allowed !important;
 }
 
-// ── 下拉菜单按钮（工具栏内的 el-dropdown 触发器）────────────────────────────
+// ── 工具栏下拉 / 分裂按钮 ──────────────────────────────────────────────────
 .base-toolbar-box .el-dropdown > .el-button,
 .base-toolbar-box .el-button-group .el-button {
   height: 24px !important;
@@ -363,25 +363,68 @@
   font-weight: 500;
 }
 
-.base-toolbar-box .el-button-group {
+// BaseToolbar 仅在“主动作有 onClick 且还有 children”时生成 split-button。
+// 精确限定 action-button-wrap，避免影响页面自行编排的普通 el-button-group。
+.base-toolbar-box
+  .action-button-wrap
+  > .el-dropdown
+  > .el-button-group {
   display: inline-flex !important;
   align-items: center !important;
   vertical-align: middle !important;
+  gap: 0 !important;
+  overflow: hidden;
+  border-radius: var(--el-border-radius-base) !important;
 
-  .el-button {
+  > .el-button {
     border-radius: 0 !important;
     margin: 0 !important;
+    box-shadow: none !important;
   }
 
-  .el-button:first-child {
+  > .el-button:first-child {
     border-top-left-radius: var(--el-border-radius-base) !important;
     border-bottom-left-radius: var(--el-border-radius-base) !important;
+    border-top-right-radius: 0 !important;
+    border-bottom-right-radius: 0 !important;
+    border-right-color: transparent !important;
   }
 
-  .el-button:last-child {
+  > .el-button.el-dropdown__caret-button {
+    width: 24px !important;
+    min-width: 24px !important;
+    padding: 0 !important;
+    margin-left: 0 !important;
+    border-left: 0 !important;
+    border-top-left-radius: 0 !important;
+    border-bottom-left-radius: 0 !important;
     border-top-right-radius: var(--el-border-radius-base) !important;
     border-bottom-right-radius: var(--el-border-radius-base) !important;
-    margin-left: -1px !important;
+
+    // Element Plus 默认用 ::before 画分割线，会让箭头看起来像独立色块。
+    &::before {
+      display: none !important;
+      content: none !important;
+    }
+  }
+
+  // 鼠标或键盘进入任一分段时，两段同步使用同一状态色，视觉保持一个按钮。
+  &:hover > .el-button:not(.is-disabled):not([disabled]),
+  &:focus-within > .el-button:not(.is-disabled):not([disabled]) {
+    color: var(--el-button-hover-text-color) !important;
+    border-color: var(--el-button-hover-border-color) !important;
+    background-color: var(--el-button-hover-bg-color) !important;
+  }
+
+  &:hover > .el-button:first-child:not(.is-disabled):not([disabled]),
+  &:focus-within > .el-button:first-child:not(.is-disabled):not([disabled]) {
+    border-right-color: transparent !important;
+  }
+
+  &:active > .el-button:not(.is-disabled):not([disabled]) {
+    color: var(--el-button-active-text-color, #ffffff) !important;
+    border-color: var(--el-button-active-border-color) !important;
+    background-color: var(--el-button-active-bg-color) !important;
   }
 }
 
@@ -393,23 +436,84 @@
   margin: 0 !important;
 }
 
-.el-dropdown-menu .el-dropdown-menu__item {
+// BaseToolbar V1 会在 action-dropdown-menu 的 item 内再渲染一个 jh-button。
+// 只扁平化这个已知结构，不影响普通 el-dropdown 和业务自定义下拉。
+html body .el-dropdown-menu.action-dropdown-menu .el-dropdown-menu__item {
   display: flex;
   align-items: center;
   gap: 6px;
   min-height: 28px;
   line-height: 1.3;
+  padding: 0 !important;
   color: var(--el-text-color-regular, #606266);
 }
 
-.el-dropdown-menu .el-dropdown-menu__item:hover,
-.el-dropdown-menu .el-dropdown-menu__item:focus {
+html
+  body
+  .el-dropdown-menu.action-dropdown-menu
+  .el-dropdown-menu__item
+  > .el-button {
+  width: 100% !important;
+  height: 28px !important;
+  min-height: 28px !important;
+  justify-content: flex-start !important;
+  margin: 0 !important;
+  padding: 0 10px !important;
+  border: 0 !important;
+  border-radius: inherit !important;
+  color: inherit !important;
+  background: transparent !important;
+  box-shadow: none !important;
+  font-size: 12px !important;
+  font-weight: 400 !important;
+  line-height: 1.3 !important;
+  transform: none !important;
+}
+
+html
+  body
+  .el-dropdown-menu.action-dropdown-menu
+  .el-dropdown-menu__item
+  > .el-button:hover,
+html
+  body
+  .el-dropdown-menu.action-dropdown-menu
+  .el-dropdown-menu__item
+  > .el-button:focus,
+html
+  body
+  .el-dropdown-menu.action-dropdown-menu
+  .el-dropdown-menu__item
+  > .el-button:active {
+  color: inherit !important;
+  border: 0 !important;
+  background: transparent !important;
+  box-shadow: none !important;
+  transform: none !important;
+}
+
+html
+  body
+  .el-dropdown-menu.action-dropdown-menu
+  .el-dropdown-menu__item:not(.is-disabled):hover,
+html
+  body
+  .el-dropdown-menu.action-dropdown-menu
+  .el-dropdown-menu__item:not(.is-disabled):focus {
   color: var(--el-color-primary, #002a8f) !important;
   background-color: rgba(var(--el-color-primary-rgb), 0.08) !important;
 }
 
-.el-dropdown-menu .el-dropdown-menu__item .el-icon,
-.el-dropdown-menu .el-dropdown-menu__item svg {
+html
+  body
+  .el-dropdown-menu.action-dropdown-menu
+  .el-dropdown-menu__item
+  .el-icon,
+html
+  body
+  .el-dropdown-menu.action-dropdown-menu
+  .el-dropdown-menu__item
+  svg {
   color: currentColor !important;
   fill: currentColor;
   flex: 0 0 auto;