Regarding Mobile Compatibility

[AmalChandru]

Instead of keypress event input event seems to work for mobile devices. By checking the user-agent, we can dynamically select which event to be fired ( ie input for mobile and keypress for desktop). @KSubedi What are your thoughts?

[vishruti-ajmera]

I have same issue input tool not working in mobile. I HAVE ALSO TRIED KEYDOWN AND INPUT EVENT IN BUNDLE JS FILE. Please help me to fix this issue as soon as possible.

[AmalChandru]

I have been successful in doing the same on mobile devices by making a dynamic selection of the event based on the user agent.

Use a boolean to check whether the device is mobile or not.

const isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);

Select the event according to isMobile.

return (
             (t.prototype.registerListeners = function () {
              this.transliterationProvider.inputArea.addEventListener(
              isMobile ? "input" : "keypress",
              this.handleKeyPress()
            );

Manage both mobile and web independently

(t.prototype.handleKeyPress = function () {
                       var t =
                           "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz".split(
                               ""
                           );
                       return function (e) {
                           if (isMobile) {
                               const text =
                                   this.transliterationProvider.inputArea
                                       .value;

                               if (-1 !== t.indexOf(e.data)) {
                                   this.transliterationProvider.inputArea.value =
                                       text.slice(0, -1);
                                   this.transliterationProvider.suggestionBox.startSuggestions(
                                       e.data
                                   );
                               } else if (
                                   e.inputType === "insertText" &&
                                   -1 === t.indexOf(e.data)
                               ) {
                                   this.transliterationProvider.suggestionBox.endSuggestions();
                                   this.transliterationProvider.inputArea.value =
                                       text.slice(0, -1) + e.data;
                               } else if (e.inputType === "insertLineBreak") {
                                   this.transliterationProvider.inputArea.value =
                                       text + "\n";
                               } else if (
                                   e.inputType === "deleteContentBackward"
                               ) {
                                   this.transliterationProvider.inputArea.value =
                                       text.slice(0, -1);
                               }
                           } else {
                               -1 !== t.indexOf(e.key) &&
                                   (this.transliterationProvider.suggestionBox.startSuggestions(
                                       e.key
                                   ),
                                   e.preventDefault());
                           }
                       }.bind(this);
                   }),
                   t
               );
           })();
           e.EventHandler = i;
       }

Note: In the case of mobile implementation you have to manage edge cases and tweak the styles as per the context

[vishruti-ajmera]

Thank you so much. Your answer working perfect. Just has syntax error in 6th last line.
}.bind(this); }, t ); })(); e.EventHandler = i; }