Tile.css:

.disabled {
  background: #efefef;
  pointer-events: none;
}

.enabled {
  background: #fff;
}


Tile.js:

import React from "react";
import style from "./Tile.css";

const Tile = props => (
  <>
    <input
      id={props.id}
      onChange={props.onChange}
      value={props.value === "." ? "" : props.value}
      className={props.value === "." ? style.enabled : style.disabled}
      key={props.id}
      type="number"
      min="1"
      max="9"
    />
  </>
);

export default Tile;