From c56dd5c8de7d741e95438e842009e93e9a654d8a Mon Sep 17 00:00:00 2001 From: Cole Bemis Date: Wed, 24 May 2023 11:47:30 -0700 Subject: [PATCH 1/5] SelectPanel: Add `subtitle` prop --- src/SelectPanel/SelectPanel.docs.json | 6 ++++++ src/SelectPanel/SelectPanel.stories.tsx | 4 ++-- src/SelectPanel/SelectPanel.tsx | 15 ++++++++++++++- 3 files changed, 22 insertions(+), 3 deletions(-) diff --git a/src/SelectPanel/SelectPanel.docs.json b/src/SelectPanel/SelectPanel.docs.json index 7e34e9c294a..48268ae7bb2 100644 --- a/src/SelectPanel/SelectPanel.docs.json +++ b/src/SelectPanel/SelectPanel.docs.json @@ -11,6 +11,12 @@ "defaultValue": "\"Select an item\" or \"Select items\"", "description": "A descriptive title for the panel" }, + { + "name": "subtitle", + "type": "string | React.ReactElement", + "defaultValue": "", + "description": "When provided, a subtitle is displayed below the title" + }, { "name": "onOpenChange", "type": "( open: boolean, gesture: | 'anchor-click' | 'anchor-key-press' | 'click-outside' | 'escape' | 'selection' ) => void", diff --git a/src/SelectPanel/SelectPanel.stories.tsx b/src/SelectPanel/SelectPanel.stories.tsx index 1ab7d29b47b..11206c4943b 100644 --- a/src/SelectPanel/SelectPanel.stories.tsx +++ b/src/SelectPanel/SelectPanel.stories.tsx @@ -50,9 +50,9 @@ export const Default = () => { return ( <>

Multi Select Panel

-
Please select labels that describe your issue:
( \n )}\n placeholderText=\"Filter labels\"\n open={open}\n onOpenChange={setOpen}\n items={filteredItems}\n selected={selected}\n onSelectedChange={setSelected}\n onFilterChange={setFilter}\n showItemDividers={true}\n overlayProps={{\n width: 'small',\n height: 'xsmall',\n }}\n />\n \n )\n}" + "code": "() => {\n const [selected, setSelected] = React.useState([\n items[0],\n items[1],\n ])\n const [filter, setFilter] = React.useState('')\n const filteredItems = items.filter((item) =>\n item.text.toLowerCase().startsWith(filter.toLowerCase()),\n )\n const [open, setOpen] = useState(false)\n return (\n <>\n

Multi Select Panel

\n (\n \n {children ?? 'Select Labels'}\n \n )}\n placeholderText=\"Filter labels\"\n open={open}\n onOpenChange={setOpen}\n items={filteredItems}\n selected={selected}\n onSelectedChange={setSelected}\n onFilterChange={setFilter}\n showItemDividers={true}\n overlayProps={{\n width: 'medium',\n height: 'medium',\n }}\n />\n \n )\n}" } ], "props": [ @@ -3648,6 +3648,12 @@ "defaultValue": "\"Select an item\" or \"Select items\"", "description": "A descriptive title for the panel" }, + { + "name": "subtitle", + "type": "string | React.ReactElement", + "defaultValue": "", + "description": "When provided, a subtitle is displayed below the title" + }, { "name": "onOpenChange", "type": "( open: boolean, gesture: | 'anchor-click' | 'anchor-key-press' | 'click-outside' | 'escape' | 'selection' ) => void", From ad4a41636cd5e888c6e9bf72f27a889b82e54911 Mon Sep 17 00:00:00 2001 From: Cole Bemis Date: Wed, 24 May 2023 12:49:17 -0700 Subject: [PATCH 3/5] Create thin-rocks-chew.md --- .changeset/thin-rocks-chew.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/thin-rocks-chew.md diff --git a/.changeset/thin-rocks-chew.md b/.changeset/thin-rocks-chew.md new file mode 100644 index 00000000000..b961df42747 --- /dev/null +++ b/.changeset/thin-rocks-chew.md @@ -0,0 +1,5 @@ +--- +"@primer/react": minor +--- + +SelectPanel: Add `subtitle` prop From 151cd2fe739c992b3576fac729090e2d48280c72 Mon Sep 17 00:00:00 2001 From: Cole Bemis Date: Wed, 24 May 2023 13:16:15 -0700 Subject: [PATCH 4/5] update snapshots --- src/SelectPanel/__snapshots__/SelectPanel.test.tsx.snap | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/SelectPanel/__snapshots__/SelectPanel.test.tsx.snap b/src/SelectPanel/__snapshots__/SelectPanel.test.tsx.snap index 223426357d3..1c2aff6eeb8 100644 --- a/src/SelectPanel/__snapshots__/SelectPanel.test.tsx.snap +++ b/src/SelectPanel/__snapshots__/SelectPanel.test.tsx.snap @@ -87,7 +87,7 @@ exports[`SelectPanel renders consistently 1`] = `