refactor(editor): edgeless toolbar chevron down icon (#10898)

blocksuite/affine/blocks/block-root/src/edgeless/configs/toolbar/alignment.ts

@@ -4,6 +4,7 @@ import {
   EdgelessCRUDIdentifier,
   updateXYWH,
 } from '@blocksuite/affine-block-surface';
+import { EditorChevronDown } from '@blocksuite/affine-components/toolbar';
 import type { ToolbarContext } from '@blocksuite/affine-shared/services';
 import type { GfxModel } from '@blocksuite/block-std/gfx';
 import { Bound } from '@blocksuite/global/gfx';
@@ -14,7 +15,6 @@ import {
   AlignRightIcon,
   AlignTopIcon,
   AlignVerticalCenterIcon,
-  ArrowDownSmallIcon,
   AutoTidyUpIcon,
   DistributeHorizontalIcon,
   DistributeVerticalIcon,
@@ -272,7 +272,7 @@ export function renderAlignmentMenu(
           aria-label="${label}"
           .tooltip="${tooltip ?? label}"
         >
-          ${icon} ${ArrowDownSmallIcon()}
+          ${icon} ${EditorChevronDown}
         </editor-icon-button>
       `}
     >

blocksuite/affine/blocks/block-root/src/edgeless/configs/toolbar/text-common.ts

@@ -6,6 +6,7 @@ import {
   packColor,
   type PickColorEvent,
 } from '@blocksuite/affine-components/color-picker';
+import { EditorChevronDown } from '@blocksuite/affine-components/toolbar';
 import {
   DefaultTheme,
   FontFamily,
@@ -26,7 +27,6 @@ import {
 } from '@blocksuite/affine-shared/utils';
 import type { GfxModel } from '@blocksuite/block-std/gfx';
 import {
-  ArrowDownSmallIcon,
   TextAlignCenterIcon,
   TextAlignLeftIcon,
   TextAlignRightIcon,
@@ -157,7 +157,8 @@ export function createTextActions<
               >
                 <span class="label padding0" style=${styleMap(styleInfo)}
                   >Aa</span
-                >${ArrowDownSmallIcon()}
+                >
+                ${EditorChevronDown}
               </editor-icon-button>
             `}
           >
@@ -285,7 +286,7 @@ export function createTextActions<
                     'key'
                   )}
                 </span>
-                ${ArrowDownSmallIcon()}
+                ${EditorChevronDown}
               </editor-icon-button>
             `}
           >

blocksuite/affine/blocks/block-root/src/edgeless/configs/toolbar/utils.ts

@@ -1,5 +1,5 @@
+import { EditorChevronDown } from '@blocksuite/affine-components/toolbar';
 import type { ToolbarContext } from '@blocksuite/affine-shared/services';
-import { ArrowDownSmallIcon } from '@blocksuite/icons/lit';
 import { html } from 'lit';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { repeat } from 'lit/directives/repeat.js';
@@ -31,7 +31,7 @@ export function renderMenu<T>({
           .tooltip="${tooltip ?? label}"
         >
           ${icon ?? renderCurrentMenuItemWith(items, currentValue, 'icon')}
-          ${ArrowDownSmallIcon()}
+          ${EditorChevronDown}
         </editor-icon-button>
       `}
     >