diff --git a/CHANGELOG.md b/CHANGELOG.md index 30bf157b43..e64632d79b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -17,6 +17,13 @@ The types of changes are: ## [Unreleased](https://github.com/ethyca/fides/compare/1.7.0...main) +## [1.7.1](https://github.com/ethyca/fides/compare/1.6.1...1.7.1) - 2022-07-28 +### Added + +### Fixed + +* CustomSelect input tooltips appear next to selector instead of wrapping to a new row. + ## [1.7.0](https://github.com/ethyca/fides/compare/1.6.1...1.7.0) - 2022-06-23 ### Added diff --git a/clients/admin-ui/src/features/common/form/inputs.tsx b/clients/admin-ui/src/features/common/form/inputs.tsx index ba0be90bc2..6419525594 100644 --- a/clients/admin-ui/src/features/common/form/inputs.tsx +++ b/clients/admin-ui/src/features/common/form/inputs.tsx @@ -79,42 +79,46 @@ export const CustomSelect = ({ {label} - { + if (option) { + field.onBlur(props.name); + } + }} + onChange={(newValue) => { + if (newValue) { + field.onChange(props.name)(newValue.value); + } + }} + name={props.name} + value={selected} + size={size} + chakraStyles={{ + container: (provided) => ({ ...provided, mr: 2, flexGrow: 1 }), + dropdownIndicator: (provided) => ({ + ...provided, + bg: "transparent", + px: 2, + cursor: "inherit", + }), + indicatorSeparator: (provided) => ({ + ...provided, + display: "none", + }), + multiValue: (provided) => ({ + ...provided, + background: "primary.400", + color: "white", + }), + }} + isSearchable={isSearchable ?? false} + isClearable={isClearable} + /> + + {tooltip ? : null} + {isInvalid ? {meta.error} : null}