diff --git a/CHANGELOG.md b/CHANGELOG.md
index e64fa70b4220424062977bff5e54814a17c51196..5ea52edd036c22bdbd0cfd266f5e3fa4b31042a5 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -11,6 +11,7 @@
 
 - 新增markdown编辑器支持预览Mermaid流程图
 - 新增行内AI聊天组件异步请求，展示思考内容
+- 复合表单项扩展组件补充显示图标
 
 ### Changed
 
diff --git a/src/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.controller.ts b/src/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.controller.ts
index 76a5261b895e936f6d4c69e9f4fbc9d5622c6048..aae8f59f05d501007e642d1b69b7e841e85fec36 100644
--- a/src/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.controller.ts
+++ b/src/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.controller.ts
@@ -5,7 +5,12 @@ import {
   generateRules,
   getEditorProvider,
 } from '@ibiz-template/runtime';
-import { ICodeListEditor, IEditor, IEditorItem } from '@ibiz/model-core';
+import {
+  ICodeListEditor,
+  IEditor,
+  IEditorItem,
+  ISysImage,
+} from '@ibiz/model-core';
 import Schema from 'async-validator';
 import { CompositeFormItemExState } from './composite-form-item-ex.state';
 
@@ -32,10 +37,15 @@ export class CompositeFormItemExController extends FormItemController {
 
   /**
    * @description 切换菜单选项
-   * @type {{ id: string; name: string; editor?: IData }[]}
+   * @type {{ id: string; name: string; icon?: ISysImage, editor?: IData }[]}
    * @memberof CompositeFormItemExController
    */
-  switchOptions: { id: string; name: string; editor?: IData }[] = [];
+  switchOptions: {
+    id: string;
+    name: string;
+    icon?: ISysImage;
+    editor?: IData;
+  }[] = [];
 
   /**
    * @description 值项
@@ -62,6 +72,7 @@ export class CompositeFormItemExController extends FormItemController {
           return {
             id: item.value as string,
             name: item.text,
+            icon: item.sysImage,
             editor: item.data,
           };
         });
diff --git a/src/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.scss b/src/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.scss
index f9999d2a5415abf0af73bf6014f2506a59597561..b586be0727de714e83c342adc4179424c599f7fe 100644
--- a/src/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.scss
+++ b/src/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.scss
@@ -3,13 +3,16 @@ $composite-form-item-ex: (
   'menu-right': 0,
   'menu-text-color': getCssVar(color, text, 2),
   'menu-font-size': getCssVar(font-size, regular),
-  'menu-width': 80px,
+  'menu-width': 120px,
   'menu-height': getCssVar('height-control', 'default'),
   'menu-icon-gap': getCssVar('spacing', 'extra-tight'),
   'menu-z-index': 9,
-  'menu-padding': 0 getCssVar('spacing', 'tight'),
+  'menu-padding': 0 getCssVar('spacing', 'base-tight'),
   'menu-item-padding': getCssVar('spacing', 'extra-tight'),
   'menu-item-hover-bg-color': getCssVar(color, fill, 0),
+  'menu-bg-color': getCssVar(color, bg, 3),
+  'menu-text-icon-size': getCssVar('font-size', 'header-6'),
+  'menu-content-padding': getCssVar('spacing', 'base-tight'),
   'loading-min-height': calc(var(--el-loading-spinner-size) + getCssVar('spacing', 'tight')),
 );
 
@@ -31,6 +34,30 @@ $composite-form-item-ex: (
     font-size: getCssVar('composite-form-item-ex', 'menu-font-size');
     color: getCssVar('composite-form-item-ex', 'menu-text-color');
     cursor: pointer;
+    background: getCssVar('composite-form-item-ex', 'menu-bg-color');
+
+    @include e(text-icon) {
+      display: flex;
+      flex: 0 0 auto;
+      align-items: center;
+      justify-content: center;
+      width: 1em;
+      height: 1em;
+      margin-right: getCssVar('composite-form-item-ex', 'menu-icon-gap');
+      font-size: getCssVar('composite-form-item-ex', 'menu-text-icon-size');
+  
+      .#{bem('icon')} {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+  
+        svg {
+          width: 1em;
+          height: 1em;
+          fill: currentcolor;
+        }
+      }
+    }
 
     @include e(text) {
       flex: 1 1 0;
@@ -66,6 +93,12 @@ $composite-form-item-ex: (
 
 @include b(composite-form-item-ex-menu-popover) {
   @include set-component-css-var('composite-form-item-ex', $composite-form-item-ex);
+
+  &.el-popover.el-popper {
+    width: getCssVar('composite-form-item-ex', 'menu-width') !important;
+    min-width: getCssVar('composite-form-item-ex', 'menu-width');
+    padding: getCssVar('composite-form-item-ex', 'menu-content-padding');
+  }
 }
 
 @include b(composite-form-item-ex-menu-content) {
@@ -91,6 +124,29 @@ $composite-form-item-ex: (
     fill: currentcolor;
   }
 
+  @include e(text-icon) {
+    display: flex;
+    flex: 0 0 auto;
+    align-items: center;
+    justify-content: center;
+    width: 1em;
+    height: 1em;
+    margin-right: getCssVar('composite-form-item-ex', 'menu-icon-gap');
+    font-size: getCssVar('composite-form-item-ex', 'menu-text-icon-size');
+
+    .#{bem('icon')} {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+
+      svg {
+        width: 1em;
+        height: 1em;
+        fill: currentcolor;
+      }
+    }
+  }
+
   @include e(text) {
     flex: 1 1 0;
     min-width: 0;
diff --git a/src/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.tsx b/src/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.tsx
index 295477eaa1ef05eba5459ec9bd93a972ac74f0dc..be1993e2c043f1ee9ca2b471fbbfdbb28611c45a 100644
--- a/src/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.tsx
+++ b/src/control/form/form-detail/form-item/composite-form-item-ex/composite-form-item-ex.tsx
@@ -82,13 +82,23 @@ export const CompositeFormItemEx = defineComponent({
 
     // 编辑器切换菜单
     const editorSwitchMenu = (
-      <el-popover trigger='click' popper-class={this.ns2.b('menu-popover')}>
+      <el-popover
+        trigger='click'
+        popper-class={this.ns2.b('menu-popover')}
+        offset={0}
+      >
         {{
           reference: () => {
+            const option = this.c.switchOptions.find(
+              item => item.id === this.c.state.editorId,
+            );
             return (
               <div class={this.ns2.b('menu')}>
+                <div class={this.ns2.be('menu', 'text-icon')}>
+                  <iBizIcon icon={option?.icon}></iBizIcon>
+                </div>
                 <div class={this.ns2.be('menu', 'text')}>
-                  {this.c.state.editorId}
+                  {option?.name || this.c.state.editorId}
                 </div>
                 <div class={this.ns2.be('menu', 'icon')}>
                   <svg
@@ -127,6 +137,9 @@ export const CompositeFormItemEx = defineComponent({
                       >
                         <path d='M574.116299 786.736392 1238.811249 48.517862C1272.390222 11.224635 1329.414799 7.827718 1366.75664 41.450462 1403.840015 74.840484 1406.731043 132.084741 1373.10189 169.433699L655.118888 966.834607C653.072421 969.716875 650.835807 972.514337 648.407938 975.210759 615.017957 1012.29409 558.292155 1015.652019 521.195664 982.250188L72.778218 578.493306C35.910826 545.297758 32.859041 488.584019 66.481825 451.242134 99.871807 414.158803 156.597563 410.800834 193.694055 444.202665L574.116299 786.736392Z'></path>
                       </svg>
+                      <div class={this.ns2.be('menu-item', 'text-icon')}>
+                        <iBizIcon icon={option.icon}></iBizIcon>
+                      </div>
                       <span class={this.ns2.be('menu-item', 'text')}>
                         {option.name}
                       </span>
diff --git a/src/editor/html/wang-editor/wang-editor.scss b/src/editor/html/wang-editor/wang-editor.scss
index 4359b837542fbbb841ec18e7e97d755d29d583ca..c6ad68b295388c2c91ffa42360ff86203b265f5e 100644
--- a/src/editor/html/wang-editor/wang-editor.scss
+++ b/src/editor/html/wang-editor/wang-editor.scss
@@ -103,7 +103,9 @@ $html: (
     }
 
     @include b(composite-form-item-ex-menu) {
-      #{getCssVarName('composite-form-item-ex', 'menu-height')}: 41px;
+      #{getCssVarName('composite-form-item-ex', 'menu-height')}: 40px;
+      position: relative;
+      max-height: 100%;
     }
 
     @include b('html-toolbar') {
@@ -111,6 +113,18 @@ $html: (
         padding-right: getCssVar('composite-form-item-ex', 'menu-width');
       }
     }
+
+    @include b(html-menu) {
+      position: absolute;
+      top: 2px;
+      right: 1px;
+      z-index: getCssVar('composite-form-item-ex', 'menu-z-index');
+      display: flex;
+      align-items: center;
+      height: calc(getCssVar('html', 'toolbar-height') - 1px);
+      background: getCssVar('composite-form-item-ex', 'menu-bg-color');
+      border-left: 1px solid getCssVar(color, border);
+    }
   }  
 }
 
diff --git a/src/editor/html/wang-editor/wang-editor.tsx b/src/editor/html/wang-editor/wang-editor.tsx
index 12ae51635d6f6e98124222e7e7d400aacc45c276..456818308d22cff61e6fabc7454032f5e644fb12 100644
--- a/src/editor/html/wang-editor/wang-editor.tsx
+++ b/src/editor/html/wang-editor/wang-editor.tsx
@@ -808,6 +808,7 @@ const IBizHtml = defineComponent({
                   entries[0].contentRect.height +
                   (height !== 0 ? 300 : 0)
                 }px`,
+                'toolbar-height': `${height}px`,
               };
               cssVars.value = ns.cssVarBlock(tempCssVars);
               lastToolbarHeight = height;
@@ -980,7 +981,9 @@ const IBizHtml = defineComponent({
           ref='htmlContent'
           style={cssVars.value}
         >
-          {slots.editorSwitchMenu?.()}
+          {slots.editorSwitchMenu ? (
+            <div class={ns.b('menu')}>{slots.editorSwitchMenu()}</div>
+          ) : null}
           <Toolbar
             ref='toolbarRef'
             editor={editorRef.value}
diff --git a/src/editor/markdown/ibiz-markdown-editor/ibiz-markdown-editor.scss b/src/editor/markdown/ibiz-markdown-editor/ibiz-markdown-editor.scss
index fbcbe13409f4f7b5ba712969ecbb862c70b881ef..cde08d8bc6ffe7c968432be3e37d5f2b36475bfc 100644
--- a/src/editor/markdown/ibiz-markdown-editor/ibiz-markdown-editor.scss
+++ b/src/editor/markdown/ibiz-markdown-editor/ibiz-markdown-editor.scss
@@ -221,18 +221,27 @@ $markdown: (
 
   @include when('show-editor-switch-menu') {
     .#{bem(composite-form-item-ex-menu)} {
-      #{getCssVarName('composite-form-item-ex', 'menu-height')}: 48px;
+      #{getCssVarName('composite-form-item-ex', 'menu-height')}: 47px;
       #{getCssVarName('composite-form-item-ex', 'menu-padding')}: getCssVar('spacing', 'tight') getCssVar('spacing', 'tight') 0;
+      max-height: 100%;
     }
 
     .cherry-toolbar {
-      padding-right: getCssVar('composite-form-item-ex', 'menu-width');
+      padding-right: calc(getCssVar('composite-form-item-ex', 'menu-width') + 36px);
     }
 
     .#{bem(markdown-menu)} {
       position: absolute;
-      top: 0;
-      right: 0;
+      top: 1px;
+      right: 37px;
+      z-index: getCssVar('composite-form-item-ex', 'menu-z-index');
+      display: flex;
+      align-items: center;
+      height: calc(getCssVar('markdown', 'toolbar-height') - 1px);
+      background: getCssVar('composite-form-item-ex', 'menu-bg-color');
+      border-right: 1px solid getCssVar(color, border);
+      border-left: 1px solid getCssVar(color, border);
+
 
       @include when('fullscreen'){
         position: fixed;
diff --git a/src/editor/markdown/ibiz-markdown-editor/ibiz-markdown-editor.tsx b/src/editor/markdown/ibiz-markdown-editor/ibiz-markdown-editor.tsx
index 12a713f726ab7f78bbd297c88b65a38003db94e6..aed0214ce3c784017c7744112a8603c3cf35562a 100644
--- a/src/editor/markdown/ibiz-markdown-editor/ibiz-markdown-editor.tsx
+++ b/src/editor/markdown/ibiz-markdown-editor/ibiz-markdown-editor.tsx
@@ -97,12 +97,18 @@ const IBizMarkDown: any = defineComponent({
     // 浏览器ResizeObserver对象
     let resizeObserver: ResizeObserver | null = null;
 
+    // 工具栏ResizeObserver对象
+    let toolbarResizeObserver: ResizeObserver | null = null;
+
     // 上次监听到的markdown外层宽度，一旦发生变化就重新计算
     let lastMarkDownWidth = 0;
 
     // 样式变量
     const cssVars = ref({});
 
+    // 工具栏样式变量
+    const toolbarCssVars = ref({});
+
     // 正常大小时目录状态
     const lastDirectoryState: Ref<'full' | 'pure'> = ref('full');
 
@@ -529,6 +535,24 @@ const IBizMarkDown: any = defineComponent({
         parentElement?.appendChild(span);
         c?.setMDEditor(editor);
         onMDEditorCreated(editor);
+        if (
+          slots.editorSwitchMenu &&
+          window.ResizeObserver &&
+          markDownBox.value
+        ) {
+          const cherryToolbar = markDownBox.value.querySelector(
+            '.cherry-toolbar',
+          ) as HTMLElement | undefined;
+          if (cherryToolbar) {
+            toolbarResizeObserver = new ResizeObserver(entries => {
+              const height = entries[0]?.contentRect.height;
+              toolbarCssVars.value = ns.cssVarBlock({
+                'toolbar-height': `${height}px`,
+              });
+            });
+            toolbarResizeObserver.observe(cherryToolbar);
+          }
+        }
       });
     };
 
@@ -672,7 +696,10 @@ const IBizMarkDown: any = defineComponent({
     // 绘制编辑器切换菜单
     const renderEditorSwitchMenu = () => {
       return (
-        <div class={[ns.b('menu'), ns.is('fullscreen', isFullScreen.value)]}>
+        <div
+          class={[ns.b('menu'), ns.is('fullscreen', isFullScreen.value)]}
+          style={toolbarCssVars.value}
+        >
           {slots.editorSwitchMenu?.()}
         </div>
       );
@@ -696,6 +723,9 @@ const IBizMarkDown: any = defineComponent({
       if (resizeObserver) {
         resizeObserver.disconnect();
       }
+      if (toolbarResizeObserver) {
+        toolbarResizeObserver.disconnect();
+      }
       if (chatInstance && chatInstance.close) {
         chatInstance.close();
       }