From 87efd07490baccc95975b55785559f4dfcb690ca Mon Sep 17 00:00:00 2001 From: Carlos Esteban Lopez Date: Wed, 19 Apr 2023 11:56:30 -0500 Subject: [PATCH] fix(search): Address Github PR comments Signed-off-by: Carlos Esteban Lopez --- .changeset/mighty-bears-glow.md | 8 ++++++-- .../search-react/src/components/SearchBar/SearchBar.tsx | 1 - plugins/search/src/components/SearchModal/SearchModal.tsx | 5 ----- 3 files changed, 6 insertions(+), 8 deletions(-) diff --git a/.changeset/mighty-bears-glow.md b/.changeset/mighty-bears-glow.md index 125feb73c6..578e017866 100644 --- a/.changeset/mighty-bears-glow.md +++ b/.changeset/mighty-bears-glow.md @@ -1,6 +1,10 @@ --- -'@backstage/plugin-search-react': patch -'@backstage/plugin-search': patch +'@backstage/plugin-search-react': minor +'@backstage/plugin-search': minor --- Add close button & improve search input. + +MUI's Paper wrapping the SearchBar in the SearchPage was removed, we recommend users update their apps accordingly. + +SearchBarBase's TextField's placeholder was changed into a label, tests relying on the placeholder should be updated to query for the label instead. diff --git a/plugins/search-react/src/components/SearchBar/SearchBar.tsx b/plugins/search-react/src/components/SearchBar/SearchBar.tsx index 8fad4ef9a6..e36287b5b3 100644 --- a/plugins/search-react/src/components/SearchBar/SearchBar.tsx +++ b/plugins/search-react/src/components/SearchBar/SearchBar.tsx @@ -164,7 +164,6 @@ export const SearchBarBase: ForwardRefExoticComponent = endAdornment: clearButton ? endAdornment : defaultEndAdornment, }} inputProps={{ - 'aria-label': 'Search', ...defaultInputProps, }} fullWidth={fullWidth} diff --git a/plugins/search/src/components/SearchModal/SearchModal.tsx b/plugins/search/src/components/SearchModal/SearchModal.tsx index 51dafda517..cfeabf3358 100644 --- a/plugins/search/src/components/SearchModal/SearchModal.tsx +++ b/plugins/search/src/components/SearchModal/SearchModal.tsx @@ -89,11 +89,6 @@ const useStyles = makeStyles(theme => ({ marginTop: theme.spacing(1), }, }, - container: { - borderRadius: 30, - display: 'flex', - height: '2.4em', - }, input: { flex: 1, },