mirror of
https://github.com/Prowlarr/Prowlarr
synced 2026-05-07 12:10:20 +02:00
Merge bc5f61b9b8 into 18fe4ec495
This commit is contained in:
commit
48997410a2
5 changed files with 21 additions and 8 deletions
|
|
@ -192,7 +192,6 @@ class EnhancedSelectInput extends Component {
|
|||
isOpen,
|
||||
selectedIndex
|
||||
} = this.state;
|
||||
|
||||
const keyCode = event.keyCode;
|
||||
const newState = {};
|
||||
|
||||
|
|
@ -229,12 +228,12 @@ class EnhancedSelectInput extends Component {
|
|||
|
||||
if (keyCode === keyCodes.ENTER) {
|
||||
event.preventDefault();
|
||||
newState.isOpen = false;
|
||||
newState.isOpen = true;
|
||||
this.onSelect(getKey(selectedIndex, values));
|
||||
}
|
||||
|
||||
if (keyCode === keyCodes.TAB) {
|
||||
newState.isOpen = false;
|
||||
newState.isOpen = true;
|
||||
this.onSelect(getKey(selectedIndex, values));
|
||||
}
|
||||
|
||||
|
|
@ -486,6 +485,7 @@ class EnhancedSelectInput extends Component {
|
|||
const hasParent = v.parentKey !== undefined;
|
||||
const depth = hasParent ? 1 : 0;
|
||||
const parentSelected = hasParent && Array.isArray(value) && value.includes(v.parentKey);
|
||||
const isFocused = index === this.state.selectedIndex;
|
||||
return (
|
||||
<OptionComponent
|
||||
key={v.key}
|
||||
|
|
@ -498,6 +498,7 @@ class EnhancedSelectInput extends Component {
|
|||
{...v}
|
||||
isMobile={false}
|
||||
onSelect={this.onSelect}
|
||||
isFocused={isFocused}
|
||||
>
|
||||
{v.value}
|
||||
</OptionComponent>
|
||||
|
|
|
|||
|
|
@ -13,6 +13,10 @@
|
|||
&.isDisabled {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
&.isFocused {
|
||||
background-color: var(--inputHoverBackgroundColor);
|
||||
}
|
||||
}
|
||||
|
||||
.optionCheck {
|
||||
|
|
|
|||
|
|
@ -40,6 +40,7 @@ class EnhancedSelectInputOption extends Component {
|
|||
isHidden,
|
||||
isMultiSelect,
|
||||
isMobile,
|
||||
isFocused,
|
||||
children
|
||||
} = this.props;
|
||||
|
||||
|
|
@ -50,7 +51,8 @@ class EnhancedSelectInputOption extends Component {
|
|||
isSelected && !isMultiSelect && styles.isSelected,
|
||||
isDisabled && !isMultiSelect && styles.isDisabled,
|
||||
isHidden && styles.isHidden,
|
||||
isMobile && styles.isMobile
|
||||
isMobile && styles.isMobile,
|
||||
isFocused && styles.isFocused
|
||||
)}
|
||||
component="div"
|
||||
isDisabled={isDisabled}
|
||||
|
|
@ -98,6 +100,7 @@ EnhancedSelectInputOption.propTypes = {
|
|||
isHidden: PropTypes.bool.isRequired,
|
||||
isMultiSelect: PropTypes.bool.isRequired,
|
||||
isMobile: PropTypes.bool.isRequired,
|
||||
isFocused: PropTypes.bool.isRequired,
|
||||
children: PropTypes.node.isRequired,
|
||||
onSelect: PropTypes.func.isRequired
|
||||
};
|
||||
|
|
@ -107,7 +110,8 @@ EnhancedSelectInputOption.defaultProps = {
|
|||
depth: 0,
|
||||
isDisabled: false,
|
||||
isHidden: false,
|
||||
isMultiSelect: false
|
||||
isMultiSelect: false,
|
||||
isFocused: false
|
||||
};
|
||||
|
||||
export default EnhancedSelectInputOption;
|
||||
|
|
|
|||
|
|
@ -14,6 +14,7 @@ function HintedSelectInputOption(props) {
|
|||
isDisabled,
|
||||
isMultiSelect,
|
||||
isMobile,
|
||||
isFocused,
|
||||
...otherProps
|
||||
} = props;
|
||||
|
||||
|
|
@ -26,6 +27,7 @@ function HintedSelectInputOption(props) {
|
|||
isHidden={isDisabled}
|
||||
isMultiSelect={isMultiSelect}
|
||||
isMobile={isMobile}
|
||||
isFocused={isFocused}
|
||||
{...otherProps}
|
||||
>
|
||||
<div className={classNames(
|
||||
|
|
@ -54,13 +56,15 @@ HintedSelectInputOption.propTypes = {
|
|||
isSelected: PropTypes.bool.isRequired,
|
||||
isDisabled: PropTypes.bool.isRequired,
|
||||
isMultiSelect: PropTypes.bool.isRequired,
|
||||
isMobile: PropTypes.bool.isRequired
|
||||
isMobile: PropTypes.bool.isRequired,
|
||||
isFocused: PropTypes.bool.isRequired
|
||||
};
|
||||
|
||||
HintedSelectInputOption.defaultProps = {
|
||||
isDisabled: false,
|
||||
isHidden: false,
|
||||
isMultiSelect: false
|
||||
isMultiSelect: false,
|
||||
isFocused: false
|
||||
};
|
||||
|
||||
export default HintedSelectInputOption;
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@ function HintedSelectInputSelectedValue(props) {
|
|||
>
|
||||
<div className={styles.valueText}>
|
||||
{
|
||||
isMultiSelect ?
|
||||
isMultiSelect && Array.isArray(value) ?
|
||||
value.map((key, index) => {
|
||||
const v = valuesMap[key];
|
||||
return (
|
||||
|
|
|
|||
Loading…
Reference in a new issue