diff --git a/libs/components/editor-plugins/src/menu/inline-menu/menu-item/DropdownItem.tsx b/libs/components/editor-plugins/src/menu/inline-menu/menu-item/DropdownItem.tsx
index a8de5a36e0..c7a34fb6fb 100644
--- a/libs/components/editor-plugins/src/menu/inline-menu/menu-item/DropdownItem.tsx
+++ b/libs/components/editor-plugins/src/menu/inline-menu/menu-item/DropdownItem.tsx
@@ -1,24 +1,24 @@
-import React, { useState, useCallback } from 'react';
-import style9 from 'style9';
-import {
-    Popover,
-    styled,
-    type SvgIconProps,
-    Tooltip,
-} from '@toeverything/components/ui';
 import {
     fontBgColorPalette,
     fontColorPalette,
 } from '@toeverything/components/common';
 import { ArrowDropDownIcon } from '@toeverything/components/icons';
-import type { DropdownItemType, WithEditorSelectionType } from '../types';
-import { uaHelper } from '@toeverything/utils';
 import {
-    inlineMenuNamesKeys,
+    Popover,
+    styled,
+    Tooltip,
+    type SvgIconProps,
+} from '@toeverything/components/ui';
+import { uaHelper } from '@toeverything/utils';
+import { useCallback, useState } from 'react';
+import style9 from 'style9';
+import {
     inlineMenuNamesForFontColor,
+    inlineMenuNamesKeys,
     MacInlineMenuShortcuts,
-    WinInlineMenuShortcuts
+    WinInlineMenuShortcuts,
 } from '../config';
+import type { DropdownItemType, WithEditorSelectionType } from '../types';
 
 type MenuDropdownItemProps = DropdownItemType & WithEditorSelectionType;
 
@@ -38,102 +38,100 @@ export const MenuDropdownItem = ({
         set_anchor_ele(null);
     }, []);
 
