The documented lazy loading scenario is not compatible with Telerik UI for Blazor 15.0.0, because of the new ITelerikIconService. Unlike the ITelerikStringLocalizer, there is no alternative way to register this icon service outside Program.cs.

Bug report

Reproduction of the problem

(bug report only)
The DropDownList (and other dropdown components - ComboBox, MultiColumnComboBox, etc.) render a redundant attribute in their popup ul element: aria-live="polite". Listboxes that use aria-activedescendant for tracking should not also announce via a live region — this creates duplicate/conflicting announcements by screen readers.

Current behavior

(optional)
The popup’s ul element renders aria-live=”polite”.

Expected/desired behavior

Either render aria-live=”off” (e.g., Kendo Angular DropDownList), or don’t render the aria-live attribute at all.

Environment

• Kendo/Telerik version:
• jQuery version: x.y
• Browser: [all]

I have been having issues adding the month view to a Telerik Blazor scheduler component, when there is grouping. It gives a null reference error any time I try to switch to the month view. I also tried it using the available demo for grouping in Telerik REPL, the only difference I found between my code and the demo was that I had used the ItemsPerSlot parameter.  I added this to the demo, and was able to reproduce the error I was seeing, and I have attached the console output from the REPL demo. I believe there is either a bug with the ItemsPerSlot being used in conjunction with grouping on a scheduler component, or some instruction missing from how to set it up properly to prevent this null reference issue. 

Changed code:

<SchedulerMonthView ItemsPerSlot="5"></SchedulerMonthView>

Demo used:

Blazor Scheduler (Event Calendar) Demos - Grouping | Telerik UI for Blazor

The ComboBox and MultiColumnComboBox retain their TextField string label when the value is cleared programmatically. The issue starts to occur in version 14.1.0.

Test Page:

<ul>
    <li><code>AutoCompleteValue</code>: @AutoCompleteValue</li>
    <li><code>SelectedValue</code>: @SelectedValue</li>
    <li><code>SelectedValueNullable</code>: @SelectedValueNullable</li>
    <li><code>MultiSelectValues</code>: @string.Join(", ", MultiSelectValues)</li>
</ul>

<p>
    <TelerikButton OnClick="@(() => {
        AutoCompleteValue = string.Empty;
        SelectedValue = default;
        SelectedValueNullable = default;
        MultiSelectValues = new();
    })">Clear Values</TelerikButton>
</p>

<TelerikAutoComplete Data="@ListItems"
                     @bind-Value="@AutoCompleteValue"
                     ValueField="@nameof(ListItem.Text)"
                     Placeholder="Select Item"
                     ShowClearButton="true"
                     Width="300px" />

<br /><br />

<TelerikComboBox Data="@ListItems"
                 @bind-Value="@SelectedValue"
                 TextField="@nameof(ListItem.Text)"
                 ValueField="@nameof(ListItem.Id)"
                 Placeholder="Select Item"
                 ShowClearButton="true"
                 Width="300px" />

<TelerikComboBox Data="@ListItems"
                 @bind-Value="@SelectedValueNullable"
                 TextField="@nameof(ListItem.Text)"
                 ValueField="@nameof(ListItem.Id)"
                 Placeholder="Select Item"
                 ShowClearButton="true"
                 Width="300px" />


<br /><br />

<TelerikDropDownList Data="@ListItems"
                     @bind-Value="@SelectedValue"
                     TextField="@nameof(ListItem.Text)"
                     ValueField="@nameof(ListItem.Id)"
                     DefaultText="Select Item"
                     Width="300px" />

<TelerikDropDownList Data="@ListItems"
                     @bind-Value="@SelectedValueNullable"
                     TextField="@nameof(ListItem.Text)"
                     ValueField="@nameof(ListItem.Id)"
                     DefaultText="Select Item"
                     Width="300px" />

<br /><br />

