Disabled state

The widget can be disabled at init time, or toggled at runtime via settings(). A disabled widget blocks all input, hides chip remove buttons, and adds the .taga11y--disabled class to the wrapper.

Select a language

View code

<label for="tags">Select a language</label>
<input id="tags" type="text" name="languages" />

<div class="controls">
  <button id="btn-disable">Disable</button>
  <button id="btn-enable">Enable</button>
</div>

<script type="module">
  import { Taga11y } from '../dist/taga11y.mjs';

  const input = document.getElementById('tags');

  const taga = new Taga11y(input, {
    suggestions: ['C', 'Go', 'Java', 'JavaScript', 'Python', 'Rust', 'TypeScript'],
    disabled: true,
  });

  document.getElementById('btn-disable').addEventListener('click', () => {
    taga.settings({ disabled: true });
  });

  document.getElementById('btn-enable').addEventListener('click', () => {
    taga.settings({ disabled: false });
  });
</script>