Skip to content

Commit

Permalink
Merge 34c738b into d562776
Browse files Browse the repository at this point in the history
  • Loading branch information
broccolinisoup authored Jul 5, 2023
2 parents d562776 + 34c738b commit f5ecc0d
Show file tree
Hide file tree
Showing 31 changed files with 1,146 additions and 1,003 deletions.
17 changes: 9 additions & 8 deletions docs/content/ActionList.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -170,7 +170,7 @@ When you want to add links to the List instead of actions, use `ActionList.LinkI
</ActionList>
```

### With groups
### With headings

```javascript live noinline
const SelectFields = () => {
Expand All @@ -196,29 +196,30 @@ const SelectFields = () => {
}

return (
<ActionList selectionVariant="multiple">
<ActionList.Group title="Visible fields">
<>
<ActionList selectionVariant="multiple">
<ActionList.Heading title="Visible fields" />
{visibleOptions.map(option => (
<ActionList.Item key={option.text} selected={true} onSelect={() => toggle(option.text)}>
{option.text}
</ActionList.Item>
))}
</ActionList.Group>
<ActionList.Group
title="Hidden fields"
</ActionList>
<ActionList
selectionVariant={
/** selectionVariant override on Group: disable selection if there are no options */
hiddenOptions.length ? 'multiple' : false
}
>
<ActionList.Heading title="Hidden fields" />
{hiddenOptions.map((option, index) => (
<ActionList.Item key={option.text} selected={false} onSelect={() => toggle(option.text)}>
{option.text}
</ActionList.Item>
))}
{hiddenOptions.length === 0 && <ActionList.Item disabled>No hidden fields</ActionList.Item>}
</ActionList.Group>
</ActionList>
</ActionList>
</>
)
}

Expand Down
101 changes: 49 additions & 52 deletions docs/content/ActionMenu.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -110,65 +110,62 @@ You can choose to have a different _anchor_ for the Menu depending on the applic
</ActionMenu>
```

### With Groups
### Divided into sections

