Textarea

Enables native inputs to be used within a Form field.
Overview Playground API

Usage


  <wc-textarea label="Textarea" helper-text="Optional helper text" clearable="true" placeholder="Person Name"></wc-textarea>

States

Disabled

Make input look inactive by adding the disabled boolean attribute to any <button> element.


  <wc-textarea disabled=""></wc-textarea>

Readonly

Make input look inactive by adding the disabled boolean attribute to any <button> element.


  <wc-textarea readonly=""></wc-textarea>

Events

On input change a CustomEvent wc-textarea--change is triggered by the element.


  <wc-textarea variant="default" id="name-input-field"></wc-textarea>

  <script>
    document.querySelector('#name-input-field').addEventListener('input', function(event) {
      myConsole.log(event.target.value, event.type);
    });
    document.querySelector('#name-input-field').addEventListener('change', function(event) {
      myConsole.warn(event.target.value, event.type);
    });
  </script>

On this page

UsageStatesEvents
Work in progress

Properties

Events

Methods

CSS Custom Properties

Previous Next Previous