fix: Browser DataList Not working in FluentSearch

[AathifMahir]

🐛 Bug Report

Fluent Search DataList Feature Doesn't Seem to Working Because of the DataList Needed to be on Same Scope of Input Which Wasn't the case in this Scenario and we don't have way to Add Html DataList to FluentSearch Input Control Scope and inputwrapper div for this feature to function properly

💻 Repro or Code Sample

<datalist id="colors">
<option value="red"/>
<option value="green"/>
<option value="blue"/>
<option value="yellow"/>
</datalist>
<FluentSearch DataList="colors" />

💁 Possible Solution

Provide a Us a RenderFragment or Alternative where we can Add the datalist to Proper Scope where input is, in this case input is inside the inputWrapper div, therefore dataList should be appended inside the same div

🔦 Context

i have been working on a feature for Search Feature for DataGrid which Mainly Depends on this Feature as we tried POC with different Controls and Came to Conclusion using Datalist is Most Efficient and Performant Solution for our Use Case which Contains 1000+ Suggestions for Search

🌍 Your Environment

• OS & Device: [Windows]
• Browser [Google Chrome]
• .NET and Fluent UI Blazor library Version [9.0.2 and 4.11.3]

[vnbaaij]

Fixed in next release