tabwrap
Minimalistic utility to add tab wrapping to any element, such as dialogs and popups.
Installing
using npm
npm install @devlop/tabwrap
Usage
<div class="dialog">
<input type="text"> <!-- switch + tab here should switch focus to the last <input> -->
<input type="text">
<input type="text"> <!-- tab here should switch focus to the first <input>-->
</template>
import tabwrap from '@devlop/tabwrap';
tabwrap(document.querySelector('div.dialog'));
Simplified usage on multiple elements
If you have many places you want to add tab wrapping it can usefull to give all your elements you wish to target
the same attribute, for example data-tabwrap
, then it's easy to add tab wrapping to them all like this.
import tabwrap from '@devlop/tabwrap';
document.querySelectorAll('[data-tabwrap]').forEach(function (element) {
tabwrap(element);
});