Add size prop to ActionList.LinkItem (#6470)

Co-authored-by: copilot-swe-agent[bot] <[email protected]>
Co-authored-by: dylanatsmith <[email protected]>

Author: Copilot

.changeset/add-actionlist-linkitem-size-prop.md

@@ -0,0 +1,5 @@
+---
+'@primer/react': minor
+---
+
+Add `size` prop to ActionList.LinkItem component. The `size` prop accepts `'medium'` (default) or `'large'` values and provides the same styling options as ActionList.Item for consistent sizing across ActionList components.

packages/react/src/ActionList/ActionList.stories.tsx

@@ -227,6 +227,7 @@ LinkItemPlayground.args = {
   disabled: false,
   id: 'item-1',
   variant: 'default',
+  size: 'medium',
   inactiveText: '',
   leadingVisual: null,
   loading: false,
@@ -242,6 +243,12 @@ LinkItemPlayground.argTypes = {
     control: 'radio',
     options: ['default', 'danger'],
   },
+  size: {
+    control: {
+      type: 'radio',
+    },
+    options: ['medium', 'large'],
+  },
   role: {
     type: 'string',
   },

packages/react/src/ActionList/ActionList.test.tsx

@@ -176,4 +176,23 @@ describe('ActionList', () => {
     expect(descriptions[1]).toHaveAttribute('title', 'Complex content')
     expect(descriptions[2]).not.toHaveAttribute('title')
   })
+
+  it('should support size prop on LinkItem', () => {
+    const {container} = HTMLRender(
+      <ActionList>
+        <ActionList.LinkItem href="//github.com" size="large">
+          Large Link Item
+        </ActionList.LinkItem>
+        <ActionList.LinkItem href="//github.com" size="medium">
+          Medium Link Item
+        </ActionList.LinkItem>
+        <ActionList.LinkItem href="//github.com">Default Link Item</ActionList.LinkItem>
+      </ActionList>,
+    )
+
+    const linkElements = container.querySelectorAll('a')
+    expect(linkElements[0]).toHaveAttribute('data-size', 'large')
+    expect(linkElements[1]).toHaveAttribute('data-size', 'medium')
+    expect(linkElements[2]).toHaveAttribute('data-size', 'medium') // default should be medium
+  })
 })

packages/react/src/ActionList/LinkItem.tsx

@@ -21,19 +21,20 @@ type LinkProps = {
 // LinkItem does not support selected, loading, variants, etc.
 export type ActionListLinkItemProps = Pick<
   ActionListItemProps,
-  'active' | 'children' | 'sx' | 'inactiveText' | 'variant'
+  'active' | 'children' | 'sx' | 'inactiveText' | 'variant' | 'size'
 > &
   LinkProps
 
 export const LinkItem = React.forwardRef(
-  ({sx, active, inactiveText, variant, as: Component, className, ...props}, forwardedRef) => {
+  ({sx, active, inactiveText, variant, size, as: Component, className, ...props}, forwardedRef) => {
     return (
       <Item
         className={className}
         active={active}
         inactiveText={inactiveText}
         data-inactive={inactiveText ? true : undefined}
         variant={variant}
+        size={size}
         sx={sx}
         _PrivateItemWrapper={({children, onClick, ...rest}) => {
           const clickHandler = (event: React.MouseEvent<HTMLElement>) => {