@ubuilder/directives/module.js

UBuilder Directives

import{tabbable as t}from"tabbable";import{nextTick as e}from"vue";const n=t=>{t.focus()};function o(e){if("Tab"===e.key){let n=e.target;for(;null!==n&&null===n.getAttribute("data-focustrap");)n=n.parentElement;if(null===n)return;const o=t(n);if(e.preventDefault(),0===o.length)return;let u=o.indexOf(e.target);if(-1===u)return void o[0].focus();e.shiftKey?u-=1:u+=1,u===o.length?u=0:-1===u&&(u=o.length-1),o[u].focus()}}function u(n){n.setAttribute("data-focustrap",""),n.addEventListener("keydown",o),e((()=>{const e=t(n);null!==document.activeElement&&e.includes(document.activeElement)||e[0]?.focus()}))}function r(t){t.removeEventListener("keydown",o)}const i={mounted(t){u(t)},beforeUnmount(t){r(t)},inserted(t){u(t)},unbind(t){r(t)}},f=t=>{t.directive("autofocus",n),t.directive("focus-trap",i)};export{f as default,n as vAutofocus,i as vFocusTrap};