<TelerikMultiColumnComboBox Data="@ListItems"
                            @bind-Value="@SelectedValue"
                            TextField="@nameof(ListItem.Text)"
                            ValueField="@nameof(ListItem.Id)"
                            Placeholder="Select Item"
                            ShowClearButton="true"
                            Width="300px">
    <MultiColumnComboBoxColumns>
        <MultiColumnComboBoxColumn Field="@nameof(ListItem.Id)" />
        <MultiColumnComboBoxColumn Field="@nameof(ListItem.Text)" />
    </MultiColumnComboBoxColumns>
</TelerikMultiColumnComboBox>

<TelerikMultiColumnComboBox Data="@ListItems"
                            @bind-Value="@SelectedValueNullable"
                            TextField="@nameof(ListItem.Text)"
                            ValueField="@nameof(ListItem.Id)"
                            Placeholder="Select Item"
                            ShowClearButton="true"
                            Width="300px">
    <MultiColumnComboBoxColumns>
        <MultiColumnComboBoxColumn Field="@nameof(ListItem.Id)" />
        <MultiColumnComboBoxColumn Field="@nameof(ListItem.Text)" />
    </MultiColumnComboBoxColumns>
</TelerikMultiColumnComboBox>

<br /><br />

<TelerikMultiSelect Data="@ListItems"
                    @bind-Value="@MultiSelectValues"
                    TextField="@nameof(ListItem.Text)"
                    ValueField="@nameof(ListItem.Id)"
                    Placeholder="Select Items"
                    ShowArrowButton="true"
                    ShowClearButton="true"
                    AutoClose="false"
                    Width="600px" />

