Is it possible to avoid uncheck item?

[andreyluiz]

I have a superselectfield with multi selection disabled. I want my select field to avoid deselecting the current selected item when the user clicks the selected item again, just like the MUI Select Field does.

In other words, I want the value to never be null.

Thank you,

[Sharlaan]

In other words, I want the value to never be null.

How about setting a default value in your state ?

[andreyluiz]

I already have a default value. It is { id: -1, header: 'Not selected' }. It is another option in the select field. When my form loads, I start it with this value. It is a business rule for my application.

My problem regards the ability of deselect the currently selected option (highlighted with the primary color). When I click the selected item, obviously you know, it is deselected. What I DON'T want to happen is exactly this behavior.

I checked the documentation and found nothing regarding this.

I can create a repo with a simple example, to better illustrate, if you will.

EDIT: Since I am using it with redux-form, I created a component to wrap the Super Select Field and receive redux-form's onChange, value and etc. props. Here's the code:

const SearchableSelect = ({
  input,
  children,
  disabled,
}: Props) => {
  const { value, onChange, name } = input;
  return (
    <SuperSelectField
      name={name}
      value={value}
      id="select-field"
      onChange={(v, k) => {
        if (v) {
          console.log(v, k);
          onChange(v, k)
        }
      }}
      hintTextAutocomplete="Buscar variável..."
      style={{
        marginTop: 14,
        marginBottom: 8,
        outline: 'none',
        fontSize: 16,
        whiteSpace: 'nowrap',
        overflow: 'hidden',
        textOverflow: 'ellipsis',
        justifyContent: 'flex-start',
      }}
      floatingLabelStyle={{ top: 0 }}
      disabled={disabled}
    >
      {children}
    </SuperSelectField>
  );
};

Take a look at the onChange. I tried to avoid the null behavior by only triggering the input's onChange if the value is not null. Since the value is set in the Super Select Field, my expectation was that the value is not deselected.

But this didn't happen. Instead, Super Select Field keep showing "Click Me", and the redux-form value has the previous value, because I did not changed it, trying to reflect this in the Super Select Field.

I have two screenshots of the Chrome's React Devoolt. The first one shows that the Super Select Field is receiving the value from the form that did not change:

Não selecionada stands for Not selected.

The another one shows that the SelectionPresenter keeps cleaning the value to null:

It looks like the Super Select Field is not respecting the value property.

Do you have any Idea why?