state = {
  text: '',
  limit: 10
};

render() {
  const { text, limit } = this.state;
  return (
    <div>
      <input type="text" value={text} onChange={this.handleChange} />
      <p>Characters remaining: {limit - text.length}</p>
    </div>
  );
}

handleChange = (event) => {
  const { value } = event.target;
  const { limit } = this.state;
  
  if (value.length <= limit) {
    this.setState({ text: value });
  }
}