```jsx live
<ActionMenu>
<ActionMenu.Button>Open column menu</ActionMenu.Button>

<ActionMenu.Overlay>
<ActionList showDividers>
<ActionList.Group title="Live query">
<ActionList.Item>
<ActionList.LeadingVisual>
<SearchIcon />
</ActionList.LeadingVisual>
repo:github/memex,github/github
</ActionList.Item>
</ActionList.Group>
<ActionList.Divider />
<ActionList.Group title="Layout" variant="subtle">
<ActionList.Item>
<ActionList.LeadingVisual>
<NoteIcon />
</ActionList.LeadingVisual>
Table
<ActionList.Description variant="block">
Information-dense table optimized for operations across teams
</ActionList.Description>
</ActionList.Item>
<ActionList.Item role="listitem">
<ActionList.LeadingVisual>
<ProjectIcon />
</ActionList.LeadingVisual>
Board
<ActionList.Description variant="block">Kanban-style board focused on visual states</ActionList.Description>
</ActionList.Item>
</ActionList.Group>
<ActionList.Divider />
<ActionList.Group>
<ActionList.Item>
<ActionList.LeadingVisual>
<FilterIcon />
</ActionList.LeadingVisual>
Save sort and filters to current view
</ActionList.Item>
<ActionList.Item>
<ActionList.LeadingVisual>
<FilterIcon />
</ActionList.LeadingVisual>
Save sort and filters to new view
</ActionList.Item>
</ActionList.Group>
<ActionList.Divider />
<ActionList.Group>
<ActionList.Item>
<ActionList.LeadingVisual>
<GearIcon />
</ActionList.LeadingVisual>
View settings
</ActionList.Item>
</ActionList.Group>
<ActionList.Heading title="Live query" />
<ActionList.Item>
<ActionList.LeadingVisual>
<SearchIcon />
</ActionList.LeadingVisual>
repo:github/memex,github/github
</ActionList.Item>
</ActionList>
<ActionList showDividers>
<ActionList.Heading title="Layout" variant="subtle" />
<ActionList.Item>
<ActionList.LeadingVisual>
<NoteIcon />
</ActionList.LeadingVisual>
Table
<ActionList.Description variant="block">
Information-dense table optimized for operations across teams
</ActionList.Description>
</ActionList.Item>
<ActionList.Item role="listitem">
<ActionList.LeadingVisual>
<ProjectIcon />
</ActionList.LeadingVisual>
Board
<ActionList.Description variant="block">Kanban-style board focused on visual states</ActionList.Description>
</ActionList.Item>
</ActionList>
<ActionList showDividers>
<ActionList.Item>
<ActionList.LeadingVisual>
<FilterIcon />
</ActionList.LeadingVisual>
Save sort and filters to current view
</ActionList.Item>
<ActionList.Item>
<ActionList.LeadingVisual>
<FilterIcon />
</ActionList.LeadingVisual>
Save sort and filters to new view
</ActionList.Item>
</ActionList>
<ActionList>
<ActionList.Item>
<ActionList.LeadingVisual>
<GearIcon />
</ActionList.LeadingVisual>
View settings
</ActionList.Item>
</ActionList>
</ActionMenu.Overlay>
</ActionMenu>
Expand Down
44 changes: 15 additions & 29 deletions generated/components.json
Original file line number Diff line number Diff line change
Expand Up @@ -108,7 +108,7 @@
"props": [
{
"name": "children",
"type": "ActionList.Item[] | ActionList.LinkItem[] | ActionList.Group[]",
"type": "ActionList.Item[] | ActionList.LinkItem[] | ActionList.Divider[]",
"defaultValue": "",
"required": true,
"description": ""
Expand Down Expand Up @@ -285,48 +285,34 @@
]
},
{
"name": "ActionList.Group",
"name": "ActionList.Heading",
"props": [
{
"name": "children",
"type": "ActionList.Item[] | ActionList.LinkItem[]",
"defaultValue": "",
"required": true,
"name": "variant",
"type": "'subtle' | 'filled'",
"defaultValue": "subtle",
"description": ""
},
{
"name": "title",
"type": "string",
"defaultValue": "",
"description": "Title of the group."
"required": true,
"description": ""
},
{
"name": "auxiliaryText",
"name": "subtitle",
"type": "string",
"defaultValue": "",
"description": "Secondary text that provides additional information about the group."
},
{
"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."
"required": false,
"description": ""
},
{
"name": "sx",
"type": "SystemStyleObject"
"name": "headingLevel",
"type": "'1' | '2' | '3' | '4' | '5' | '6'",
"defaultValue": "3",
"required": false,
"description": ""
}
]
}
Expand Down
46 changes: 16 additions & 30 deletions src/ActionList/ActionList.docs.json
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
"props": [
{
"name": "children",
"type": "ActionList.Item[] | ActionList.LinkItem[] | ActionList.Group[]",
"type": "ActionList.Item[] | ActionList.LinkItem[] | ActionList.Divider[]",
"defaultValue": "",
"required": true,
"description": ""
Expand Down Expand Up @@ -184,50 +184,36 @@
]
},
{
"name": "ActionList.Group",
"name": "ActionList.Heading",
"props": [
{
"name": "children",
"type": "ActionList.Item[] | ActionList.LinkItem[]",
"defaultValue": "",
"required": true,
"name": "variant",
"type": "'subtle' | 'filled'",
"defaultValue": "subtle",
"description": ""
},
{
"name": "title",
"type": "string",
"defaultValue": "",
"description": "Title of the group."
"required": true,
"description": ""
},
{
"name": "auxiliaryText",
"name": "subtitle",
"type": "string",
"defaultValue": "",
"description": "Secondary text that provides additional information about the group."
},
{
"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."
"required": false,
"description": ""
},
{
"name": "sx",
"type": "SystemStyleObject"
"name": "headingLevel",
"type": "'1' | '2' | '3' | '4' | '5' | '6'",
"defaultValue": "3",
"required": false,
"description": ""
}
]
}
]
}
}
Loading

0 comments on commit f5ecc0d

Please sign in to comment.