Character Counter

<tk-character-counter
count-down="true"
input-size="medium"
max-length="200"
placement="bottom"
warning-text="Try breaking down larger tasks and questions"

>   <label class="form__label form__label--stacked">

    Task
    <textarea
      oninput="characterCountExampleChanged(event)"
      class="form-input form-input--textarea"
    ></textarea>

  </label>
</tk-character-counter>

<script>
  const characterCounterElement = document.getElementsByTagName('tk-character-counter')[0];
  const characterCountExampleChanged = (event) => {
    characterCounterElement.setAttribute('text', event.srcElement.value)
  }
</script>