The DropDownButton and SplitButton exhibit the following accessibility issues:

• The screen reader cannot read the items in the DropDownButton and SplitButton popup.
• When the DropDownButton is opened with Enter, the user cannot navigate the dropdown items with the arrow keys (tested in NVDA).

I use a custom filter row for the Grid where I have added a custom component holding the filter cell content. I am saving the Grid state upon change and restoring it on initialization.

I noticed that the custom filter component is initialized before the Grid state. As a result, there is an applied filter but the input in the custom filter component does not show it.

This behaviour was new since version 6.0.0. With 5.1.1 it doesn't appear.

I am working on a form where experienced agents need to input data quickly. Often enough they know the codes and so they can type them in the combo box, but they shouldn't have to look for the mouse to select the item, the combo box should select it when the user presses Tab to move to the next field.

This should happen only when the user has filtered the combo box so they see some items (and so the dropdown is open) - I want them to be able to select only items from the available options, AllowCustom does not work for me.

---

ADMIN EDIT

Here is one workaround you can consider:

https://blazorrepl.telerik.com/QoOAPyEZ233YP2AX19

@inject IJSRuntime js

@* Move this script to a separate JS file *@
<script suppress-error="BL9992">
    function getHighligtedComboItem() {
        // Get the currently focused item in this particular ComboBox.
        var focusedItem = document.querySelector(".select-on-tab .k-list-item.k-focus");
        if (focusedItem) {
            return focusedItem.innerText;
        }
    }
</script>

<p>FirstFilteredItem: @FirstFilteredItem</p>

<p>Selected value: @ComboBoxValue</p>

<span onkeyup="@GetFirstFilteredItem">
    <TelerikComboBox Data="@ComboBoxData"
                     Value="@ComboBoxValue"
                     ValueChanged="@( (int newValue) => ComboBoxValueChanged(newValue) )"
                     TextField="@nameof(ListItem.Text)"
                     ValueField="@nameof(ListItem.Value)"
                     Filterable="true"
                     FilterOperator="@StringFilterOperator.Contains"
                     OnBlur="@SelectItemOnTab"
                     OnOpen="@( () => IsComboBoxOpen = true )"
                     OnClose="@( () => IsComboBoxOpen = false )"
                     Placeholder="Select an item..."
                     ClearButton="true"
                     Width="200px">
        <ComboBoxSettings>
            <ComboBoxPopupSettings Class="select-on-tab" />
        </ComboBoxSettings>
    </TelerikComboBox>
</span>

<input placeholder="another form element" />

@code {
    private IEnumerable<ListItem> ComboBoxData = Enumerable.Range(1, 123).Select(x => new ListItem { Text = "Item " + x, Value = x });

    private int ComboBoxValue { get; set; }

    private string FirstFilteredItem { get; set; } = string.Empty;

    private bool IsComboBoxOpen { get; set; }

    private async Task GetFirstFilteredItem(KeyboardEventArgs args)
    {
        if (!IsComboBoxOpen)
        {
            // Wait at least 300ms, which is the opening animation.
            await Task.Delay(400);
        }
        else
        {
            // Wait, depending on the typical filtering time.
            await Task.Delay(300);
        }

        // The code that will find the item text depends on the exact scenario and potential use of ItemTemplate.
        FirstFilteredItem = await js.InvokeAsync<string>("getHighligtedComboItem");
    }

    private void SelectItemOnTab()
    {
        if (!string.IsNullOrEmpty(FirstFilteredItem))
        {
            // Match the filter operation to the filter operator of the ComboBox.
            var matchingItem = ComboBoxData.Where(x => x.Text.ToLowerInvariant().Contains(FirstFilteredItem.Trim().ToLowerInvariant())).FirstOrDefault();
            if (matchingItem != null)
            {
                ComboBoxValue = matchingItem.Value;
                FirstFilteredItem = string.Empty;
            }
        }
    }

    private void ComboBoxValueChanged(int newValue)
    {
        ComboBoxValue = newValue;
        FirstFilteredItem = string.Empty;
    }

    public class ListItem
    {
        public int Value { get; set; }
        public string Text { get; set; } = string.Empty;
    }
}

I am testing with a Blazor WASM Standalone app that uses Telerik UI for Blazor. I have a sample page with a button on click of which a predefined dialog (for example, alert) is shown. If you make some change on the page and hot reload is enabled, the button click no longer opens the predefined dialog. The dialog is shown only if I navigate to a different page.

Here are some details on the issue I am referring to:

• The problem only occurs when there is at least one item selected.
• If the focus is on the chip/selected item, you can properly navigate back to the previous input with Shift+Tab.
• If the focus is on the input, though, then you cannot use Shift+Tab to navigate back to the previous input/focusable element.

Reproduction: https://blazorrepl.telerik.com/GJkdbBvJ44uuG3fF40.

