@momentum-ui/react-collaboration/scss/components/editable-textfield/examples/default.html

Cisco Momentum UI Framework for React Collaboration Applications

  <!-- unfocussed state -->
  <span class="md-editable-textfield md-editable-textfield--left">
    <div role="button" class="md-editable-textfield__button">Hello World</div>
  </span>
  <!-- button div is replaced by input when focused -->
  <span class="md-editable-textfield md-editable-textfield--left">
    <div class="md-input-container md-editable-textfield__editing">
      <input class="md-input" type="text" value="Hello World">
    </div>
  </span>