Deprecate ActionMenu v1 & Promote drafts/ActionMenu v2

.changeset/deprecate-actionmenuv1-promote-actionmenuv2.md

@@ -0,0 +1,67 @@
+---
+'@primer/react': major
+---
+
+### ActionMenu
+
+ActionMenu now ships a composable API that utilises ActionList
+
+See full list of props and examples: https://primer.style/react/ActionMenu
+
+Main changes:
+
+1. Instead of using `items` prop, use `ActionList` inside `ActionMenu`
+2. Instead of using `anchorContent` on `ActionMenu`, use `ActionMenu.Button` with `children`
+3. Instead of using `onAction` prop on `ActionMenu`, use `onSelect` prop on `ActionList.Item`
+4. Instead of using `groupMetadata` on `ActionMenu`, use `ActionList.Group`
+5. Instead of `overlayProps` on `ActionMenu`, use `ActionMenu.Overlay`
+
+<table>
+<tr>
+<th> Before </th> <th> After </th>
+</tr>
+<tr>
+<td valign="top">
+
+```jsx
+<ActionMenu
+ anchorContent="Menu"
+ onAction={fn}
+ items={[
+ {text: 'New file'},
+ {text: 'Copy link'},
+ {text: 'Edit file'},
+ ActionMenu.Divider,
+ {text: 'Delete file', variant: 'danger'}
+ ]}
+ overlayProps={{width: 'small'}}
+/>
+```
+
+ </td>
+<td valign="top">
+
+```jsx
+<ActionMenu>
+ <ActionMenu.Button>Menu</ActionMenu.Button>
+ <ActionMenu.Overlay width="small">
+ <ActionList>
+ <ActionList.Item onSelect={fn}>New file</ActionList.Item>
+ <ActionList.Item>Copy link</ActionList.Item>
+ <ActionList.Item>Edit file</ActionList.Item>
+ <ActionList.Divider />
+ <ActionList.Item variant="danger">Delete file</ActionList.Item>
+ </ActionList>
+ </ActionMenu.Overlay>
+</ActionMenu>
+```
+
+</td>
+</tr>
+</table>
+
+To continue to use the deprecated API for now, change the import path to `@primer/react/deprecated`:
+
+```js
+import {ActionMenu} from '@primer/react/deprecated'
+```

.changeset/empty-pillows-hunt.md

@@ -2,4 +2,151 @@
 '@primer/react': major
 ---
 
-Prepare library for `v35`
+### ActionList
+
+ActionList now ships a composable API.
+
+See full list of props and examples: https://primer.style/react/ActionList
+
+<table>
+<tr>
+<th> Before </th> <th> After </th>
+</tr>
+<tr>
+<td valign="top">
+
+```jsx
+<ActionList
+ items={[
+ {text: 'New file'},
+ {text: 'Copy link'},
+ {text: 'Edit file'},
+ ActionList.Divider,
+ {text: 'Delete file', variant: 'danger'}
+ ]}
+/>
+```
+
+ </td>
+<td valign="top">
+
+```jsx
+<ActionList>
+ <ActionList.Item>New file</ActionList.Item>
+ <ActionList.Item>Copy link</ActionList.Item>
+ <ActionList.Item>Edit file</ActionList.Item>
+ <ActionList.Divider />
+ <ActionList.Item variant="danger">Delete file</ActionList.Item>
+</ActionList>
+```
+
+</td>
+</tr>
+<tr>
+<td valign="top">
+
+```jsx
+<ActionList
+ showItemDividers
+ items={[
+ {
+ key: '0',
+ leadingVisual: LinkIcon,
+ text: 'github/primer'
+ },
+ {
+ key: '1',
+ leadingVisual: () => <Avatar src="https://github.com/mona.png" />,
+ text: 'mona',
+ description: 'Monalisa Octocat',
+ descriptionVariant: 'block'
+ },
+ {
+ key: '2',
+ leadingVisual: GearIcon,
+ text: 'View Settings',
+ trailingVisual: ArrowRightIcon
+ }
+ ]}
+/>
+```
+
+ </td>
+<td valign="top">
+
+```jsx
+<ActionList showDividers>
+ <ActionList.Item>
+ <ActionList.LeadingVisual>
+ <LinkIcon />
+ </ActionList.LeadingVisual>
+ github/primer
+ </ActionList.Item>
+ <ActionList.Item>
+ <ActionList.LeadingVisual>
+ <Avatar src="https://github.com/mona.png" />
+ </ActionList.LeadingVisual>
+ mona
+ <ActionList.Description variant="block">Monalisa Octocat</ActionList.Description>
+ </ActionList.Item>
+ <ActionList.Item>
+ <ActionList.LeadingVisual>
+ <GearIcon />
+ </ActionList.LeadingVisual>
+ View settings
+ <ActionList.TrailingVisual>
+ <ArrowRightIcon />
+ </ActionList.TrailingVisual>
+ </ActionList.Item>
+</ActionList>
+```
+
+</td>
+</tr>
+<tr>
+<td valign="top">
+
+```jsx
+<ActionList
+ groupMetadata={[
+ {groupId: '0', header: {title: 'Live query'}},
+ {groupId: '1', header: {title: 'Layout'}}
+ ]}
+ items={[
+ {key: '0', text: 'repo:github/github', groupId: '0'},
+ {key: '1', text: 'Table', groupId: '1'},
+ {key: '2', text: 'Board', groupId: '1'},
+ {key: '3', text: 'View settings'}
+ ]}
+/>
+```
+
+ </td>
+<td valign="top">
+
+```jsx
+<ActionList>
+ <ActionList.Group title="Live query">
+ <ActionList.Item>repo:github/github</ActionList.Item>
+ </ActionList.Group>
+ <ActionList.Divider />
+
+ <ActionList.Group title="Layout">
+ <ActionList.Item>Table</ActionList.Item>
+ <ActionList.Item>Board Description></ActionList.Item>
+ </ActionList.Group>
+ <ActionList.Divider />
+
+ <ActionList.Item>View settings</ActionList.Item>
+</ActionList>
+```
+
+</td>
+</tr>
+</table>
+
+To continue to use the deprecated API for now, change the import path to `@primer/react/deprecated`:
+
+```js
+import {ActionList} from '@primer/react/deprecated'
+```