When the MaskedTextBox is not focused and has no value, the Floating Label displays over the textbox as expected, however, the mask itself remains visible.

Here is a test example with a CSS workaround:

<TelerikFloatingLabel Text="Floating Label Over Mask">
    <TelerikMaskedTextBox @bind-Value="@MaskedValue"
                          Mask="000-000"
                          Width="200px"
                          Class="mask-with-label" />
</TelerikFloatingLabel>

@if (string.IsNullOrEmpty(MaskedValue))
{
    <style>
        .mask-with-label input:not(:focus) {
            color: transparent;
        }
    </style>
}

@code {
    private string MaskedValue { get; set; } = string.Empty;
}

Reproduction: https://blazorrepl.telerik.com/QJEJlAvY33zlToJO18.

To reproduce:

step 1: observe that cells div.k-spreadsheet-fixed-container fills div.k-spreadsheet-view
step 2: Move the splitter handler to left
step 3: Observe that the div.k-spreadsheet-view width is adjusted to the new size of its parent, but div.k-spreadsheet-fixed-container is not.

Expected:  Spreadsheet component handles updating the size its parts.

===

ADMIN EDIT

===

A possible workaround for the time being is to simulate the browser resize event - the Spreadsheet is properly resized in this case. 

Here is how to achieve that: https://blazorrepl.telerik.com/wzOfQbEW38JtEjFD36.

I want to filter a Grid by DateTimeOffset? field

===ADMIN EDIT===

There are two possible options:

1. Use a DTO in which you have a DateTime field converted as desired by your app from the DateTimeOffset. Filtering, sorting, editing, and grouping on DateTime values are supported out-of-the-box.

REPL example that demonstrates this approach. 

2. Use the Grid Filter Template. As a filter editor, you can use the DateTimePicker component, which supports the DateTimeOffset type. 

REPL example that demonstrates this approach. 

I have a scenario in which we have user definable columns for a grid, including hundreds if not thousands that need to be ported from the old version of our product. This means these column keys would be strings that may contain spaces or even special characters - and as such cannot be a valid C# property name (which means using an ExpandoObject approach will not work)

It would be really beneficial if the TelerikGrid component could be given Data of an IEnumerable<Dictionary<string, object>> where the Field property of GridColumn (or a new property) would line up with a key in that dictionary rather than a field name for the component to then use reflection with.

A customer with multiple modules of our product installed may very well have columns with similar names, i.e "Some Key", "SomeKey", "Some_Key", "Some & Key" - so simply replacing spaces or special characters may not always still give unique keys.

When you create or paste a table, you cannot move the cursor outside of it if there is no other content in the Editor.

----------ADMIN EDIT----------

Here is a possible workaround when using InsertTable() tool:

@using Telerik.Blazor.Components.Editor

<TelerikButton OnClick="@InsertTable">Insert Table</TelerikButton>

<TelerikEditor @ref="@TheEditor" Value="@TheContent" ValueChanged="@ValueChangedHandler"></TelerikEditor>

@code {
    TelerikEditor TheEditor { get; set; }

    string TheContent { get; set; } = "<p>Lorem ipsum.</p><p>Dolor sit amet.</p>";

    void ValueChangedHandler(string value)
    {
        var checkEnd = value.EndsWith("</table>");

        TheContent = checkEnd == true ? value + "<p></p>" : value;
    }

    async Task InsertTable()
    {
        await TheEditor.ExecuteAsync(new TableCommandArgs(4, 4));
    }
}

Steps:

• Use the Editor's ValueChanged event.
• See if the value ends with a closing </table> tag.
• Append an empty paragraph to the Editor value - "<p></p>".

Please provide item templates for the file list, similar to:

• https://www.telerik.com/kendo-angular-ui/components/uploads/upload/templates/
• https://demos.telerik.com/kendo-ui/upload/templates

Hello,

after selecting a block of text in your editor and perform some block operation (for instance - change font size, name, ..) the original selection is lost. Would it be possible to keep that selection please?

Very thanks.

Miroslav

Support the recurrence rule to create multiple appointments per time slot. Examples of such rules are:

FREQ=DAILY;BYDAY=MO,TU,WE,TH,FR,SA,SU;BYHOUR=08,09,10,11,12,13,14,15,16;BYMINUTE=50

I have created an event series with the following RecurrenceRule:

RecurrenceRule = "FREQ=DAILY;BYDAY=MO,TU,WE,TH,FR"

However, it looks like the collection of days is not taken into consideration and the events are created for every day of the week as if I have only set:

RecurrenceRule = "FREQ=DAILY"

---

ADMIN EDIT

---

A possible workaround for the time being is to use  "FREQ=WEEKLY" and extend the occurrence to the desired days of the week. For example, targeting the "Morning run" appointment: https://blazorrepl.telerik.com/cQuiFGOK01nSotIT28.