Blazor Select and Combobox re-render unnecessarily when owner component re-renders.

[atmgrifter00]

🐛 Bug Report

The NimbleSelect and NimbleCombobox components will both re-render (i.e. be disconnected and re-connected to the DOM) anytime their parent component re-renders (e.g. when it calls 'StateHasChanged()'), regardless of whether or not their parameters have changed. No other component has this issue.

The likely cause of this (that is, this seems the be the unique aspect to both of these components) is that they each use a CascadingValue in their template for the context that ultimately is passed to the contained options. I suspect this context is re-calculated every time its parent is re-rendered.

💻 Repro or Code Sample

Just running the Blazor example app will demonstrate the problem. After running, simply adding a row to the table (which will cause the ComponentsDemo component to re-render) you can see the select in the DOM re-render:

🤔 Expected Behavior

The NimbleSelect and NimbleCombobox should only re-render if their parameter state (or markup composition) has changed.

😯 Current Behavior

The NimbleSelect and NimbleCombobox always re-render when their parent re-renders.

💁 Possible Solution

This is unclear. The usage of CascadingValue to provide context to the contained options is still used by the current FluentUI Blazor Select (and other list components). They use it, primarily it seems, to manage simulating a click on an option via pressing Enter (all handled in the owning component layer). It's unclear to me what other implementation alternatives there are if we require the same behavior.

🔦 Context

Note that a solution for this issue may also have to consider #1952.

🌍 Your Environment

• OS & Device: [e.g. MacOS, iOS, Windows, Linux] on [iPhone 7, PC]
• Browser [e.g. Microsoft Edge, Google Chrome, Apple Safari, Mozilla FireFox]
• Version [e.g. 1.8.0]