title: How to replace text in textarea with a mat-chip?
body: <p>In my case I have a textarea where the user can create a template for an email with variables.
  A valid variable name would be '$TIMESTAMP$'. The user can switch the input between text- and visual-mode. In the visual-mode all variables should be replaced with a mat-chip for better visualization but the text should still be editable.</p>
  <p>Is there a way to solve my problem?</p>
  <p>PS: If possible I just want to use material components not other external libraries.</p>
  <p>Edit:
  <a href="https://i.stack.imgur.com/40a6p.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/40a6p.png" alt="enter image description here" /></a></p>