SelectWithTags - disabled поведение
leoneed96 opened this issue · 1 comments
leoneed96 commented
Опишите проблему
В SelectWithTags с disabled={true}
и allowUnselect={true}
- генерируется событие onChange при удалении тега из инпута (по нажатию на крестик)
- курсор не меняется на not-allowed, внешний вид выбранных тегов в инпуте не меняется
Шаги для воспроизведения
- Перейти на страницу с примером компонента, заменить код на нижеприведенный
{ key: '1', content: 'H', value: 'H' },
{ key: '2', content: 'Li', value: 'Li' },
{ key: '3', content: 'Na', value: 'Na' },
{ key: '4', content: 'Curium', value: 'Curium' },
{ key: '5', content: 'Berkelium', value: 'Berkelium' },
{ key: '6', content: 'Californium', value: 'Californium' },
{ key: '7', content: 'Einsteinium', value: 'Einsteinium' },
{ key: '8', content: 'Fermium', value: 'Fermium' },
];
render(() => {
const [value, setValue] = React.useState('');
const handleInput = event => {
setValue(event.target.value);
};
return (
<div style={{ width: '400px' }}>
<SelectWithTags
options={options}
selected={options}
disabled={true}
onChange={() => {console.log('change')}}
onInput={handleInput}
value={value}
autocomplete={true}
block={true}
allowUnselect={false}
/>
</div>
);
});
Ожидаемое поведение
С установленным disabled = true
событие об изменении не генерируется при попытке удаления тега.
Теги с установленным disabled = true
отличаются внешне (курсором/цветом)
Курсор на компоненте с disabled = true
- not-allowed
Чек лист
- Тесты
- Документация
Внешний вид
Ожидаемый | Фактический |
---|---|
** Ожидаемый ** | ** Фактический ** |
Тестовый стенд
Десктоп (если данных нет оставьте блок пустым):
- OS: MacOS
- Browser: Safari
- Version: 10
Смартфон (если данных нет оставьте блок пустым):
- Device: iPhone 6
- OS: iOS 10
- Browser: Chrome
- Version: 65
Дополнительная информация
Дополнительная информация