1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-07-31 13:47:02 +02:00

Chore(1 3895)/small input tweaks (#10316)

Doesn't clear the value from the constraint input value popover if you
close it and then re-open. In other words, if you accidentally click
out, you don't lose your progress. Instead, the popover will open again,
with the value you had when you closed it highlighted (so that it's easy
to type over if you want to):

<img width="452" alt="image"
src="https://github.com/user-attachments/assets/d86aa00e-4956-40a8-8fea-e75be5d5425b"
/>

The reason I'm changing this now is because I noticed that the error
wasn't cleared correctly when the popover was closed. If we do it this
way instead, then that makes sense, because you can still see the value.
This is also how the single-value popover has worked forever.

From some quick testing, the single value popover still works as
expected:
<img width="562" alt="image"
src="https://github.com/user-attachments/assets/9041a922-b055-4310-ab60-93ad219981a4"
/>


As a side note: I'm adding a comment to anyone coming after as to why
focus handling on escape doesn't work correctly on the single value
button. I was about to go down a rabbit hole on that before I read my
own comment on the previous PR. So I thought I'd put that here too.
This commit is contained in:
Thomas Heartman 2025-07-04 14:57:52 +02:00 committed by GitHub
parent 37aaf60aa5
commit cb4beb71ac
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 8 additions and 8 deletions

View File

@ -5,6 +5,13 @@ import { ValueChip } from './ValueList.tsx';
import { AddValuesPopover, type OnAddActions } from './AddValuesPopover.tsx';
import type { ConstraintValidatorOutput } from './ConstraintValidatorOutput.ts';
// No, escape handling doesn't work correctly with chips and popovers in MUI v5.
// This is an intentional trade-off for now because the chip makes it easy to
// use delete/backspace to clear the value and otherwise works pretty well (cf
// https://github.com/Unleash/unleash/pull/9859).
//
// In MUI v6 and onwards this will "just work"
// (https://mui.com/material-ui/migration/upgrade-to-v6/#chip)
const StyledChip = styled(ValueChip, {
shouldForwardProp: (prop) => prop !== 'hasValue',
})<{ hasValue: boolean }>(({ theme, hasValue }) => ({

View File

@ -80,14 +80,7 @@ export const AddValuesPopover: FC<AddValuesProps> = ({
<StyledPopover
open={open}
onTransitionEnter={() => {
if (inputValue && !initialValue?.trim()) {
// if the input value is not empty and the current value is
// empty or whitespace
setInputValue('');
} else if (inputValue) {
// select the text in the input field
inputRef?.current?.select();
}
inputRef?.current?.select();
}}
disableScrollLock
anchorEl={anchorEl}