@code {
    private List<ListItem> ListItems { get; set; } = new();

    private int SelectedValue { get; set; } = 3;
    private int? SelectedValueNullable { get; set; } = 3;
    private string AutoCompleteValue { get; set; } = "Item 3";

    private List<int> MultiSelectValues { get; set; } = new() { 3, 5 };

    protected override void OnInitialized()
    {
        ListItems = new List<ListItem>();

        for (int i = 1; i <= 24; i++)
        {
            ListItems.Add(new ListItem()
            {
                Id = i,
                Text = $"Item {i}"
            });
        }

        base.OnInitialized();
    }

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

At the moment, typing with the keyboard focuses the first item that starts with the last letter you pressed. To focus the next one you should either use Down Arrow, or type the same letter again.

I would like it to behave like the regular <select> or like a combo box with filtering - typing characters quickly should highlight the item that begins with all those characters, instead of using only the first letter.

=== 

Admit edit: some keywords for better findability: DropDownList keyboard search filter accessibility

Bug report

Reproduction of the problem

(bug report only)
Regression introduced in 13.0.0.
1. Run this example: https://blazorrepl.telerik.com/wUuSGClv00orFeRm59

Current behavior

(optional)
The Size, Rounded, FillMode parameters are ignored.

Expected/desired behavior

The parameter values should apply and change the appearance of the SearchBox.

Environment

• Browser: [all ]

I am resetting the Grid State by calling Grid.SetState(null). This doesn't reset ColumnState<T>.Locked boolean to false and the columns remain locked.

---

ADMIN EDIT

---

A possible workaround for the time being is to additionally loop through the ColumnStates collection of the State and set the Locked property to false for each column.

Example: https://blazorrepl.telerik.com/QTYmkpvb49c6CPxa42

When Adaptive = true, changing the collection of buttons seems to "break" the adaptive calculation. The Toolbar fails to determine what are the buttons to show in the main element and what are the buttons to show in the pop-up: https://blazorrepl.telerik.com/wSubOWlS08FLz7aZ54

===

ADMIN EDIT

For the time being, a possible workaround is to force the component to refresh when you change the buttons. For that purpose, you can dispose it and re-initialize it after some delay. Here is a runnable sample: https://blazorrepl.telerik.com/QIOFuCvS400o5tfL34.

I've determined that the TelerikDateTimePicker does not work properly on mobile devices when using AdaptiveMode.Auto. Attached are videos of the component's behaviour in both modes (None, and Auto).

Immediately after interacting with the fullscreen popup of the datepicker, I see this error in the console:

RAW:
telerik-blazor.js:50 Uncaught TypeError: r.isParent is not a function
    at p.isChild (telerik-blazor.js:50:1362352)
    at f.closePopup (telerik-blazor.js:50:1398427)
    at HTMLHtmlElement.onMouseDown (telerik-blazor.js:50:1397246)

Code:

@using Telerik.Blazor.Components
@using Telerik.Blazor

<TelerikFloatingLabel Text="Date & Time">
    <TelerikDateTimePicker Id="date-picker" @bind-Value="MyFormModel.Date" Max="@DateTime.Now.AddDays(1)"
                           Format="@DATE_FORMAT" AdaptiveMode="AdaptiveMode.Auto"
                           FillMode="@Telerik.Blazor.ThemeConstants.DateTimePicker.FillMode.Flat" />
</TelerikFloatingLabel>

@code {
    private FormModel MyFormModel { get; set; } = new FormModel();
    private const string DATE_FORMAT = "MM/dd/yyyy HH:mm";

    private class FormModel
    {
        public DateTime Date { get; set; }
    }
}

Notes:
- If we remove all of the parent components wrapping the DatePicker, it seems to function properly, but the errors remain in the console. This isn't a solution, however.

I am using ComboBox and I want to be able to filter by two model properties. To achieve this I have implemented custom filtering through the OnRead event. Additionally, I am ordering the data to first match the results from the one property, which also is used for the TextField, and after that to match the results from the other property. However, when the results are only from the match of the second property, there is no focus.

Here is a REPL example https://blazorrepl.telerik.com/wyaMQhEN108axXJ036 

Steps to reproduce the issue:

Type "a": "Value test - ano" has the focus (the first option in the list)

Type "an": "Value test - ano" receives the focus (the first option in the list)

Type "ano": "Value test - ano" receives the focus (the first option in the list)

Type "anot": no item has focus despite the results being only "Another Value - val"

When SchedulerGroupOrientation is set to vertical, increasing the height of the `SchedulerResourceGroupHeader` breaks the rendering of the Scheduler cells, which causes misalignment of the appointments. In my scenario, I want to have a Button and an Icon in the group header cell.

Reproduction example: https://blazorrepl.telerik.com/wJElGYvF02XSsN6j42

This is a continuation of public item DatePicker, TimePicker and DateTimePicker should accept null value as valid when bound to nullable DateTime

The problem persist when:

• The component Format includes a week day.
• The component Format is set with a standard date format string (d, D, g, etc.)

Test page with workarounds:

Bug due to week day format string inconsistency between .NET and JavaScript (dddd vs EEEE):

<TelerikDateTimePicker @bind-Value="@SelectedTime"
                       ShowClearButton="true"
                       Width="360px">
    <DateTimePickerFormatPlaceholder Weekday="week" />
</TelerikDateTimePicker>

<br />
<br />

Bug due to usage of a standard date format string:

<TelerikDatePicker @bind-Value="@SelectedTime"
                   ShowClearButton="true"
                   Format="d"
                   Width="360px">
    <DateTimePickerFormatPlaceholder Day="dd" Month="mm" Year="yyyy" />
</TelerikDatePicker>

@code {
    private DateTime? SelectedTime = DateTime.Now;
}

We upgraded to the latest Telerik Blazor components (8.1.1).
I think there's a bug in the TabStrip when setting the index of the ActiveTabIndex or @bind-ActiveTabIndex.
The page will scroll to the active tab automatically.

Here's a link to the Repl - https://blazorrepl.telerik.com/GfaTEmbR45zQSzEq44

If you remove @bind-ActiveTabIndex="@ActiveTabIndex" from the TelerikTabStrip then the page load normally.

Thanks,

Cesar

Currently, a TextField value of empty string will produce a blank item in the dropdown.

On the other hand, a null TextField value will produce the fully qualified class name.

Here are possible workarounds: https://blazorrepl.telerik.com/myOlFpFb1465jW8E07