diff --git a/.changeset/modern-coins-destroy.md b/.changeset/modern-coins-destroy.md
deleted file mode 100644
index 6e9e045723f..00000000000
--- a/.changeset/modern-coins-destroy.md
+++ /dev/null
@@ -1,39 +0,0 @@
----
-"@primer/react": major
----
-
-Update PRC ActionList implementation to have similar semantics to PVC.
-* Removes `ActionList.Group`.
-* Adds `ActionList.Heading` to be used for labelling children in an `ActionList`.
-* Adds `heading` slot to `ActionList` for adding headings that label internal lists correctly.
-
-ActionList.Groups inside an ActionList generated inaccessible markup. Previous usage:
-```
-
-
- Create
- Read
- Update
- Delete
-
-
- ...
-
-
-```
-
-Instead, use `ActionList`s and stack them as needed.
-```
-
-```
diff --git a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-dark-colorblind-linux.png b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-dark-colorblind-linux.png
index e254d01f8ec..ca2a1de0d66 100644
Binary files a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-dark-colorblind-linux.png and b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-dark-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-dark-dimmed-linux.png b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-dark-dimmed-linux.png
index 98ebae34e1e..985067256bd 100644
Binary files a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-dark-dimmed-linux.png and b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-dark-dimmed-linux.png differ
diff --git a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-dark-high-contrast-linux.png b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-dark-high-contrast-linux.png
index 9bc8f5fdf00..490bd7677af 100644
Binary files a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-dark-high-contrast-linux.png and b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-dark-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-dark-linux.png b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-dark-linux.png
index c9bf7491e66..ca2a1de0d66 100644
Binary files a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-dark-linux.png and b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-dark-linux.png differ
diff --git a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-dark-tritanopia-linux.png b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-dark-tritanopia-linux.png
index e254d01f8ec..ca2a1de0d66 100644
Binary files a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-dark-tritanopia-linux.png and b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-dark-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-light-colorblind-linux.png b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-light-colorblind-linux.png
index 517576b742f..4a4d40b930e 100644
Binary files a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-light-colorblind-linux.png and b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-light-colorblind-linux.png differ
diff --git a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-light-high-contrast-linux.png b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-light-high-contrast-linux.png
index 14d4cd19201..f180036cd16 100644
Binary files a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-light-high-contrast-linux.png and b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-light-high-contrast-linux.png differ
diff --git a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-light-linux.png b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-light-linux.png
index 04de60b7160..4a4d40b930e 100644
Binary files a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-light-linux.png and b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-light-linux.png differ
diff --git a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-light-tritanopia-linux.png b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-light-tritanopia-linux.png
index 517576b742f..4a4d40b930e 100644
Binary files a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-light-tritanopia-linux.png and b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Groups-And-Descriptions-light-tritanopia-linux.png differ
diff --git a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-dark-colorblind-linux.png b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-dark-colorblind-linux.png
deleted file mode 100644
index 8c9edc27878..00000000000
Binary files a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-dark-colorblind-linux.png and /dev/null differ
diff --git a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-dark-dimmed-linux.png b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-dark-dimmed-linux.png
deleted file mode 100644
index a0987d81cb7..00000000000
Binary files a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-dark-dimmed-linux.png and /dev/null differ
diff --git a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-dark-high-contrast-linux.png b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-dark-high-contrast-linux.png
deleted file mode 100644
index 72cc4662a6d..00000000000
Binary files a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-dark-high-contrast-linux.png and /dev/null differ
diff --git a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-dark-linux.png b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-dark-linux.png
deleted file mode 100644
index 0a8f020a796..00000000000
Binary files a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-dark-linux.png and /dev/null differ
diff --git a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-dark-tritanopia-linux.png b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-dark-tritanopia-linux.png
deleted file mode 100644
index d66333e9ef0..00000000000
Binary files a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-dark-tritanopia-linux.png and /dev/null differ
diff --git a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-light-colorblind-linux.png b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-light-colorblind-linux.png
deleted file mode 100644
index 35957d68122..00000000000
Binary files a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-light-colorblind-linux.png and /dev/null differ
diff --git a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-light-high-contrast-linux.png b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-light-high-contrast-linux.png
deleted file mode 100644
index e61e83ab4e8..00000000000
Binary files a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-light-high-contrast-linux.png and /dev/null differ
diff --git a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-light-linux.png b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-light-linux.png
deleted file mode 100644
index 9863ba1450a..00000000000
Binary files a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-light-linux.png and /dev/null differ
diff --git a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-light-tritanopia-linux.png b/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-light-tritanopia-linux.png
deleted file mode 100644
index fd380ac2255..00000000000
Binary files a/.playwright/snapshots/components/ActionMenu.test.ts-snapshots/ActionMenu-Multiple-Sections-light-tritanopia-linux.png and /dev/null differ
diff --git a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-UnderlineNav-Interactions-dark-dimmed-Overflow-interaction-vrt-3-linux.png b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-UnderlineNav-Interactions-dark-dimmed-Overflow-interaction-vrt-3-linux.png
index 80ae6d7ec3b..014d7bfd33e 100644
Binary files a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-UnderlineNav-Interactions-dark-dimmed-Overflow-interaction-vrt-3-linux.png and b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-UnderlineNav-Interactions-dark-dimmed-Overflow-interaction-vrt-3-linux.png differ
diff --git a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-UnderlineNav-Interactions-dark-high-contrast-Overflow-interaction-vrt-3-linux.png b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-UnderlineNav-Interactions-dark-high-contrast-Overflow-interaction-vrt-3-linux.png
index 3943dfd024e..8493a061de2 100644
Binary files a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-UnderlineNav-Interactions-dark-high-contrast-Overflow-interaction-vrt-3-linux.png and b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-UnderlineNav-Interactions-dark-high-contrast-Overflow-interaction-vrt-3-linux.png differ
diff --git a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-UnderlineNav-Interactions-dark-tritanopia-Overflow-interaction-vrt-3-linux.png b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-UnderlineNav-Interactions-dark-tritanopia-Overflow-interaction-vrt-3-linux.png
index c0680e0f8ad..efad31b0b44 100644
Binary files a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-UnderlineNav-Interactions-dark-tritanopia-Overflow-interaction-vrt-3-linux.png and b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-UnderlineNav-Interactions-dark-tritanopia-Overflow-interaction-vrt-3-linux.png differ
diff --git a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-UnderlineNav-Interactions-light-tritanopia-Overflow-interaction-vrt-3-linux.png b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-UnderlineNav-Interactions-light-tritanopia-Overflow-interaction-vrt-3-linux.png
index 34898f867d0..e7cd788f147 100644
Binary files a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-UnderlineNav-Interactions-light-tritanopia-Overflow-interaction-vrt-3-linux.png and b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-UnderlineNav-Interactions-light-tritanopia-Overflow-interaction-vrt-3-linux.png differ
diff --git a/docs/content/ActionList.mdx b/docs/content/ActionList.mdx
index 724f3cb2c31..e4518d0d151 100644
--- a/docs/content/ActionList.mdx
+++ b/docs/content/ActionList.mdx
@@ -170,7 +170,7 @@ When you want to add links to the List instead of actions, use `ActionList.LinkI
```
-### With headings
+### With groups
```javascript live noinline
const SelectFields = () => {
@@ -196,30 +196,29 @@ const SelectFields = () => {
}
return (
- <>
-
-
+
+
{visibleOptions.map(option => (
toggle(option.text)}>
{option.text}
))}
-
-
+
-
{hiddenOptions.map((option, index) => (
toggle(option.text)}>
{option.text}
))}
{hiddenOptions.length === 0 && No hidden fields}
-
- >
+
+
)
}
diff --git a/docs/content/ActionMenu.mdx b/docs/content/ActionMenu.mdx
index 7cb42fb2caf..ac5b4baa651 100644
--- a/docs/content/ActionMenu.mdx
+++ b/docs/content/ActionMenu.mdx
@@ -110,7 +110,7 @@ You can choose to have a different _anchor_ for the Menu depending on the applic
```
-### Divided into sections
+### With Groups
```jsx live
@@ -118,54 +118,57 @@ You can choose to have a different _anchor_ for the Menu depending on the applic
-
-
-
-
-
- repo:github/memex,github/github
-
-
-
-
-
-
-
-
- Table
-
- Information-dense table optimized for operations across teams
-
-
-
-
-
-
- Board
- Kanban-style board focused on visual states
-
-
-
-
-
-
-
- Save sort and filters to current view
-
-
-
-
-
- Save sort and filters to new view
-
-
-
-
-
-
-
- View settings
-
+
+
+
+
+
+ repo:github/memex,github/github
+
+
+
+
+
+
+
+
+ Table
+
+ Information-dense table optimized for operations across teams
+
+
+
+
+
+
+ Board
+ Kanban-style board focused on visual states
+
+
+
+
+
+
+
+
+ Save sort and filters to current view
+
+
+
+
+
+ Save sort and filters to new view
+
+
+
+
+
+
+
+
+ View settings
+
+
diff --git a/e2e/components/ActionMenu.test.ts b/e2e/components/ActionMenu.test.ts
index 9ffee2dae51..dddbaee08f5 100644
--- a/e2e/components/ActionMenu.test.ts
+++ b/e2e/components/ActionMenu.test.ts
@@ -15,7 +15,7 @@ test.describe('ActionMenu', () => {
})
// Default state
- expect(await page.screenshot()).toMatchSnapshot(`ActionMenu.Default.${theme}.png`)
+ expect(await page.screenshot({animations: 'disabled'})).toMatchSnapshot(`ActionMenu.Default.${theme}.png`)
})
test('axe @aat', async ({page}) => {
@@ -43,7 +43,9 @@ test.describe('ActionMenu', () => {
})
// Default state
- expect(await page.screenshot()).toMatchSnapshot(`ActionMenu.Links And Actions.${theme}.png`)
+ expect(await page.screenshot({animations: 'disabled'})).toMatchSnapshot(
+ `ActionMenu.Links And Actions.${theme}.png`,
+ )
})
test('axe @aat', async ({page}) => {
@@ -71,7 +73,9 @@ test.describe('ActionMenu', () => {
})
// Default state
- expect(await page.screenshot()).toMatchSnapshot(`ActionMenu.Multi Select.${theme}.png`)
+ expect(await page.screenshot({animations: 'disabled'})).toMatchSnapshot(
+ `ActionMenu.Multi Select.${theme}.png`,
+ )
})
test('axe @aat', async ({page}) => {
@@ -99,7 +103,9 @@ test.describe('ActionMenu', () => {
})
// Default state
- expect(await page.screenshot()).toMatchSnapshot(`ActionMenu.Single Select.${theme}.png`)
+ expect(await page.screenshot({animations: 'disabled'})).toMatchSnapshot(
+ `ActionMenu.Single Select.${theme}.png`,
+ )
})
test('axe @aat', async ({page}) => {
@@ -127,7 +133,9 @@ test.describe('ActionMenu', () => {
})
// Default state
- expect(await page.screenshot()).toMatchSnapshot(`ActionMenu.Controlled Menu.${theme}.png`)
+ expect(await page.screenshot({animations: 'disabled'})).toMatchSnapshot(
+ `ActionMenu.Controlled Menu.${theme}.png`,
+ )
})
test('axe @aat', async ({page}) => {
@@ -155,7 +163,9 @@ test.describe('ActionMenu', () => {
})
// Default state
- expect(await page.screenshot()).toMatchSnapshot(`ActionMenu.Custom Anchor.${theme}.png`)
+ expect(await page.screenshot({animations: 'disabled'})).toMatchSnapshot(
+ `ActionMenu.Custom Anchor.${theme}.png`,
+ )
})
test('axe @aat', async ({page}) => {
@@ -183,7 +193,9 @@ test.describe('ActionMenu', () => {
})
// Default state
- expect(await page.screenshot()).toMatchSnapshot(`ActionMenu.Custom Overlay Props.${theme}.png`)
+ expect(await page.screenshot({animations: 'disabled'})).toMatchSnapshot(
+ `ActionMenu.Custom Overlay Props.${theme}.png`,
+ )
})
test('axe @aat', async ({page}) => {
@@ -223,37 +235,13 @@ test.describe('ActionMenu', () => {
colorScheme: theme,
},
})
- await expect(page).toHaveNoViolations()
- })
- })
- }
- })
-
- test.describe('Multiple Sections', () => {
- for (const theme of themes) {
- test.describe(theme, () => {
- test('default @vrt', async ({page}) => {
- await visit(page, {
- id: 'components-actionmenu-examples--multiple-sections',
- globals: {
- colorScheme: theme,
- },
- })
-
- // Default state
- expect(await page.screenshot({animations: 'disabled'})).toMatchSnapshot(
- `ActionMenu.Multiple Sections.${theme}.png`,
- )
- })
-
- test('axe @aat', async ({page}) => {
- await visit(page, {
- id: 'components-actionmenu-examples--multiple-sections',
- globals: {
- colorScheme: theme,
+ await expect(page).toHaveNoViolations({
+ rules: {
+ 'aria-required-children': {
+ enabled: false,
+ },
},
})
- await expect(page).toHaveNoViolations()
})
})
}
diff --git a/generated/components.json b/generated/components.json
index 9cfa427c3d3..aaed0eb03af 100644
--- a/generated/components.json
+++ b/generated/components.json
@@ -108,7 +108,7 @@
"props": [
{
"name": "children",
- "type": "ActionList.Item[] | ActionList.LinkItem[] | ActionList.Divider[]",
+ "type": "ActionList.Item[] | ActionList.LinkItem[] | ActionList.Group[]",
"defaultValue": "",
"required": true,
"description": ""
@@ -285,34 +285,48 @@
]
},
{
- "name": "ActionList.Heading",
+ "name": "ActionList.Group",
"props": [
{
- "name": "variant",
- "type": "'subtle' | 'filled'",
- "defaultValue": "subtle",
+ "name": "children",
+ "type": "ActionList.Item[] | ActionList.LinkItem[]",
+ "defaultValue": "",
+ "required": true,
"description": ""
},
{
"name": "title",
"type": "string",
"defaultValue": "",
- "required": true,
- "description": ""
+ "description": "Title of the group."
},
{
- "name": "subtitle",
+ "name": "auxiliaryText",
"type": "string",
"defaultValue": "",
- "required": false,
- "description": ""
+ "description": "Secondary text that provides additional information about the group."
},
{
- "name": "headingLevel",
- "type": "'1' | '2' | '3' | '4' | '5' | '6'",
- "defaultValue": "3",
- "required": false,
- "description": ""
+ "name": "variant",
+ "type": "'filled' | 'subtle'",
+ "defaultValue": "'subtle'",
+ "description": "`inline` descriptions are positioned beside primary text. `block` descriptions are positioned below primary text."
+ },
+ {
+ "name": "selectionVariant",
+ "type": "'single' | 'multiple' | false",
+ "defaultValue": "",
+ "description": "Set `selectionVariant` at the group level."
+ },
+ {
+ "name": "role",
+ "type": "AriaRole",
+ "defaultValue": "",
+ "description": "ARIA role describing the function of the list inside the group. `listbox` and `menu` are a common values."
+ },
+ {
+ "name": "sx",
+ "type": "SystemStyleObject"
}
]
}
diff --git a/src/ActionList/ActionList.docs.json b/src/ActionList/ActionList.docs.json
index d74f3a0290a..51876522efb 100644
--- a/src/ActionList/ActionList.docs.json
+++ b/src/ActionList/ActionList.docs.json
@@ -7,7 +7,7 @@
"props": [
{
"name": "children",
- "type": "ActionList.Item[] | ActionList.LinkItem[] | ActionList.Divider[]",
+ "type": "ActionList.Item[] | ActionList.LinkItem[] | ActionList.Group[]",
"defaultValue": "",
"required": true,
"description": ""
@@ -184,36 +184,50 @@
]
},
{
- "name": "ActionList.Heading",
+ "name": "ActionList.Group",
"props": [
{
- "name": "variant",
- "type": "'subtle' | 'filled'",
- "defaultValue": "subtle",
+ "name": "children",
+ "type": "ActionList.Item[] | ActionList.LinkItem[]",
+ "defaultValue": "",
+ "required": true,
"description": ""
},
{
"name": "title",
"type": "string",
"defaultValue": "",
- "required": true,
- "description": ""
+ "description": "Title of the group."
},
{
- "name": "subtitle",
+ "name": "auxiliaryText",
"type": "string",
"defaultValue": "",
- "required": false,
- "description": ""
+ "description": "Secondary text that provides additional information about the group."
},
{
- "name": "headingLevel",
- "type": "'1' | '2' | '3' | '4' | '5' | '6'",
- "defaultValue": "3",
- "required": false,
- "description": ""
+ "name": "variant",
+ "type": "'filled' | 'subtle'",
+ "defaultValue": "'subtle'",
+ "description": "`inline` descriptions are positioned beside primary text. `block` descriptions are positioned below primary text."
+ },
+ {
+ "name": "selectionVariant",
+ "type": "'single' | 'multiple' | false",
+ "defaultValue": "",
+ "description": "Set `selectionVariant` at the group level."
+ },
+ {
+ "name": "role",
+ "type": "AriaRole",
+ "defaultValue": "",
+ "description": "ARIA role describing the function of the list inside the group. `listbox` and `menu` are a common values."
+ },
+ {
+ "name": "sx",
+ "type": "SystemStyleObject"
}
]
}
]
-}
+}
\ No newline at end of file
diff --git a/src/ActionList/ActionList.examples.stories.tsx b/src/ActionList/ActionList.examples.stories.tsx
index 654e4dcf5ee..ef5c79a08aa 100644
--- a/src/ActionList/ActionList.examples.stories.tsx
+++ b/src/ActionList/ActionList.examples.stories.tsx
@@ -132,25 +132,24 @@ export function MixedSelection(): JSX.Element {
List with mixed selection
- In this list, there is a ActionList with single selection for picking one option, followed by another ActionList
- with a single Item that is an action. This pattern appears inside a menu for selection view options in Memex.
+ In this list, there is a ActionList.Group with single selection for picking one option, followed by a Item that
+ is an action. This pattern appears inside a menu for selection view options in Memex