Here is a perfect example
https://blazor.syncfusion.com/demos/input-mask/forms-validation?theme=fluent

When you type into a form that has a phone number mask you can start typing in the middle, the end and there is nothing that moves the cursor to the last typed character or the beginning of the input.

Lets say I have a phone mask of this

(###) ###-####

A user clicks in the phone input text box and starts typing right where they clicked. In this case they start in the in the middle of the input so it would end up looking like this

(###) 123-4##

This is incorrect.
Each character should only appear after the previous no matter where the user clicks in the form to start typing. If they start at the 10th slot should move them to the start index or in the case below right after the number 4

so it essentially should look like this

(123) 4##-####

if they click in the last index of the mask it will move them to the first index or where ever the last character was typed.

How can I do that in Blazor or C# or Angular it really doesn’t matter. The behavior exists on any html element input box