Banner: Fix alignment of secondary action without primary action

.changeset/flat-weeks-battle.md

@@ -0,0 +1,5 @@
+---
+"@primer/react": patch
+---
+
+Banner: Fix alignment of secondary action without primary action

e2e/components/Banner.test.ts

@@ -56,6 +56,11 @@ const stories: Array<{title: string; id: string; viewports?: Array<keyof typeof
     id: 'experimental-components-banner-features--dismissible-with-hidden-title-and-actions',
     viewports: ['primer.breakpoint.xs', 'primer.breakpoint.sm'],
   },
+  {
+    title: 'DismissibleWithHiddenTitleAndSecondaryAction',
+    id: 'experimental-components-banner-features--dismissible-with-hidden-title-and-secondary-action',
+    viewports: ['primer.breakpoint.xs', 'primer.breakpoint.sm'],
+  },
   {
     title: 'InSidebar',
     id: 'experimental-components-banner-examples--in-sidebar',

packages/react/src/Banner/Banner.features.stories.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import {CopilotIcon} from '@primer/octicons-react'
+import {CopilotIcon, GitPullRequestIcon} from '@primer/octicons-react'
 import {action} from '@storybook/addon-actions'
 import type {Meta} from '@storybook/react'
 import {Banner} from '../Banner'
@@ -206,6 +206,27 @@ export const DismissibleWithHiddenTitleAndActions = () => {
   )
 }
 
+export const DismissibleWithHiddenTitleAndSecondaryAction = () => {
+  return (
+    <Banner
+      title="Warning"
+      hideTitle
+      description={
+        <>
+          GitHub users are{' '}
+          <Link inline underline href="#">
+            now required
+          </Link>{' '}
+          to enable two-factor authentication as an additional security measure.
+        </>
+      }
+      onDismiss={action('onDismiss')}
+      variant="warning"
+      secondaryAction={<Banner.SecondaryAction leadingVisual={GitPullRequestIcon}>Button</Banner.SecondaryAction>}
+    />
+  )
+}
+
 export const WithActions = () => {
   return (
     <Banner

packages/react/src/Banner/Banner.module.css

@@ -186,6 +186,7 @@
 
   .BannerActions [data-primary-action='trailing'] {
     display: flex;
+    min-height: var(--base-size-32, 2rem);
   }
 
   .BannerActions [data-primary-action='leading'] {

packages/react/src/Banner/Banner.tsx

@@ -393,6 +393,7 @@ const BannerContainerQuery = `
 
     .BannerActions [data-primary-action="trailing"] {
       display: flex;
+      min-height: var(--base-size-32, 2rem);
     }
 
     .BannerActions [data-primary-action="leading"] {