Usage of the Left-to-Right mark to enforce LTR behaviour despite the specified direction.

InputLTR.js

import React, { useState } from "react";

const LEFT_TO_RIGHT_MARK = "‎\u200e"; // marks the input with LTR despite the specified direction

function InputLTR() {
  const [cardNumber, setCardNumber] = useState("");

  function onInputChange(event) {
    const newCardNumber = event.target.value.replace(LEFT_TO_RIGHT_MARK, "");
    setCardNumber(newCardNumber);
  }

  return (
      <input
        name="cardNumber"
        type="text"
        value={LEFT_TO_RIGHT_MARK + cardNumber}
        onChange={onInputChange}
      />
  );
}