fix: can't unselect SelectedOption in FluentListBox

[cdock1029]

🐛 Bug Report

I'm not sure if this is supposed to work, but setting the bound SelectedOption variable to null so as to unset the selection does not unset the selection.

💻 Repro or Code Sample

@page "/weather"

<FluentButton @onclick="HandleClear">Clear</FluentButton>

<FluentListbox Items="@_items" @bind-SelectedOption:get="_selectedOption" @bind-SelectedOption:set="SetSelected" Multiple="false" />

<p>Selected option: @_selectedOption</p>

@code {
	List<string> _items = [
	"one",
	"two",
	"three"
	];

	string? _selectedOption;

	private void HandleClear()
	{
		_selectedOption = null;
	}

	private void SetSelected(string? str)
	{
		Console.WriteLine($"option being set {str}");
		_selectedOption = str;
	}

}

🤔 Expected Behavior

_selectedOption should be set to null, ListBox's SelectedOption bound to it, and therefore unset in the UI.

😯 Current Behavior

The console shows expected writeline statements when selecting different items in list, and the selected option reflects correctly in UI.

(click one)
>option being set one
(click two)
>option being set two
(click three)
>option being set three

But when Clear button is pressed, the console prints:

(click clear)
option being set
option being set three

_selectedOption is set to null, then immediately it is set back to the previous value. The UI stays selected.

💁 Possible Solution

null is an invalid value to set the SelectedOption to? Somewhere is there a comparison of current value and new value, if new value is null then it is reverting to current value perhaps, and this should be changed.

🔦 Context

When loading new items into the list I'm resetting _selectedOption to null. I have a view model maintaining these values so I can maintain state when navigating between pages. So it works in the normal case. But sometimes I want to reload the current list and reset the selection to unselected. When "refreshing" the same list of items, and setting selected to null, it stays selected.

🌍 Your Environment

• OS & Device: Windows 11
• Browser: Microsoft Edge and FireFox
• .NET: 8.0.2 and Fluent UI Blazor library Version: 4.10

[vnbaaij]

Hi,

There was a bug in the underlying base component where the Value was not reset if the SelectedOption got reset. I'm creating a PR (see link below) that fixes this. It will be in the next release.