-    //@ts-ignore
-    const shortcut = uaHelper.isMacOs ? MacInlineMenuShortcuts[nameKey] : WinInlineMenuShortcuts[nameKey];
+    const shortcut = uaHelper.isMacOs
+        ? //@ts-ignore
+          MacInlineMenuShortcuts[nameKey]
+        : //@ts-ignore
+          WinInlineMenuShortcuts[nameKey];
 
     return (
-        <>
-            <Popover
-                trigger="click"
-                placement="bottom-start"
+        <Popover
+            trigger="click"
+            placement="bottom-start"
+            content={
+                <div className={styles('dropdownContainer')}>
+                    {children.map(item => {
+                        const {
+                            name,
+                            icon: ItemIcon,
+                            onClick,
+                            nameKey: itemNameKey,
+                        } = item;
+
+                        const StyledIcon = withStylesForIcon(ItemIcon);
+
+                        return (
+                            <button
+                                className={styles('dropdownItem')}
+                                key={name}
+                                onClick={() => {
+                                    if (
+                                        onClick &&
+                                        selectionInfo?.anchorNode?.id
+                                    ) {
+                                        onClick({
+                                            editor,
+                                            type: itemNameKey,
+                                            anchorNodeId:
+                                                selectionInfo?.anchorNode?.id,
+                                        });
+                                    }
+                                    handle_close_dropdown_menu();
+                                }}
+                            >
+                                <StyledIcon
+                                    fontColor={
+                                        nameKey ===
+                                        inlineMenuNamesKeys.currentFontColor
+                                            ? fontColorPalette[
+                                                  inlineMenuNamesForFontColor[
+                                                      itemNameKey as keyof typeof inlineMenuNamesForFontColor
+                                                  ]
+                                              ]
+                                            : nameKey ===
+                                              inlineMenuNamesKeys.currentFontBackground
+                                            ? fontBgColorPalette[
+                                                  inlineMenuNamesForFontColor[
+                                                      itemNameKey as keyof typeof inlineMenuNamesForFontColor
+                                                  ]
+                                              ]
+                                            : ''
+                                    }
+                                    // fontBgColor={
+                                    //     nameKey=== inlineMenuNamesKeys.currentFontBackground ?  fontBgColorPalette[
+                                    //         inlineMenuNamesForFontColor[itemNameKey] as keyof typeof fontBgColorPalette
+                                    //     ]:''
+                                    // }
+                                />
+                                {/* <ItemIcon sx={{ width: 20, height: 20 }} /> */}
+                                <span className={styles('dropdownItemItext')}>
+                                    {name}
+                                </span>
+                            </button>
+                        );
+                    })}
+                </div>
+            }
+        >
+            <Tooltip
                 content={
-                    <div className={styles('dropdownContainer')}>
-                        {children.map(item => {
-                            const {
-                                name,
-                                icon: ItemIcon,
-                                onClick,
-                                nameKey: itemNameKey,
-                            } = item;
-
-                            const StyledIcon = withStylesForIcon(ItemIcon);
-
-                            return (
-                                <button
-                                    className={styles('dropdownItem')}
-                                    key={name}
-                                    onClick={() => {
-                                        if (
-                                            onClick &&
-                                            selectionInfo?.anchorNode?.id
-                                        ) {
-                                            onClick({
-                                                editor,
-                                                type: itemNameKey,
-                                                anchorNodeId:
-                                                    selectionInfo?.anchorNode
-                                                        ?.id,
-                                            });
-                                        }
-                                        handle_close_dropdown_menu();
-                                    }}
-                                >
-                                    <StyledIcon
-                                        fontColor={
-                                            nameKey ===
-                                            inlineMenuNamesKeys.currentFontColor
-                                                ? fontColorPalette[
-                                                      inlineMenuNamesForFontColor[
-                                                          itemNameKey as keyof typeof inlineMenuNamesForFontColor
-                                                      ]
-                                                  ]
-                                                : nameKey ===
-                                                  inlineMenuNamesKeys.currentFontBackground
-                                                ? fontBgColorPalette[
-                                                      inlineMenuNamesForFontColor[
-                                                          itemNameKey as keyof typeof inlineMenuNamesForFontColor
-                                                      ]
-                                                  ]
-                                                : ''
-                                        }
-                                        // fontBgColor={
-                                        //     nameKey=== inlineMenuNamesKeys.currentFontBackground ?  fontBgColorPalette[
-                                        //         inlineMenuNamesForFontColor[itemNameKey] as keyof typeof fontBgColorPalette
-                                        //     ]:''
-                                        // }
-                                    />
-                                    {/* <ItemIcon sx={{ width: 20, height: 20 }} /> */}
-                                    <span
-                                        className={styles('dropdownItemItext')}
-                                    >
-                                        {name}
-                                    </span>
-                                </button>
-                            );
-                        })}
+                    <div style={{ padding: '2px 4px' }}>
+                        <p>{name}</p>
+                        {shortcut && <p>{shortcut}</p>}
                     </div>
                 }
+                placement="top"
+                trigger="hover"
             >
-                <Tooltip
-                    content={
-                        <div style={{ padding: '2px 4px' }}>
-                            <p>{name}</p>
-                            {shortcut && <p>{shortcut}</p>}
-                        </div>
-                    }
-                    placement="top"
-                    trigger="hover"
+                <button
+                    className={styles('currentDropdownButton')}
+                    aria-label={name}
                 >
-                    <button
-                        className={styles('currentDropdownButton')}
-                        aria-label={name}
-                    >
-                        <MenuIcon sx={{ width: 20, height: 20 }} />
-                        <ArrowDropDownIcon sx={{ width: 20, height: 20 }} />
-                    </button>
-                </Tooltip>
-            </Popover>
-        </>
+                    <MenuIcon sx={{ width: 20, height: 20 }} />
+                    <ArrowDropDownIcon sx={{ width: 20, height: 20 }} />
+                </button>
+            </Tooltip>
+        </Popover>
     );
 };
 
diff --git a/libs/components/editor-plugins/src/menu/inline-menu/menu-item/IconItem.tsx b/libs/components/editor-plugins/src/menu/inline-menu/menu-item/IconItem.tsx
index 5ded472e7d..c49efd82a9 100644
--- a/libs/components/editor-plugins/src/menu/inline-menu/menu-item/IconItem.tsx
+++ b/libs/components/editor-plugins/src/menu/inline-menu/menu-item/IconItem.tsx
@@ -1,10 +1,14 @@
 import React, { useCallback } from 'react';
 import style9 from 'style9';
 
-import type { IconItemType, WithEditorSelectionType } from '../types';
-import { inlineMenuNamesKeys, MacInlineMenuShortcuts, WinInlineMenuShortcuts } from '../config';
 import { Tooltip } from '@toeverything/components/ui';
 import { uaHelper } from '@toeverything/utils';
+import {
+    inlineMenuNamesKeys,
+    MacInlineMenuShortcuts,
+    WinInlineMenuShortcuts,
+} from '../config';
+import type { IconItemType, WithEditorSelectionType } from '../types';
 type MenuIconItemProps = IconItemType & WithEditorSelectionType;
 
 export const MenuIconItem = ({
@@ -36,7 +40,11 @@ export const MenuIconItem = ({
     );
 
     //@ts-ignore
-    const shortcut = uaHelper.isMacOs ? MacInlineMenuShortcuts[nameKey] : WinInlineMenuShortcuts[nameKey];
+    const shortcut = uaHelper.isMacOs
+        ? //@ts-ignore
+          MacInlineMenuShortcuts[nameKey]
+        : //@ts-ignore
+          WinInlineMenuShortcuts[nameKey];
 
     return (
         <Tooltip