refactor(editor): group and expose parameters of createButtonPopper (#10999)

blocksuite/affine/fragments/fragment-frame-panel/src/header/frame-panel-header.ts

@@ -172,17 +172,15 @@ export class FramePanelHeader extends WithDisposable(LitElement) {
   override firstUpdated() {
     const disposables = this.disposables;
 
-    this._framesSettingMenuPopper = createButtonPopper(
-      this._frameSettingButton,
-      this._frameSettingMenu,
-      ({ display }) => {
+    this._framesSettingMenuPopper = createButtonPopper({
+      reference: this._frameSettingButton,
+      popperElement: this._frameSettingMenu,
+      stateUpdated: ({ display }) => {
         this._settingPopperShow = display === 'show';
       },
-      {
-        mainAxis: 14,
-        crossAxis: -100,
-      }
-    );
+      mainAxis: 14,
+      crossAxis: -100,
+    });
     disposables.add(this._framesSettingMenuPopper);
   }
 

blocksuite/affine/fragments/fragment-outline/src/card/outline-card.ts

@@ -152,17 +152,15 @@ export class OutlineNoteCard extends SignalWatcher(
   }
 
   override firstUpdated() {
-    this._displayModePopper = createButtonPopper(
-      this._displayModeButtonGroup,
-      this._displayModePanel,
-      ({ display }) => {
+    this._displayModePopper = createButtonPopper({
+      reference: this._displayModeButtonGroup,
+      popperElement: this._displayModePanel,
+      stateUpdated: ({ display }) => {
         this._showPopper$.value = display === 'show';
       },
-      {
-        mainAxis: 0,
-        crossAxis: -60,
-      }
-    );
+      mainAxis: 0,
+      crossAxis: -60,
+    });
 
     this.disposables.add(this._displayModePopper);
   }

blocksuite/affine/fragments/fragment-outline/src/header/outline-panel-header.ts

@@ -22,17 +22,15 @@ export class OutlinePanelHeader extends SignalWatcher(
   private readonly _settingPopperShow$ = signal(false);
 
   override firstUpdated() {
-    this._notePreviewSettingMenuPopper = createButtonPopper(
-      this._noteSettingButton,
-      this._notePreviewSettingMenu,
-      ({ display }) => {
+    this._notePreviewSettingMenuPopper = createButtonPopper({
+      reference: this._noteSettingButton,
+      popperElement: this._notePreviewSettingMenu,
+      stateUpdated: ({ display }) => {
         this._settingPopperShow$.value = display === 'show';
       },
-      {
-        mainAxis: 14,
-        crossAxis: -30,
-      }
-    );
+      mainAxis: 14,
+      crossAxis: -30,
+    });
     this.disposables.add(this._notePreviewSettingMenuPopper);
   }