fix: I can not use arrow keys in FluentTextArea inside a FluentDataGrid

[Ogglas]

🐛 Bug Report

I can not use arrow keys in FluentTextArea inside a FluentDataGrid. It works perfectly outside a FluentDataGrid

💻 Repro or Code Sample

<FluentDataGrid RowsData="@people">
    <TemplateColumn Title="TextArea">
        <FluentTextArea @bind-Value=value1></FluentTextArea>
    </TemplateColumn>
</FluentDataGrid>

@code {
    string value1;

    record Person(int PersonId, string Name, DateOnly BirthDate);

    IQueryable<Person> people = new[]
    {
        new Person(10895, "Jean Martin", new DateOnly(1985, 3, 16)),
        new Person(10944, "António Langa", new DateOnly(1991, 12, 1)),
        new Person(11203, "Julie Smith", new DateOnly(1958, 10, 10)),
    }.AsQueryable();
}

[vnbaaij]

Hi, this one has already been raised to the FAST team: microsoft/fast#6500

[Ogglas]

I hope it will be fixed soon then! Did you get a change to look at the sort of related #217?

[vnbaaij]

Oooh, I actually got a fix for this!! Can fix it outside of web-components script (with help from former FAST team member). Will now look #217 again...

[vnbaaij]

Will be fixed with next release. Please verify it works here: https://calm-sea-053fa6a03-421.westeurope.3.azurestaticapps.net/DataGrid#template-columns-2

[Ogglas]

@vnbaaij Nice! However it only seems to be partially fixed. Using a virtualized data grid it still does not work. Example:

<FluentDataGrid RowsData="@people" Virtualize="true" RowsDataSize="100">
    <TemplateColumn Title="TextArea">
        <FluentTextArea @bind-Value=value1></FluentTextArea>
    </TemplateColumn>
</FluentDataGrid>

@code {
    string value1;

    record Person(int PersonId, string Name, DateOnly BirthDate);

    IQueryable<Person> people = new[]
    {
        new Person(10895, "Jean Martin", new DateOnly(1985, 3, 16)),
        new Person(10944, "António Langa", new DateOnly(1991, 12, 1)),
        new Person(11203, "Julie Smith", new DateOnly(1958, 10, 10)),
    }.AsQueryable();
}

[vnbaaij]

Yes, confirmed it does not work with a virtualized grid. No idea how to fix that though...

Tried a number of things but with the Virtualize the javascript does not see the rows in the grid reference in the init method

[Ogglas]

Thanks anyway! Created a new issue to track the bug: #435

Can FAST solve it on their side?

[vnbaaij]

A fix had just been submitted for this: microsoft/fast#6754. We have to get it in the right branch and pushed to the Fluent script and then test it, so might still take some time.