From c099e1ff10f458b380e4c881e43800439bc887cc Mon Sep 17 00:00:00 2001
From: Matiss Janis Aboltins <matiss@mja.lv>
Date: Sun, 19 Mar 2023 17:20:04 +0000
Subject: [PATCH] :bug: (autocomplete) consistent input height between
multi/single input (#787)
Making consistent height between multi/single input autocomplete.
---
.../src/components/autocomplete-styles.js | 13 +++++++++++--
upcoming-release-notes/787.md | 6 ++++++
2 files changed, 17 insertions(+), 2 deletions(-)
create mode 100644 upcoming-release-notes/787.md
diff --git a/packages/loot-design/src/components/autocomplete-styles.js b/packages/loot-design/src/components/autocomplete-styles.js
index c2cbb2484..11a373716 100644
--- a/packages/loot-design/src/components/autocomplete-styles.js
+++ b/packages/loot-design/src/components/autocomplete-styles.js
@@ -62,13 +62,22 @@ const colourStyles = {
padding: '3px 20px',
fontSize: 13,
}),
- valueContainer: styles => ({ ...styles, padding: 'none' }),
+ valueContainer: (styles, { isMulti, selectProps }) => ({
+ ...styles,
+ padding: 'none',
+ overflow: 'visible',
+ marginTop: isMulti && selectProps.value?.length ? -4 : undefined,
+ marginBottom: isMulti && selectProps.value?.length ? -4 : undefined,
+ }),
clearIndicator: styles => ({
...styles,
padding: 'none',
'> svg': { height: 15, width: 15 },
}),
- multiValue: styles => ({ ...styles, backgroundColor: colors.b9 }),
+ multiValue: styles => ({
+ ...styles,
+ backgroundColor: colors.b9,
+ }),
};
export default colourStyles;
diff --git a/upcoming-release-notes/787.md b/upcoming-release-notes/787.md
new file mode 100644
index 000000000..1ac96a624
--- /dev/null
+++ b/upcoming-release-notes/787.md
@@ -0,0 +1,6 @@
+---
+category: Bugfix
+authors: [MatissJanis]
+---
+
+New autocomplete: making consistent height between multi/single value inputs
--
GitLab