I'm using the Editor in a form along with several other inputs (e.g. TextBox, NumericTextBox).

If the user enters an invalid value for the other inputs, they get a red border. The Editor, however, does not have such a border when its value is invalid and thus the form elements are not consistent. Please add a red border for the invalid state of the Editor, too.

===

ADMIN EDIT

===

At this stage, the Editor is not treated as a standard input and it does not support all of the input's capabilities - such as invalid state, disabled state, sizing, fill and more.

The current request may potentially be part of a bigger design story that strives to align the Editor's functionalities with the rest of the inputs ( TextBox, NumericTextBox and more).

The Font Size and Font Family tools display the currently applied style value in the user selection only if the selection is inside one HTML element. This prevents the user from resetting (removing) the current font style.

Test scenario:

1. Select all the Editor content and apply a custom font size or font family.
2. Select content, which has the same styles applied (for example, the 2nd and 3rd "foo" on line 1).
3. Select content, which has different styles applies (for example, the 1st and 2nd "foo" on line 1).
4. Select content in multiple paragraphs (for example, the last "foo" and the first "bar").

@using Telerik.Blazor.Components.Editor

<TelerikEditor @bind-Value="@EditorValue"
               Tools="@EditorToolSets.All" />

<h2>Raw Editor Value</h2>

<TelerikTextArea @bind-Value="@EditorValue"
                 Rows="5" />

@code {
    private string EditorValue { get; set; } = @"<p><strong>Foo</strong> foo foo.</p><p>Bar <strong>bar</strong> bar.</p><p>Baz baz <strong>baz</strong>.</p>";
}

The possible workarounds are:

• Reset (remove) the font styles separately for each HTML element.
• Set another font style instead of resetting it.

Hello,

the Color Tool Customization in the Telerik Editor is not working correctly. Colors are only generate HTML in Rgb.

The documentation says: "ValueFormat":  The format, which the Color tool will set in the generated HTML markup. Use Rgb or Hex.

Thanks in advance.

For example: https://docs.telerik.com/blazor-ui/components/editor/built-in-tools#color-tool-customization

@using Telerik.Blazor.Components.Editor

<TelerikEditor Tools="@EditorTools"
               @bind-Value="@EditorValue">
</TelerikEditor>

@code {
    private string EditorValue { get; set; }

    private List<IEditorTool> EditorTools { get; set; } = new List<IEditorTool>()
    {
        new ForeColor()
        {
            Title = "Text Color",
            Colors = new List<string> { "#f00", "#ff9900", "rgb(0, 128, 0)", "rgba(0, 0, 255, .8)" },
            ValueFormat = ColorFormat.Hex
        },
        new ViewHtml()
    };
}

Please allow the user to copy an image from the file system (for example, Windows Explorer) and paste it in the Editor without opening the image first.

Currently this works in the Kendo UI jQuery Editor.

The Telerik Blazor Telerik Editor Insert Hyperlink functionality is not consistent with other Telerik Editor components and non Telerik Editors. Usually when dealing with Editors and the Insert Hyperlink feature, you can insert a hyperlink without need to select and convert existing text. You can also usually use the ctrl+k keyboard shortcut instead of clicking on the button. This does not work in the Telerik Blazor Editor.

The differences and lack of functionality has been raised as an issue by end users.

Expected Behaviour

1. Ensure no text is selected. The Insert Hyperlink button should be enabled.
2. Click the Insert Hyperlink button or press ctrl+k.
3. Enter values for web address, text, tooltip and "open link in new window".
4. Click insert. An anchor tag with the given text, link, etc. is created.

This can be reproduced on any of the Kendo UI for jQuery demo pages. It can also be reproduced within the editor on this very form.

Actual Behaviour

1. Ensure no text is selected. The Insert Hyperlink button is not enabled and cannot be clicked.
2. You must select existing text to be able to convert it to a hyperlink.

This can be reproduced on any of the demo pages that has the hyperlink button.

I am using the LinkCommandArgs to programmatically create a link. I am adding all the required parameters (string href, string text, string target, string title) but no link is added to the Editor content.

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

===

ADMIN EDIT

===

For the time being, you may add a link using the HtmlCommandArgs tool and the "insertHtml" command like so: https://blazorrepl.telerik.com/GyuTmMkt56f3YiM754.

The Editor currently supports only numeric ordered list. I'm looking for an option to add different types of ordered lists - roman and alphabetical.

Please add support for these types of ordered lists similiar to the KendoReact Editor.

The Editor is not showing its Value in the following scenario:

• Using JSInterop in OnAfterRenderAsync
• Setting the Editor Value in OnAfterRenderAsync and after the JSInterop call
• Blazor Server app (seems to work in WebAssembly)

Possible workarounds are:

• Set the Editor Value and call StateHasChanged() before using JSInterop in OnAfterRenderAsync, or
• Add some small delay (for example, await Task.Delay(100); ) before using JSInterop.

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

I would like to use the Editor in a more compact matter in my application. The buttons and button groups must be small, and the margins and the paddings must be smaller as well. 

The overall goal is to make the Editor take less amount of space in the UI. 

Description : 
When you click before the content in the Editor, the cursor should show up before the text. But, if a text was added programmatically, the cursor shows up after the added text instead.

To reproduce the problem :

1. Open this REPL example: https://blazorrepl.telerik.com/cdYpPabd37jvK9jt23

2. Click the "Insert Inline Text" button.

3. Try to place the cursor in front of the editor content.

I have the following command

await _editorRef.ExecuteAsync(new HtmlCommandArgs("insertHtml", "<hr class='donotremove' />", false));

Currently, the <hr/> element is added but its class is stripped. This is not the case with other elements. 

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

Please allow adding class to <hr/> elements, too.

Currently, our Editor component does not support a placeholder parameter. Having a placeholder parameter, similar to the Kendo UI Editor, would prove to be beneficial.

It seems that texts/options in the Format tool dropdown are not part of the localization (Paragraph, Heading 1..6).

Editor demo

===

ADMIN EDIT

===

A possible workaround for the time being is to customize the built-in Format tool to add your desired labels for the format options.

Hello,

We've come across a bug. It seems as whatever tool button(s) that should be selected is not shown correctly. It appears to show the previously selected.

Repro steps:

1. Write two different formatted texts on separate lines in your Editor component.
2. Move the cursor to the first line
3. Move the cursor to the second line that has a different formatted text. Note that the tool button for the formatted text on the first line is shown as selected.
   
   This should happen:
   

Is this an intended behaviour? Our users are confused :)

/Patrik

Hello,

We are adding references to other documents via a drag an drop over the text as a superscript hyperlinks. Our users are complaining that when we drag and drop onto the Blazor editor control, it is hard to see exactly where the drop is going to be.

The Kendo UI Editor supports this.