Update IconButton and Button tooltips to be sibling instead of child (#…

…1265)

* wrapping the icon_button with a span

* Also wrapping button component

* Create honest-pants-matter.md

* wrong system argument

.changeset/honest-pants-matter.md

@@ -0,0 +1,5 @@
+---
+"@primer/view-components": patch
+---
+
+Update IconButton and Button tooltips to be sibling instead of child

app/components/primer/button_component.html.erb

@@ -1,4 +1,12 @@
-<%= render Primer::Beta::BaseButton.new(**@system_arguments) do -%>
-  <%= leading_visual %><%= trimmed_content %><%= trailing_visual %><%= primer_octicon("triangle-down", ml: 2, mr: -1) if @dropdown %>
-  <%= tooltip %>
-<% end -%>
+<% if tooltip.present? %>
+  <%= render Primer::BaseComponent.new(tag: :div, position: :relative, display: :inline_block) do %>
+    <%= render Primer::Beta::BaseButton.new(**@system_arguments) do -%>
+      <%= leading_visual %><%= trimmed_content %><%= trailing_visual %><%= primer_octicon("triangle-down", ml: 2, mr: -1) if @dropdown %>
+    <% end -%>
+    <%= tooltip %>
+  <% end -%>
+<% else %>
+  <%= render Primer::Beta::BaseButton.new(**@system_arguments) do -%>
+    <%= leading_visual %><%= trimmed_content %><%= trailing_visual %><%= primer_octicon("triangle-down", ml: 2, mr: -1) if @dropdown %>
+  <% end -%>
+<% end %>

app/components/primer/icon_button.html.erb

@@ -0,0 +1,6 @@
+<%= render Primer::BaseComponent.new(tag: :div, position: :relative, display: :inline_block) do %>
+  <%= render Primer::Beta::BaseButton.new(**@system_arguments) do -%>
+    <%= render Primer::OcticonComponent.new(icon: @icon) %>
+  <% end -%>
+  <%= render Primer::Alpha::Tooltip.new(**@tooltip_arguments) %>
+<% end %>