ensure scroll position does not change when opening actionmenu

primer · Nov 30, 2023 · f6747be · f6747be
1 parent 57586da
commit f6747be
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 1 deletion.
diff --git a/app/components/primer/alpha/action_menu/action_menu_element.ts b/app/components/primer/alpha/action_menu/action_menu_element.ts
@@ -261,7 +261,7 @@ export class ActionMenuElement extends HTMLElement {
       this.#hide()
     } else {
       this.#show()
-      this.#firstItem?.focus()
+      setTimeout(() => this.#firstItem?.focus(), 10)
     }
   }
 

diff --git a/previews/primer/alpha/action_menu_preview.rb b/previews/primer/alpha/action_menu_preview.rb
@@ -323,6 +323,13 @@ def opens_dialog(menu_id: "menu-1")
                              })
       end
 
+      # @label In Scoll container
+      #
+      def in_scroll_container
+        render_with_template()
+      end
+
+
       # @label Align end
       #
       def align_end(menu_id: "menu-1")

diff --git a/previews/primer/alpha/action_menu_preview/in_scroll_container.html.erb b/previews/primer/alpha/action_menu_preview/in_scroll_container.html.erb
@@ -0,0 +1,11 @@
+<div style="height: 400px"></div>
+
+<div style="position: relative">
+  <%= render Primer::Alpha::ActionMenu.new(anchor_align: :end) do |c| %>
+    <% c.with_show_button { "Edit" } %>
+    <% c.with_item(tag: :button, type: "button", label: "Rename") %>
+    <% c.with_item(tag: :button, type: "button", scheme: :danger, label: "Remove") %>
+  <% end %>
+</div>
+
+<div style="height: 1400px"></div>