← All demos

React

Pass an element ref to thaanaKeyboard(). It returns a cleanup function — return it from useEffect and you're done.

Source

import { useEffect, useRef } from "react";
import { thaanaKeyboard } from "thaana-keyboard-lite";

function ThaanaInput(props) {
  const ref = useRef(null);

  useEffect(() => {
    return thaanaKeyboard({ element: ref.current });
  }, []);

  return <input ref={ref} dir="rtl" {...props} />;
}