vue-a11y-directives 1.2.0 → 1.2.2

package/dist/vue-a11y-directives.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const U=["BUTTON","A","INPUT","TEXTAREA","SELECT","IFRAME"],F={mounted(e,a){const t=typeof a.value=="object"?a.value:{delay:a.value||0},n=t.delay||0,i=t.select||!1;U.includes(e.tagName)||e.hasAttribute("tabindex")||e.hasAttribute("contenteditable")||(e.setAttribute("tabindex","0"),e.__a11yFocusAddedTabindex=!0),setTimeout(()=>{e.focus&&(e.focus(),i&&(e.tagName==="INPUT"||e.tagName==="TEXTAREA")&&e.select())},n)},unmounted(e){e.__a11yFocusAddedTabindex&&(e.removeAttribute("tabindex"),delete e.__a11yFocusAddedTabindex)}};function v(e){if(!e)return[];const a=["a[href]","button:not([disabled])","textarea:not([disabled])",'input:not([disabled]):not([type="hidden"])',"select:not([disabled])",'[tabindex]:not([tabindex="-1"])','[contenteditable="true"]',"audio[controls]","video[controls]"];return Array.from(e.querySelectorAll(a.join(", "))).filter(n=>{const i=window.getComputedStyle(n);return n.offsetWidth>0&&n.offsetHeight>0&&i.visibility!=="hidden"&&i.display!=="none"})}function h(e,a){Object.entries(a).forEach(([t,n])=>{n!=null&&e.setAttribute(t,n)})}function R(e,a){a.forEach(t=>{e.removeAttribute(t)})}function E(e,a="polite"){const t=document.createElement("div");t.setAttribute("role","status"),t.setAttribute("aria-live",a),t.setAttribute("aria-atomic","true"),t.style.position="absolute",t.style.left="-10000px",t.style.width="1px",t.style.height="1px",t.style.overflow="hidden",document.body.appendChild(t),setTimeout(()=>{t.textContent=e},100),setTimeout(()=>{document.body.removeChild(t)},3e3)}function B(e){const a=v(e);return a.length>0?a[0]:null}function V(e){const a=v(e);return a.length>0?a[a.length-1]:null}function X(e){return e.contains(document.activeElement)}function $(){return document.activeElement}function J(e){e&&e.focus&&e.focus()}function W(e="a11y"){return`${e}-${Math.random().toString(36).substr(2,9)}`}const O={mounted(e,a){const t=a.value||{},n=t.autoFocus!==!1,i=t.onEscape||null,r=document.activeElement;e.__previousFocus=r,n&&setTimeout(()=>{const d=v(e);d.length>0&&d[0].focus()},100);const o=d=>{if(d.key!=="Tab")return;const y=v(e);if(y.length===0)return;const _=y[0],m=y[y.length-1];d.shiftKey&&document.activeElement===_?(d.preventDefault(),m.focus()):!d.shiftKey&&document.activeElement===m&&(d.preventDefault(),_.focus())},s=d=>{d.key==="Escape"&&i&&(d.preventDefault(),d.stopPropagation(),i())};e.addEventListener("keydown",o),e.__handleKeydown=o,i&&(document.addEventListener("keydown",s,!0),e.__handleEscape=s)},unmounted(e){e.__handleKeydown&&(e.removeEventListener("keydown",e.__handleKeydown),delete e.__handleKeydown),e.__handleEscape&&(document.removeEventListener("keydown",e.__handleEscape,!0),delete e.__handleEscape),e.__previousFocus&&(setTimeout(()=>{if(e.__previousFocus&&document.body.contains(e.__previousFocus)&&typeof e.__previousFocus.focus=="function")try{e.__previousFocus.focus()}catch(a){console.warn("Could not restore focus:",a)}},0),delete e.__previousFocus)}},P={mounted(e,a){const t=a.value||{};console.log("Keyboard directive mounted with config:",t);const n=i=>{console.log("Key pressed:",i.key,"Config:",t);const r={Enter:"enter"," ":"space",Escape:"escape",ArrowUp:"arrowUp",ArrowDown:"arrowDown",ArrowLeft:"arrowLeft",ArrowRight:"arrowRight",Tab:"tab",Delete:"delete",Backspace:"backspace"};let o="";(i.ctrlKey||i.metaKey)&&(o+="ctrl+"),i.altKey&&(o+="alt+"),i.shiftKey&&(o+="shift+"),o+=i.key.toLowerCase();const s=r[i.key];if(s&&typeof t[s]=="function"){i.preventDefault(),t[s](i);return}if(t[o]&&typeof t[o]=="function"){i.preventDefault(),t[o](i);return}if(t[i.key]&&typeof t[i.key]=="function"){i.preventDefault(),t[i.key](i);return}if(t.arrows&&["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"].includes(i.key)&&typeof t.arrows=="function"){i.preventDefault(),t.arrows(i);return}if(t.handlers){if(t.handlers[i.key]&&typeof t.handlers[i.key]=="function"){i.preventDefault(),t.handlers[i.key](i);return}if(t.handlers[o]&&typeof t.handlers[o]=="function"){i.preventDefault(),t.handlers[o](i);return}}if(t.custom&&typeof t.custom=="function"){t.custom(i);return}t.enter===!0&&i.key==="Enter"&&!["INPUT","TEXTAREA","SELECT"].includes(i.target.tagName)&&(i.preventDefault(),e.click&&e.click()),t.space===!0&&i.key===" "&&["BUTTON","A"].includes(e.tagName)&&(i.preventDefault(),e.click&&e.click())};e.addEventListener("keydown",n),e.__keyboardHandler=n},unmounted(e){e.__keyboardHandler&&(e.removeEventListener("keydown",e.__keyboardHandler),delete e.__keyboardHandler)}},L={mounted(e,a){if(!a.value)return;const t=typeof a.value=="string"?{message:a.value,priority:"polite"}:a.value;t&&t.message&&E(t.message,t.priority||"polite")},updated(e,a){if(a.value!==a.oldValue&&a.value){const t=typeof a.value=="string"?{message:a.value,priority:"polite"}:a.value;t&&t.message&&E(t.message,t.priority||"polite")}}},I={mounted(e,a){const t=a.value,n=i=>{i.preventDefault();const r=document.querySelector(t);r&&(r.hasAttribute("tabindex")||r.setAttribute("tabindex","-1"),r.focus(),r.scrollIntoView({behavior:"smooth",block:"start"}))};e.addEventListener("click",n),e.__skipLinkHandler=n,e.setAttribute("role","link"),t&&e.setAttribute("aria-label",`Skip to ${t.replace("#","")}`)},unmounted(e){e.__skipLinkHandler&&(e.removeEventListener("click",e.__skipLinkHandler),delete e.__skipLinkHandler)}},C={mounted(e,a){T(e,a)},updated(e,a){T(e,a)},unmounted(e){delete e.__a11ySkipOriginalTabIndex,delete e.__a11ySkipOriginalAriaHidden,delete e.__a11ySkipChildrenState}};function T(e,a){if(a.value===void 0?!0:!!a.value){e.__a11ySkipOriginalTabIndex===void 0&&(e.__a11ySkipOriginalTabIndex=e.getAttribute("tabindex")),e.__a11ySkipOriginalAriaHidden===void 0&&(e.__a11ySkipOriginalAriaHidden=e.getAttribute("aria-hidden")),e.setAttribute("tabindex","-1"),e.setAttribute("aria-hidden","true"),e.setAttribute("data-a11y-skip","true");const n=e.querySelectorAll('a, button, input, select, textarea, [tabindex]:not([tabindex="-1"])');e.__a11ySkipChildrenState||(e.__a11ySkipChildrenState=[]),n.forEach((i,r)=>{e.__a11ySkipChildrenState[r]||(e.__a11ySkipChildrenState[r]={tabIndex:i.getAttribute("tabindex"),disabled:i.disabled}),i.setAttribute("tabindex","-1"),"disabled"in i&&(i.disabled=!0)}),a.modifiers.noInteraction&&(e.style.pointerEvents="none"),a.modifiers.visual&&(e.style.opacity="0.5",e.style.filter="grayscale(100%)",e.style.pointerEvents="none")}else{e.__a11ySkipOriginalTabIndex!==void 0?e.__a11ySkipOriginalTabIndex===null?e.removeAttribute("tabindex"):e.setAttribute("tabindex",e.__a11ySkipOriginalTabIndex):e.removeAttribute("tabindex"),e.__a11ySkipOriginalAriaHidden!==void 0?e.__a11ySkipOriginalAriaHidden===null?e.removeAttribute("aria-hidden"):e.setAttribute("aria-hidden",e.__a11ySkipOriginalAriaHidden):e.removeAttribute("aria-hidden"),e.removeAttribute("data-a11y-skip");const n=e.querySelectorAll("a, button, input, select, textarea, [tabindex]");e.__a11ySkipChildrenState&&n.forEach((i,r)=>{const o=e.__a11ySkipChildrenState[r];o&&(o.tabIndex===null?i.removeAttribute("tabindex"):i.setAttribute("tabindex",o.tabIndex),"disabled"in i&&(i.disabled=o.disabled))}),a.modifiers.noInteraction&&(e.style.pointerEvents=""),a.modifiers.visual&&(e.style.opacity="",e.style.filter="",e.style.pointerEvents="")}}const H={mounted(e,a){const t=a.value||{},n={label:"aria-label",labelledby:"aria-labelledby",describedby:"aria-describedby",expanded:"aria-expanded",pressed:"aria-pressed",selected:"aria-selected",checked:"aria-checked",disabled:"aria-disabled",hidden:"aria-hidden",invalid:"aria-invalid",required:"aria-required",live:"aria-live",atomic:"aria-atomic",busy:"aria-busy",controls:"aria-controls",owns:"aria-owns",haspopup:"aria-haspopup",level:"aria-level",modal:"aria-modal",multiselectable:"aria-multiselectable",orientation:"aria-orientation",placeholder:"aria-placeholder",readonly:"aria-readonly",relevant:"aria-relevant",valuemax:"aria-valuemax",valuemin:"aria-valuemin",valuenow:"aria-valuenow",valuetext:"aria-valuetext"},i={};Object.entries(t).forEach(([r,o])=>{const s=n[r]||r;i[s]=o}),h(e,i),e.__ariaAttributes=Object.keys(i)},updated(e,a){if(JSON.stringify(a.value)!==JSON.stringify(a.oldValue)){e.__ariaAttributes&&e.__ariaAttributes.forEach(r=>e.removeAttribute(r));const t=a.value||{},n={label:"aria-label",labelledby:"aria-labelledby",describedby:"aria-describedby",expanded:"aria-expanded",pressed:"aria-pressed",selected:"aria-selected",checked:"aria-checked",disabled:"aria-disabled",hidden:"aria-hidden",invalid:"aria-invalid",required:"aria-required",live:"aria-live",atomic:"aria-atomic",busy:"aria-busy",controls:"aria-controls",owns:"aria-owns",haspopup:"aria-haspopup",level:"aria-level",modal:"aria-modal"},i={};Object.entries(t).forEach(([r,o])=>{const s=n[r]||r;i[s]=o}),h(e,i),e.__ariaAttributes=Object.keys(i)}},unmounted(e){e.__ariaAttributes&&(e.__ariaAttributes.forEach(a=>e.removeAttribute(a)),delete e.__ariaAttributes)}},K={mounted(e,a){const t=a.value||{},n=t.delay||100,i={panel:t.panelSelector||".el-picker-panel, .el-date-picker, .v-picker, .v-date-picker, .ant-picker-dropdown, .p-datepicker",selectedDay:t.selectedSelector||"td.is-selected, td.selected, td.is-today.is-selected, .v-date-picker-table__current, .ant-picker-cell-selected, .p-highlight",availableDay:t.availableSelector||"td:not(.disabled):not(.is-disabled):not([disabled]), .v-date-picker-table__events, .ant-picker-cell:not(.ant-picker-cell-disabled), .p-datepicker-calendar td:not(.p-disabled)",input:t.inputSelector||".el-input__inner, input, .v-text-field__input, .ant-picker-input, .p-inputtext"};let r=!1,o=null,s=null;const d=c=>{const b=c.getAttribute("aria-controls");let l=null;if(b&&(l=document.getElementById(b)),!l){const f=document.querySelectorAll(".el-picker-panel");for(const w of f)if(w.offsetParent!==null){l=w;break}}if(!l)return!1;let u=null;const g=l.querySelector("td.is-selected");if(g&&(u=g),!u){const f=l.querySelector("td.is-today");f&&(u=f)}if(!u){const f=l.querySelector(".el-date-table tbody td:not(.disabled):not(.is-disabled)");f&&(u=f)}if(!u)return!1;u.setAttribute("tabindex","0");const k=f=>{f.preventDefault(),f.stopPropagation(),u.removeEventListener("click",k)};u.addEventListener("click",k,{once:!0,capture:!0});let S=0;const M=10,x=()=>{if(S++,u.focus({preventScroll:!0}),document.activeElement===u)return setTimeout(()=>{u.removeEventListener("click",k)},100),!0;S<M?setTimeout(x,10):u.removeEventListener("click",k)};return x(),!0},y=c=>{s&&clearTimeout(s),requestAnimationFrame(()=>{s=setTimeout(()=>{d(c)},n)})},_=c=>{o=new MutationObserver(b=>{const l=document.querySelector(".el-picker-panel");l&&!r?(r=!0,y(c)):!l&&r&&(r=!1,s&&(clearTimeout(s),s=null))}),o.observe(document.body,{childList:!0,subtree:!0})},p=(()=>{let c=e.querySelector(i.input);return c||(c=e.querySelectorAll("input")[0]),c||e})();_(p);const A=()=>{};p.addEventListener("focus",A),p.addEventListener("click",A);const D=c=>{c.key==="Enter"||c.key};p.addEventListener("keydown",D);const j=(()=>{const c=new MutationObserver(b=>{b.forEach(l=>{l.type==="attributes"&&l.attributeName==="aria-expanded"&&p.getAttribute("aria-expanded")==="true"&&y(p)})});return c.observe(p,{attributes:!0,attributeFilter:["aria-expanded"]}),c})();e.__a11yDatePickerAriaObserver=j,e.__a11yDatePickerInput=p,e.__a11yDatePickerFocusHandler=A,e.__a11yDatePickerKeyHandler=D,e.__a11yDatePickerObserver=o},unmounted(e){if(e.__a11yDatePickerTimeout&&clearTimeout(e.__a11yDatePickerTimeout),e.__a11yDatePickerInput){const a=e.__a11yDatePickerInput;e.__a11yDatePickerFocusHandler&&(a.removeEventListener("focus",e.__a11yDatePickerFocusHandler),a.removeEventListener("click",e.__a11yDatePickerFocusHandler)),e.__a11yDatePickerKeyHandler&&a.removeEventListener("keydown",e.__a11yDatePickerKeyHandler)}e.__a11yDatePickerObserver&&e.__a11yDatePickerObserver.disconnect(),e.__a11yDatePickerAriaObserver&&e.__a11yDatePickerAriaObserver.disconnect(),delete e.__a11yDatePickerInput,delete e.__a11yDatePickerFocusHandler,delete e.__a11yDatePickerKeyHandler,delete e.__a11yDatePickerObserver,delete e.__a11yDatePickerAriaObserver,delete e.__a11yDatePickerTimeout}},q={"a11y-focus":F,"a11y-trap-focus":O,"a11y-keyboard":P,"a11y-announce":L,"a11y-skip-link":I,"a11y-skip":C,"a11y-aria":H,"a11y-date-picker":K};function N(e){Object.entries(q).forEach(([a,t])=>{e.directive(a,t)})}const G={install:N};exports.a11yDirectives=q;exports.announce=E;exports.announceDirective=L;exports.ariaDirective=H;exports.containsActiveElement=X;exports.datePickerDirective=K;exports.default=G;exports.focusDirective=F;exports.generateId=W;exports.getFirstFocusable=B;exports.getFocusableElements=v;exports.getLastFocusable=V;exports.installA11yDirectives=N;exports.keyboardDirective=P;exports.removeAriaAttributes=R;exports.restoreFocus=J;exports.saveFocus=$;exports.setAriaAttributes=h;exports.skipDirective=C;exports.skipLinkDirective=I;exports.trapFocusDirective=O;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const G=["BUTTON","A","INPUT","TEXTAREA","SELECT","IFRAME"],P={mounted(e,a){const t=typeof a.value=="object"?a.value:{delay:a.value||0},n=t.delay||0,i=t.select||!1;G.includes(e.tagName)||e.hasAttribute("tabindex")||e.hasAttribute("contenteditable")||(e.setAttribute("tabindex","0"),e.__a11yFocusAddedTabindex=!0),setTimeout(()=>{e.focus&&(e.focus(),i&&(e.tagName==="INPUT"||e.tagName==="TEXTAREA")&&e.select())},n)},unmounted(e){e.__a11yFocusAddedTabindex&&(e.removeAttribute("tabindex"),delete e.__a11yFocusAddedTabindex)}};function k(e){if(!e)return[];const a=["a[href]","button:not([disabled])","textarea:not([disabled])",'input:not([disabled]):not([type="hidden"])',"select:not([disabled])",'[tabindex]:not([tabindex="-1"])','[contenteditable="true"]',"audio[controls]","video[controls]"];return Array.from(e.querySelectorAll(a.join(", "))).filter(n=>{const i=window.getComputedStyle(n);return n.offsetWidth>0&&n.offsetHeight>0&&i.visibility!=="hidden"&&i.display!=="none"})}function E(e,a){Object.entries(a).forEach(([t,n])=>{n!=null&&e.setAttribute(t,n)})}function W(e,a){a.forEach(t=>{e.removeAttribute(t)})}function g(e,a="polite"){const t=document.createElement("div");t.setAttribute("role","status"),t.setAttribute("aria-live",a),t.setAttribute("aria-atomic","true"),t.style.position="absolute",t.style.left="-10000px",t.style.width="1px",t.style.height="1px",t.style.overflow="hidden",document.body.appendChild(t),setTimeout(()=>{t.textContent=e},100),setTimeout(()=>{document.body.removeChild(t)},3e3)}function V(e){const a=k(e);return a.length>0?a[0]:null}function X(e){const a=k(e);return a.length>0?a[a.length-1]:null}function $(e){return e.contains(document.activeElement)}function J(){return document.activeElement}function z(e){e&&e.focus&&e.focus()}function Q(e="a11y"){return`${e}-${Math.random().toString(36).substr(2,9)}`}const L={mounted(e,a){const t=a.value||{},n=t.autoFocus!==!1,i=t.onEscape||null,r=document.activeElement;e.__previousFocus=r,n&&setTimeout(()=>{const u=k(e);u.length>0&&u[0].focus()},100);const o=u=>{if(u.key!=="Tab")return;const b=k(e);if(b.length===0)return;const m=b[0],A=b[b.length-1];u.shiftKey&&document.activeElement===m?(u.preventDefault(),A.focus()):!u.shiftKey&&document.activeElement===A&&(u.preventDefault(),m.focus())},c=u=>{u.key==="Escape"&&i&&(u.preventDefault(),u.stopPropagation(),i())};e.addEventListener("keydown",o),e.__handleKeydown=o,i&&(document.addEventListener("keydown",c,!0),e.__handleEscape=c)},unmounted(e){e.__handleKeydown&&(e.removeEventListener("keydown",e.__handleKeydown),delete e.__handleKeydown),e.__handleEscape&&(document.removeEventListener("keydown",e.__handleEscape,!0),delete e.__handleEscape),e.__previousFocus&&(setTimeout(()=>{if(e.__previousFocus&&document.body.contains(e.__previousFocus)&&typeof e.__previousFocus.focus=="function")try{e.__previousFocus.focus()}catch(a){console.warn("Could not restore focus:",a)}},0),delete e.__previousFocus)}},I={mounted(e,a){const t=a.value||{};console.log("Keyboard directive mounted with config:",t);const n=i=>{console.log("Key pressed:",i.key,"Config:",t);const r={Enter:"enter"," ":"space",Escape:"escape",ArrowUp:"arrowUp",ArrowDown:"arrowDown",ArrowLeft:"arrowLeft",ArrowRight:"arrowRight",Tab:"tab",Delete:"delete",Backspace:"backspace"};let o="";(i.ctrlKey||i.metaKey)&&(o+="ctrl+"),i.altKey&&(o+="alt+"),i.shiftKey&&(o+="shift+"),o+=i.key.toLowerCase();const c=r[i.key];if(c&&typeof t[c]=="function"){i.preventDefault(),t[c](i);return}if(t[o]&&typeof t[o]=="function"){i.preventDefault(),t[o](i);return}if(t[i.key]&&typeof t[i.key]=="function"){i.preventDefault(),t[i.key](i);return}if(t.arrows&&["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"].includes(i.key)&&typeof t.arrows=="function"){i.preventDefault(),t.arrows(i);return}if(t.handlers){if(t.handlers[i.key]&&typeof t.handlers[i.key]=="function"){i.preventDefault(),t.handlers[i.key](i);return}if(t.handlers[o]&&typeof t.handlers[o]=="function"){i.preventDefault(),t.handlers[o](i);return}}if(t.custom&&typeof t.custom=="function"){t.custom(i);return}t.enter===!0&&i.key==="Enter"&&!["INPUT","TEXTAREA","SELECT"].includes(i.target.tagName)&&(i.preventDefault(),e.click&&e.click()),t.space===!0&&i.key===" "&&["BUTTON","A"].includes(e.tagName)&&(i.preventDefault(),e.click&&e.click())};e.addEventListener("keydown",n),e.__keyboardHandler=n},unmounted(e){e.__keyboardHandler&&(e.removeEventListener("keydown",e.__keyboardHandler),delete e.__keyboardHandler)}},K={mounted(e,a){if(!a.value)return;const t=typeof a.value=="string"?{message:a.value,priority:"polite"}:a.value;t&&t.message&&g(t.message,t.priority||"polite")},updated(e,a){if(a.value!==a.oldValue&&a.value){const t=typeof a.value=="string"?{message:a.value,priority:"polite"}:a.value;t&&t.message&&g(t.message,t.priority||"polite")}}},H={mounted(e,a){const t=a.value,n=i=>{i.preventDefault();const r=document.querySelector(t);r&&(r.hasAttribute("tabindex")||r.setAttribute("tabindex","-1"),r.focus(),r.scrollIntoView({behavior:"smooth",block:"start"}))};e.addEventListener("click",n),e.__skipLinkHandler=n,e.setAttribute("role","link"),t&&e.setAttribute("aria-label",`Skip to ${t.replace("#","")}`)},unmounted(e){e.__skipLinkHandler&&(e.removeEventListener("click",e.__skipLinkHandler),delete e.__skipLinkHandler)}},C={mounted(e,a){O(e,a)},updated(e,a){O(e,a)},unmounted(e){delete e.__a11ySkipOriginalTabIndex,delete e.__a11ySkipOriginalAriaHidden,delete e.__a11ySkipChildrenState}};function O(e,a){if(a.value===void 0?!0:!!a.value){e.__a11ySkipOriginalTabIndex===void 0&&(e.__a11ySkipOriginalTabIndex=e.getAttribute("tabindex")),e.__a11ySkipOriginalAriaHidden===void 0&&(e.__a11ySkipOriginalAriaHidden=e.getAttribute("aria-hidden")),e.setAttribute("tabindex","-1"),e.setAttribute("aria-hidden","true"),e.setAttribute("data-a11y-skip","true");const n=e.querySelectorAll('a, button, input, select, textarea, [tabindex]:not([tabindex="-1"])');e.__a11ySkipChildrenState||(e.__a11ySkipChildrenState=[]),n.forEach((i,r)=>{e.__a11ySkipChildrenState[r]||(e.__a11ySkipChildrenState[r]={tabIndex:i.getAttribute("tabindex"),disabled:i.disabled}),i.setAttribute("tabindex","-1"),"disabled"in i&&(i.disabled=!0)}),a.modifiers.noInteraction&&(e.style.pointerEvents="none"),a.modifiers.visual&&(e.style.opacity="0.5",e.style.filter="grayscale(100%)",e.style.pointerEvents="none")}else{e.__a11ySkipOriginalTabIndex!==void 0?e.__a11ySkipOriginalTabIndex===null?e.removeAttribute("tabindex"):e.setAttribute("tabindex",e.__a11ySkipOriginalTabIndex):e.removeAttribute("tabindex"),e.__a11ySkipOriginalAriaHidden!==void 0?e.__a11ySkipOriginalAriaHidden===null?e.removeAttribute("aria-hidden"):e.setAttribute("aria-hidden",e.__a11ySkipOriginalAriaHidden):e.removeAttribute("aria-hidden"),e.removeAttribute("data-a11y-skip");const n=e.querySelectorAll("a, button, input, select, textarea, [tabindex]");e.__a11ySkipChildrenState&&n.forEach((i,r)=>{const o=e.__a11ySkipChildrenState[r];o&&(o.tabIndex===null?i.removeAttribute("tabindex"):i.setAttribute("tabindex",o.tabIndex),"disabled"in i&&(i.disabled=o.disabled))}),a.modifiers.noInteraction&&(e.style.pointerEvents=""),a.modifiers.visual&&(e.style.opacity="",e.style.filter="",e.style.pointerEvents="")}}const N={mounted(e,a){const t=a.value||{},n={label:"aria-label",labelledby:"aria-labelledby",describedby:"aria-describedby",expanded:"aria-expanded",pressed:"aria-pressed",selected:"aria-selected",checked:"aria-checked",disabled:"aria-disabled",hidden:"aria-hidden",invalid:"aria-invalid",required:"aria-required",live:"aria-live",atomic:"aria-atomic",busy:"aria-busy",controls:"aria-controls",owns:"aria-owns",haspopup:"aria-haspopup",level:"aria-level",modal:"aria-modal",multiselectable:"aria-multiselectable",orientation:"aria-orientation",placeholder:"aria-placeholder",readonly:"aria-readonly",relevant:"aria-relevant",valuemax:"aria-valuemax",valuemin:"aria-valuemin",valuenow:"aria-valuenow",valuetext:"aria-valuetext"},i={};Object.entries(t).forEach(([r,o])=>{const c=n[r]||r;i[c]=o}),E(e,i),e.__ariaAttributes=Object.keys(i)},updated(e,a){if(JSON.stringify(a.value)!==JSON.stringify(a.oldValue)){e.__ariaAttributes&&e.__ariaAttributes.forEach(r=>e.removeAttribute(r));const t=a.value||{},n={label:"aria-label",labelledby:"aria-labelledby",describedby:"aria-describedby",expanded:"aria-expanded",pressed:"aria-pressed",selected:"aria-selected",checked:"aria-checked",disabled:"aria-disabled",hidden:"aria-hidden",invalid:"aria-invalid",required:"aria-required",live:"aria-live",atomic:"aria-atomic",busy:"aria-busy",controls:"aria-controls",owns:"aria-owns",haspopup:"aria-haspopup",level:"aria-level",modal:"aria-modal"},i={};Object.entries(t).forEach(([r,o])=>{const c=n[r]||r;i[c]=o}),E(e,i),e.__ariaAttributes=Object.keys(i)}},unmounted(e){e.__ariaAttributes&&(e.__ariaAttributes.forEach(a=>e.removeAttribute(a)),delete e.__ariaAttributes)}},q={mounted(e,a){const t=a.value||{},n=t.delay||100,i={panel:t.panelSelector||".el-picker-panel, .el-date-picker, .v-picker, .v-date-picker, .ant-picker-dropdown, .p-datepicker",selectedDay:t.selectedSelector||"td.is-selected, td.selected, td.is-today.is-selected, .v-date-picker-table__current, .ant-picker-cell-selected, .p-highlight",availableDay:t.availableSelector||"td:not(.disabled):not(.is-disabled):not([disabled]), .v-date-picker-table__events, .ant-picker-cell:not(.ant-picker-cell-disabled), .p-datepicker-calendar td:not(.p-disabled)",input:t.inputSelector||".el-input__inner, input, .v-text-field__input, .ant-picker-input, .p-inputtext"};let r=!1,o=null,c=null;const u=d=>{const v=d.getAttribute("aria-controls");let s=null;if(v&&(s=document.getElementById(v)),!s){const f=document.querySelectorAll(".el-picker-panel");for(const _ of f)if(_.offsetParent!==null){s=_;break}}if(!s)return!1;let l=null;const S=s.querySelector("td.is-selected");if(S&&(l=S),!l){const f=s.querySelector("td.is-today");f&&(l=f)}if(!l){const f=s.querySelector(".el-date-table tbody td:not(.disabled):not(.is-disabled)");f&&(l=f)}if(!l)return!1;l.setAttribute("tabindex","0");let w=0;const R=10,x=()=>{if(w++,l.focus({preventScroll:!0}),document.activeElement===l)return!0;w<R&&setTimeout(x,10)};x();const T=f=>{if(["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"].includes(f.key)){f.preventDefault(),s.__a11yNavigatingWithKeyboard=!0;const _=y=>(console.log("[DEBUG] Preventing",y.type,"during keyboard navigation"),y.preventDefault(),y.stopPropagation(),y.stopImmediatePropagation(),!1),F=["click","mousedown","mouseup","pointerdown","pointerup","touchstart","touchend"];F.forEach(y=>{s.addEventListener(y,_,{capture:!0,once:!0})}),s.querySelectorAll("td").forEach(y=>{F.forEach(B=>{y.addEventListener(B,_,{capture:!0,once:!0})})}),setTimeout(()=>{s.__a11yNavigatingWithKeyboard=!1,console.log("[DEBUG] Keyboard navigation complete")},50)}};return s.__a11yKeyboardHandlerAdded||(s.__a11yKeyboardHandlerAdded=!0,s.addEventListener("keydown",T,{capture:!0}),s.__a11yKeyboardHandler=T,console.log("[DEBUG] Keyboard navigation handler installed")),!0},b=d=>{c&&clearTimeout(c),requestAnimationFrame(()=>{c=setTimeout(()=>{u(d)},n)})},m=d=>{o=new MutationObserver(v=>{const s=document.querySelector(".el-picker-panel");s&&!r?(r=!0,b(d)):!s&&r&&(r=!1,c&&(clearTimeout(c),c=null))}),o.observe(document.body,{childList:!0,subtree:!0})},p=(()=>{let d=e.querySelector(i.input);return d||(d=e.querySelectorAll("input")[0]),d||e})();m(p);const h=()=>{};p.addEventListener("focus",h),p.addEventListener("click",h);const D=d=>{d.key==="Enter"||d.key};p.addEventListener("keydown",D);const M=(()=>{const d=new MutationObserver(v=>{v.forEach(s=>{s.type==="attributes"&&s.attributeName==="aria-expanded"&&p.getAttribute("aria-expanded")==="true"&&b(p)})});return d.observe(p,{attributes:!0,attributeFilter:["aria-expanded"]}),d})();e.__a11yDatePickerAriaObserver=M,e.__a11yDatePickerInput=p,e.__a11yDatePickerFocusHandler=h,e.__a11yDatePickerKeyHandler=D,e.__a11yDatePickerObserver=o},unmounted(e){if(e.__a11yDatePickerTimeout&&clearTimeout(e.__a11yDatePickerTimeout),e.__a11yDatePickerInput){const a=e.__a11yDatePickerInput;e.__a11yDatePickerFocusHandler&&(a.removeEventListener("focus",e.__a11yDatePickerFocusHandler),a.removeEventListener("click",e.__a11yDatePickerFocusHandler)),e.__a11yDatePickerKeyHandler&&a.removeEventListener("keydown",e.__a11yDatePickerKeyHandler)}e.__a11yDatePickerObserver&&e.__a11yDatePickerObserver.disconnect(),e.__a11yDatePickerAriaObserver&&e.__a11yDatePickerAriaObserver.disconnect(),delete e.__a11yDatePickerInput,delete e.__a11yDatePickerFocusHandler,delete e.__a11yDatePickerKeyHandler,delete e.__a11yDatePickerObserver,delete e.__a11yDatePickerAriaObserver,delete e.__a11yDatePickerTimeout}},U={"a11y-focus":P,"a11y-trap-focus":L,"a11y-keyboard":I,"a11y-announce":K,"a11y-skip-link":H,"a11y-skip":C,"a11y-aria":N,"a11y-date-picker":q};function j(e){Object.entries(U).forEach(([a,t])=>{e.directive(a,t)})}const Y={install:j};exports.a11yDirectives=U;exports.announce=g;exports.announceDirective=K;exports.ariaDirective=N;exports.containsActiveElement=$;exports.datePickerDirective=q;exports.default=Y;exports.focusDirective=P;exports.generateId=Q;exports.getFirstFocusable=V;exports.getFocusableElements=k;exports.getLastFocusable=X;exports.installA11yDirectives=j;exports.keyboardDirective=I;exports.removeAriaAttributes=W;exports.restoreFocus=z;exports.saveFocus=J;exports.setAriaAttributes=E;exports.skipDirective=C;exports.skipLinkDirective=H;exports.trapFocusDirective=L;

package/dist/vue-a11y-directives.esm.js

@@ -1,7 +1,7 @@
-const P = ["BUTTON", "A", "INPUT", "TEXTAREA", "SELECT", "IFRAME"], L = {
+const K = ["BUTTON", "A", "INPUT", "TEXTAREA", "SELECT", "IFRAME"], H = {
   mounted(e, a) {
     const t = typeof a.value == "object" ? a.value : { delay: a.value || 0 }, n = t.delay || 0, i = t.select || !1;
-    P.includes(e.tagName) || e.hasAttribute("tabindex") || e.hasAttribute("contenteditable") || (e.setAttribute("tabindex", "0"), e.__a11yFocusAddedTabindex = !0), setTimeout(() => {
+    K.includes(e.tagName) || e.hasAttribute("tabindex") || e.hasAttribute("contenteditable") || (e.setAttribute("tabindex", "0"), e.__a11yFocusAddedTabindex = !0), setTimeout(() => {
       e.focus && (e.focus(), i && (e.tagName === "INPUT" || e.tagName === "TEXTAREA") && e.select());
     }, n);
   },
@@ -9,7 +9,7 @@ const P = ["BUTTON", "A", "INPUT", "TEXTAREA", "SELECT", "IFRAME"], L = {
     e.__a11yFocusAddedTabindex && (e.removeAttribute("tabindex"), delete e.__a11yFocusAddedTabindex);
   }
 };
-function k(e) {
+function m(e) {
   if (!e) return [];
   const a = [
     "a[href]",
@@ -27,17 +27,17 @@ function k(e) {
     return n.offsetWidth > 0 && n.offsetHeight > 0 && i.visibility !== "hidden" && i.display !== "none";
   });
 }
-function g(e, a) {
+function T(e, a) {
   Object.entries(a).forEach(([t, n]) => {
     n != null && e.setAttribute(t, n);
   });
 }
-function B(e, a) {
+function X(e, a) {
   a.forEach((t) => {
     e.removeAttribute(t);
   });
 }
-function w(e, a = "polite") {
+function F(e, a = "polite") {
   const t = document.createElement("div");
   t.setAttribute("role", "status"), t.setAttribute("aria-live", a), t.setAttribute("aria-atomic", "true"), t.style.position = "absolute", t.style.left = "-10000px", t.style.width = "1px", t.style.height = "1px", t.style.overflow = "hidden", document.body.appendChild(t), setTimeout(() => {
     t.textContent = e;
@@ -45,43 +45,43 @@ function w(e, a = "polite") {
     document.body.removeChild(t);
   }, 3e3);
 }
-function V(e) {
-  const a = k(e);
+function $(e) {
+  const a = m(e);
   return a.length > 0 ? a[0] : null;
 }
-function X(e) {
-  const a = k(e);
+function J(e) {
+  const a = m(e);
   return a.length > 0 ? a[a.length - 1] : null;
 }
-function $(e) {
+function z(e) {
   return e.contains(document.activeElement);
 }
-function J() {
+function Q() {
   return document.activeElement;
 }
-function W(e) {
+function Y(e) {
   e && e.focus && e.focus();
 }
-function G(e = "a11y") {
+function Z(e = "a11y") {
   return `${e}-${Math.random().toString(36).substr(2, 9)}`;
 }
-const I = {
+const C = {
   mounted(e, a) {
     const t = a.value || {}, n = t.autoFocus !== !1, i = t.onEscape || null, r = document.activeElement;
     e.__previousFocus = r, n && setTimeout(() => {
-      const d = k(e);
-      d.length > 0 && d[0].focus();
+      const u = m(e);
+      u.length > 0 && u[0].focus();
     }, 100);
-    const o = (d) => {
-      if (d.key !== "Tab") return;
-      const y = k(e);
-      if (y.length === 0) return;
-      const _ = y[0], m = y[y.length - 1];
-      d.shiftKey && document.activeElement === _ ? (d.preventDefault(), m.focus()) : !d.shiftKey && document.activeElement === m && (d.preventDefault(), _.focus());
-    }, s = (d) => {
-      d.key === "Escape" && i && (d.preventDefault(), d.stopPropagation(), i());
+    const o = (u) => {
+      if (u.key !== "Tab") return;
+      const b = m(e);
+      if (b.length === 0) return;
+      const k = b[0], h = b[b.length - 1];
+      u.shiftKey && document.activeElement === k ? (u.preventDefault(), h.focus()) : !u.shiftKey && document.activeElement === h && (u.preventDefault(), k.focus());
+    }, d = (u) => {
+      u.key === "Escape" && i && (u.preventDefault(), u.stopPropagation(), i());
     };
-    e.addEventListener("keydown", o), e.__handleKeydown = o, i && (document.addEventListener("keydown", s, !0), e.__handleEscape = s);
+    e.addEventListener("keydown", o), e.__handleKeydown = o, i && (document.addEventListener("keydown", d, !0), e.__handleEscape = d);
   },
   unmounted(e) {
     e.__handleKeydown && (e.removeEventListener("keydown", e.__handleKeydown), delete e.__handleKeydown), e.__handleEscape && (document.removeEventListener("keydown", e.__handleEscape, !0), delete e.__handleEscape), e.__previousFocus && (setTimeout(() => {
@@ -93,7 +93,7 @@ const I = {
         }
     }, 0), delete e.__previousFocus);
   }
-}, C = {
+}, N = {
   mounted(e, a) {
     const t = a.value || {};
     console.log("Keyboard directive mounted with config:", t);
@@ -113,9 +113,9 @@ const I = {
       };
       let o = "";
       (i.ctrlKey || i.metaKey) && (o += "ctrl+"), i.altKey && (o += "alt+"), i.shiftKey && (o += "shift+"), o += i.key.toLowerCase();
-      const s = r[i.key];
-      if (s && typeof t[s] == "function") {
-        i.preventDefault(), t[s](i);
+      const d = r[i.key];
+      if (d && typeof t[d] == "function") {
+        i.preventDefault(), t[d](i);
         return;
       }
       if (t[o] && typeof t[o] == "function") {
@@ -151,19 +151,19 @@ const I = {
   unmounted(e) {
     e.__keyboardHandler && (e.removeEventListener("keydown", e.__keyboardHandler), delete e.__keyboardHandler);
   }
-}, H = {
+}, q = {
   mounted(e, a) {
     if (!a.value) return;
     const t = typeof a.value == "string" ? { message: a.value, priority: "polite" } : a.value;
-    t && t.message && w(t.message, t.priority || "polite");
+    t && t.message && F(t.message, t.priority || "polite");
   },
   updated(e, a) {
     if (a.value !== a.oldValue && a.value) {
       const t = typeof a.value == "string" ? { message: a.value, priority: "polite" } : a.value;
-      t && t.message && w(t.message, t.priority || "polite");
+      t && t.message && F(t.message, t.priority || "polite");
     }
   }
-}, K = {
+}, U = {
   mounted(e, a) {
     const t = a.value, n = (i) => {
       i.preventDefault();
@@ -175,18 +175,18 @@ const I = {
   unmounted(e) {
     e.__skipLinkHandler && (e.removeEventListener("click", e.__skipLinkHandler), delete e.__skipLinkHandler);
   }
-}, q = {
+}, R = {
   mounted(e, a) {
-    T(e, a);
+    O(e, a);
   },
   updated(e, a) {
-    T(e, a);
+    O(e, a);
   },
   unmounted(e) {
     delete e.__a11ySkipOriginalTabIndex, delete e.__a11ySkipOriginalAriaHidden, delete e.__a11ySkipChildrenState;
   }
 };
-function T(e, a) {
+function O(e, a) {
   if (a.value === void 0 ? !0 : !!a.value) {
     e.__a11ySkipOriginalTabIndex === void 0 && (e.__a11ySkipOriginalTabIndex = e.getAttribute("tabindex")), e.__a11ySkipOriginalAriaHidden === void 0 && (e.__a11ySkipOriginalAriaHidden = e.getAttribute("aria-hidden")), e.setAttribute("tabindex", "-1"), e.setAttribute("aria-hidden", "true"), e.setAttribute("data-a11y-skip", "true");
     const n = e.querySelectorAll(
@@ -209,7 +209,7 @@ function T(e, a) {
     }), a.modifiers.noInteraction && (e.style.pointerEvents = ""), a.modifiers.visual && (e.style.opacity = "", e.style.filter = "", e.style.pointerEvents = "");
   }
 }
-const N = {
+const j = {
   mounted(e, a) {
     const t = a.value || {}, n = {
       label: "aria-label",
@@ -242,9 +242,9 @@ const N = {
       valuetext: "aria-valuetext"
     }, i = {};
     Object.entries(t).forEach(([r, o]) => {
-      const s = n[r] || r;
-      i[s] = o;
-    }), g(e, i), e.__ariaAttributes = Object.keys(i);
+      const d = n[r] || r;
+      i[d] = o;
+    }), T(e, i), e.__ariaAttributes = Object.keys(i);
   },
   updated(e, a) {
     if (JSON.stringify(a.value) !== JSON.stringify(a.oldValue)) {
@@ -271,15 +271,15 @@ const N = {
         modal: "aria-modal"
       }, i = {};
       Object.entries(t).forEach(([r, o]) => {
-        const s = n[r] || r;
-        i[s] = o;
-      }), g(e, i), e.__ariaAttributes = Object.keys(i);
+        const d = n[r] || r;
+        i[d] = o;
+      }), T(e, i), e.__ariaAttributes = Object.keys(i);
     }
   },
   unmounted(e) {
     e.__ariaAttributes && (e.__ariaAttributes.forEach((a) => e.removeAttribute(a)), delete e.__ariaAttributes);
   }
-}, U = {
+}, B = {
   mounted(e, a) {
     const t = a.value || {}, n = t.delay || 100, i = {
       // Panel selectors (where the calendar appears)
@@ -291,56 +291,66 @@ const N = {
       // Input selectors (the input field)
       input: t.inputSelector || ".el-input__inner, input, .v-text-field__input, .ant-picker-input, .p-inputtext"
     };
-    let r = !1, o = null, s = null;
-    const d = (c) => {
-      const b = c.getAttribute("aria-controls");
-      let l = null;
-      if (b && (l = document.getElementById(b)), !l) {
+    let r = !1, o = null, d = null;
+    const u = (c) => {
+      const _ = c.getAttribute("aria-controls");
+      let s = null;
+      if (_ && (s = document.getElementById(_)), !s) {
         const f = document.querySelectorAll(".el-picker-panel");
-        for (const D of f)
-          if (D.offsetParent !== null) {
-            l = D;
+        for (const v of f)
+          if (v.offsetParent !== null) {
+            s = v;
             break;
           }
       }
-      if (!l)
+      if (!s)
         return !1;
-      let u = null;
-      const E = l.querySelector("td.is-selected");
-      if (E && (u = E), !u) {
-        const f = l.querySelector("td.is-today");
-        f && (u = f);
+      let l = null;
+      const g = s.querySelector("td.is-selected");
+      if (g && (l = g), !l) {
+        const f = s.querySelector("td.is-today");
+        f && (l = f);
       }
-      if (!u) {
-        const f = l.querySelector(".el-date-table tbody td:not(.disabled):not(.is-disabled)");
-        f && (u = f);
+      if (!l) {
+        const f = s.querySelector(".el-date-table tbody td:not(.disabled):not(.is-disabled)");
+        f && (l = f);
       }
-      if (!u)
+      if (!l)
         return !1;
-      u.setAttribute("tabindex", "0");
-      const v = (f) => {
-        f.preventDefault(), f.stopPropagation(), u.removeEventListener("click", v);
+      l.setAttribute("tabindex", "0");
+      let w = 0;
+      const L = 10, D = () => {
+        if (w++, l.focus({ preventScroll: !0 }), document.activeElement === l)
+          return !0;
+        w < L && setTimeout(D, 10);
       };
-      u.addEventListener("click", v, { once: !0, capture: !0 });
-      let x = 0;
-      const O = 10, S = () => {
-        if (x++, u.focus({ preventScroll: !0 }), document.activeElement === u)
-          return setTimeout(() => {
-            u.removeEventListener("click", v);
-          }, 100), !0;
-        x < O ? setTimeout(S, 10) : u.removeEventListener("click", v);
+      D();
+      const S = (f) => {
+        if (["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"].includes(f.key)) {
+          f.preventDefault(), s.__a11yNavigatingWithKeyboard = !0;
+          const v = (y) => (console.log("[DEBUG] Preventing", y.type, "during keyboard navigation"), y.preventDefault(), y.stopPropagation(), y.stopImmediatePropagation(), !1), x = ["click", "mousedown", "mouseup", "pointerdown", "pointerup", "touchstart", "touchend"];
+          x.forEach((y) => {
+            s.addEventListener(y, v, { capture: !0, once: !0 });
+          }), s.querySelectorAll("td").forEach((y) => {
+            x.forEach((I) => {
+              y.addEventListener(I, v, { capture: !0, once: !0 });
+            });
+          }), setTimeout(() => {
+            s.__a11yNavigatingWithKeyboard = !1, console.log("[DEBUG] Keyboard navigation complete");
+          }, 50);
+        }
       };
-      return S(), !0;
-    }, y = (c) => {
-      s && clearTimeout(s), requestAnimationFrame(() => {
-        s = setTimeout(() => {
-          d(c);
+      return s.__a11yKeyboardHandlerAdded || (s.__a11yKeyboardHandlerAdded = !0, s.addEventListener("keydown", S, { capture: !0 }), s.__a11yKeyboardHandler = S, console.log("[DEBUG] Keyboard navigation handler installed")), !0;
+    }, b = (c) => {
+      d && clearTimeout(d), requestAnimationFrame(() => {
+        d = setTimeout(() => {
+          u(c);
         }, n);
       });
-    }, _ = (c) => {
-      o = new MutationObserver((b) => {
-        const l = document.querySelector(".el-picker-panel");
-        l && !r ? (r = !0, y(c)) : !l && r && (r = !1, s && (clearTimeout(s), s = null));
+    }, k = (c) => {
+      o = new MutationObserver((_) => {
+        const s = document.querySelector(".el-picker-panel");
+        s && !r ? (r = !0, b(c)) : !s && r && (r = !1, d && (clearTimeout(d), d = null));
       }), o.observe(document.body, {
         childList: !0,
         subtree: !0
@@ -349,18 +359,18 @@ const N = {
       let c = e.querySelector(i.input);
       return c || (c = e.querySelectorAll("input")[0]), c || e;
     })();
-    _(p);
-    const h = () => {
+    k(p);
+    const A = () => {
     };
-    p.addEventListener("focus", h), p.addEventListener("click", h);
-    const A = (c) => {
+    p.addEventListener("focus", A), p.addEventListener("click", A);
+    const E = (c) => {
       c.key === "Enter" || c.key;
     };
-    p.addEventListener("keydown", A);
-    const F = (() => {
-      const c = new MutationObserver((b) => {
-        b.forEach((l) => {
-          l.type === "attributes" && l.attributeName === "aria-expanded" && p.getAttribute("aria-expanded") === "true" && y(p);
+    p.addEventListener("keydown", E);
+    const P = (() => {
+      const c = new MutationObserver((_) => {
+        _.forEach((s) => {
+          s.type === "attributes" && s.attributeName === "aria-expanded" && p.getAttribute("aria-expanded") === "true" && b(p);
         });
       });
       return c.observe(p, {
@@ -368,7 +378,7 @@ const N = {
         attributeFilter: ["aria-expanded"]
       }), c;
     })();
-    e.__a11yDatePickerAriaObserver = F, e.__a11yDatePickerInput = p, e.__a11yDatePickerFocusHandler = h, e.__a11yDatePickerKeyHandler = A, e.__a11yDatePickerObserver = o;
+    e.__a11yDatePickerAriaObserver = P, e.__a11yDatePickerInput = p, e.__a11yDatePickerFocusHandler = A, e.__a11yDatePickerKeyHandler = E, e.__a11yDatePickerObserver = o;
   },
   unmounted(e) {
     if (e.__a11yDatePickerTimeout && clearTimeout(e.__a11yDatePickerTimeout), e.__a11yDatePickerInput) {
@@ -377,44 +387,44 @@ const N = {
     }
     e.__a11yDatePickerObserver && e.__a11yDatePickerObserver.disconnect(), e.__a11yDatePickerAriaObserver && e.__a11yDatePickerAriaObserver.disconnect(), delete e.__a11yDatePickerInput, delete e.__a11yDatePickerFocusHandler, delete e.__a11yDatePickerKeyHandler, delete e.__a11yDatePickerObserver, delete e.__a11yDatePickerAriaObserver, delete e.__a11yDatePickerTimeout;
   }
-}, j = {
-  "a11y-focus": L,
-  "a11y-trap-focus": I,
-  "a11y-keyboard": C,
-  "a11y-announce": H,
-  "a11y-skip-link": K,
-  "a11y-skip": q,
-  "a11y-aria": N,
-  "a11y-date-picker": U
+}, M = {
+  "a11y-focus": H,
+  "a11y-trap-focus": C,
+  "a11y-keyboard": N,
+  "a11y-announce": q,
+  "a11y-skip-link": U,
+  "a11y-skip": R,
+  "a11y-aria": j,
+  "a11y-date-picker": B
 };
-function R(e) {
-  Object.entries(j).forEach(([a, t]) => {
+function G(e) {
+  Object.entries(M).forEach(([a, t]) => {
     e.directive(a, t);
   });
 }
-const z = {
-  install: R
+const ee = {
+  install: G
 };
 export {
-  j as a11yDirectives,
-  w as announce,
-  H as announceDirective,
-  N as ariaDirective,
-  $ as containsActiveElement,
-  U as datePickerDirective,
-  z as default,
-  L as focusDirective,
-  G as generateId,
-  V as getFirstFocusable,
-  k as getFocusableElements,
-  X as getLastFocusable,
-  R as installA11yDirectives,
-  C as keyboardDirective,
-  B as removeAriaAttributes,
-  W as restoreFocus,
-  J as saveFocus,
-  g as setAriaAttributes,
-  q as skipDirective,
-  K as skipLinkDirective,
-  I as trapFocusDirective
+  M as a11yDirectives,
+  F as announce,
+  q as announceDirective,
+  j as ariaDirective,
+  z as containsActiveElement,
+  B as datePickerDirective,
+  ee as default,
+  H as focusDirective,
+  Z as generateId,
+  $ as getFirstFocusable,
+  m as getFocusableElements,
+  J as getLastFocusable,
+  G as installA11yDirectives,
+  N as keyboardDirective,
+  X as removeAriaAttributes,
+  Y as restoreFocus,
+  Q as saveFocus,
+  T as setAriaAttributes,
+  R as skipDirective,
+  U as skipLinkDirective,
+  C as trapFocusDirective
 };

package/dist/vue-a11y-directives.min.js

@@ -1 +1 @@
-(function(o,_){typeof exports=="object"&&typeof module<"u"?_(exports):typeof define=="function"&&define.amd?define(["exports"],_):(o=typeof globalThis<"u"?globalThis:o||self,_(o.VueA11yDirectives={}))})(this,function(o){"use strict";const _=["BUTTON","A","INPUT","TEXTAREA","SELECT","IFRAME"],S={mounted(e,a){const t=typeof a.value=="object"?a.value:{delay:a.value||0},n=t.delay||0,i=t.select||!1;_.includes(e.tagName)||e.hasAttribute("tabindex")||e.hasAttribute("contenteditable")||(e.setAttribute("tabindex","0"),e.__a11yFocusAddedTabindex=!0),setTimeout(()=>{e.focus&&(e.focus(),i&&(e.tagName==="INPUT"||e.tagName==="TEXTAREA")&&e.select())},n)},unmounted(e){e.__a11yFocusAddedTabindex&&(e.removeAttribute("tabindex"),delete e.__a11yFocusAddedTabindex)}};function k(e){if(!e)return[];const a=["a[href]","button:not([disabled])","textarea:not([disabled])",'input:not([disabled]):not([type="hidden"])',"select:not([disabled])",'[tabindex]:not([tabindex="-1"])','[contenteditable="true"]',"audio[controls]","video[controls]"];return Array.from(e.querySelectorAll(a.join(", "))).filter(n=>{const i=window.getComputedStyle(n);return n.offsetWidth>0&&n.offsetHeight>0&&i.visibility!=="hidden"&&i.display!=="none"})}function h(e,a){Object.entries(a).forEach(([t,n])=>{n!=null&&e.setAttribute(t,n)})}function U(e,a){a.forEach(t=>{e.removeAttribute(t)})}function E(e,a="polite"){const t=document.createElement("div");t.setAttribute("role","status"),t.setAttribute("aria-live",a),t.setAttribute("aria-atomic","true"),t.style.position="absolute",t.style.left="-10000px",t.style.width="1px",t.style.height="1px",t.style.overflow="hidden",document.body.appendChild(t),setTimeout(()=>{t.textContent=e},100),setTimeout(()=>{document.body.removeChild(t)},3e3)}function R(e){const a=k(e);return a.length>0?a[0]:null}function B(e){const a=k(e);return a.length>0?a[a.length-1]:null}function V(e){return e.contains(document.activeElement)}function X(){return document.activeElement}function $(e){e&&e.focus&&e.focus()}function J(e="a11y"){return`${e}-${Math.random().toString(36).substr(2,9)}`}const w={mounted(e,a){const t=a.value||{},n=t.autoFocus!==!1,i=t.onEscape||null,r=document.activeElement;e.__previousFocus=r,n&&setTimeout(()=>{const u=k(e);u.length>0&&u[0].focus()},100);const s=u=>{if(u.key!=="Tab")return;const b=k(e);if(b.length===0)return;const m=b[0],D=b[b.length-1];u.shiftKey&&document.activeElement===m?(u.preventDefault(),D.focus()):!u.shiftKey&&document.activeElement===D&&(u.preventDefault(),m.focus())},c=u=>{u.key==="Escape"&&i&&(u.preventDefault(),u.stopPropagation(),i())};e.addEventListener("keydown",s),e.__handleKeydown=s,i&&(document.addEventListener("keydown",c,!0),e.__handleEscape=c)},unmounted(e){e.__handleKeydown&&(e.removeEventListener("keydown",e.__handleKeydown),delete e.__handleKeydown),e.__handleEscape&&(document.removeEventListener("keydown",e.__handleEscape,!0),delete e.__handleEscape),e.__previousFocus&&(setTimeout(()=>{if(e.__previousFocus&&document.body.contains(e.__previousFocus)&&typeof e.__previousFocus.focus=="function")try{e.__previousFocus.focus()}catch(a){console.warn("Could not restore focus:",a)}},0),delete e.__previousFocus)}},T={mounted(e,a){const t=a.value||{};console.log("Keyboard directive mounted with config:",t);const n=i=>{console.log("Key pressed:",i.key,"Config:",t);const r={Enter:"enter"," ":"space",Escape:"escape",ArrowUp:"arrowUp",ArrowDown:"arrowDown",ArrowLeft:"arrowLeft",ArrowRight:"arrowRight",Tab:"tab",Delete:"delete",Backspace:"backspace"};let s="";(i.ctrlKey||i.metaKey)&&(s+="ctrl+"),i.altKey&&(s+="alt+"),i.shiftKey&&(s+="shift+"),s+=i.key.toLowerCase();const c=r[i.key];if(c&&typeof t[c]=="function"){i.preventDefault(),t[c](i);return}if(t[s]&&typeof t[s]=="function"){i.preventDefault(),t[s](i);return}if(t[i.key]&&typeof t[i.key]=="function"){i.preventDefault(),t[i.key](i);return}if(t.arrows&&["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"].includes(i.key)&&typeof t.arrows=="function"){i.preventDefault(),t.arrows(i);return}if(t.handlers){if(t.handlers[i.key]&&typeof t.handlers[i.key]=="function"){i.preventDefault(),t.handlers[i.key](i);return}if(t.handlers[s]&&typeof t.handlers[s]=="function"){i.preventDefault(),t.handlers[s](i);return}}if(t.custom&&typeof t.custom=="function"){t.custom(i);return}t.enter===!0&&i.key==="Enter"&&!["INPUT","TEXTAREA","SELECT"].includes(i.target.tagName)&&(i.preventDefault(),e.click&&e.click()),t.space===!0&&i.key===" "&&["BUTTON","A"].includes(e.tagName)&&(i.preventDefault(),e.click&&e.click())};e.addEventListener("keydown",n),e.__keyboardHandler=n},unmounted(e){e.__keyboardHandler&&(e.removeEventListener("keydown",e.__keyboardHandler),delete e.__keyboardHandler)}},F={mounted(e,a){if(!a.value)return;const t=typeof a.value=="string"?{message:a.value,priority:"polite"}:a.value;t&&t.message&&E(t.message,t.priority||"polite")},updated(e,a){if(a.value!==a.oldValue&&a.value){const t=typeof a.value=="string"?{message:a.value,priority:"polite"}:a.value;t&&t.message&&E(t.message,t.priority||"polite")}}},x={mounted(e,a){const t=a.value,n=i=>{i.preventDefault();const r=document.querySelector(t);r&&(r.hasAttribute("tabindex")||r.setAttribute("tabindex","-1"),r.focus(),r.scrollIntoView({behavior:"smooth",block:"start"}))};e.addEventListener("click",n),e.__skipLinkHandler=n,e.setAttribute("role","link"),t&&e.setAttribute("aria-label",`Skip to ${t.replace("#","")}`)},unmounted(e){e.__skipLinkHandler&&(e.removeEventListener("click",e.__skipLinkHandler),delete e.__skipLinkHandler)}},O={mounted(e,a){P(e,a)},updated(e,a){P(e,a)},unmounted(e){delete e.__a11ySkipOriginalTabIndex,delete e.__a11ySkipOriginalAriaHidden,delete e.__a11ySkipChildrenState}};function P(e,a){if(a.value===void 0?!0:!!a.value){e.__a11ySkipOriginalTabIndex===void 0&&(e.__a11ySkipOriginalTabIndex=e.getAttribute("tabindex")),e.__a11ySkipOriginalAriaHidden===void 0&&(e.__a11ySkipOriginalAriaHidden=e.getAttribute("aria-hidden")),e.setAttribute("tabindex","-1"),e.setAttribute("aria-hidden","true"),e.setAttribute("data-a11y-skip","true");const n=e.querySelectorAll('a, button, input, select, textarea, [tabindex]:not([tabindex="-1"])');e.__a11ySkipChildrenState||(e.__a11ySkipChildrenState=[]),n.forEach((i,r)=>{e.__a11ySkipChildrenState[r]||(e.__a11ySkipChildrenState[r]={tabIndex:i.getAttribute("tabindex"),disabled:i.disabled}),i.setAttribute("tabindex","-1"),"disabled"in i&&(i.disabled=!0)}),a.modifiers.noInteraction&&(e.style.pointerEvents="none"),a.modifiers.visual&&(e.style.opacity="0.5",e.style.filter="grayscale(100%)",e.style.pointerEvents="none")}else{e.__a11ySkipOriginalTabIndex!==void 0?e.__a11ySkipOriginalTabIndex===null?e.removeAttribute("tabindex"):e.setAttribute("tabindex",e.__a11ySkipOriginalTabIndex):e.removeAttribute("tabindex"),e.__a11ySkipOriginalAriaHidden!==void 0?e.__a11ySkipOriginalAriaHidden===null?e.removeAttribute("aria-hidden"):e.setAttribute("aria-hidden",e.__a11ySkipOriginalAriaHidden):e.removeAttribute("aria-hidden"),e.removeAttribute("data-a11y-skip");const n=e.querySelectorAll("a, button, input, select, textarea, [tabindex]");e.__a11ySkipChildrenState&&n.forEach((i,r)=>{const s=e.__a11ySkipChildrenState[r];s&&(s.tabIndex===null?i.removeAttribute("tabindex"):i.setAttribute("tabindex",s.tabIndex),"disabled"in i&&(i.disabled=s.disabled))}),a.modifiers.noInteraction&&(e.style.pointerEvents=""),a.modifiers.visual&&(e.style.opacity="",e.style.filter="",e.style.pointerEvents="")}}const L={mounted(e,a){const t=a.value||{},n={label:"aria-label",labelledby:"aria-labelledby",describedby:"aria-describedby",expanded:"aria-expanded",pressed:"aria-pressed",selected:"aria-selected",checked:"aria-checked",disabled:"aria-disabled",hidden:"aria-hidden",invalid:"aria-invalid",required:"aria-required",live:"aria-live",atomic:"aria-atomic",busy:"aria-busy",controls:"aria-controls",owns:"aria-owns",haspopup:"aria-haspopup",level:"aria-level",modal:"aria-modal",multiselectable:"aria-multiselectable",orientation:"aria-orientation",placeholder:"aria-placeholder",readonly:"aria-readonly",relevant:"aria-relevant",valuemax:"aria-valuemax",valuemin:"aria-valuemin",valuenow:"aria-valuenow",valuetext:"aria-valuetext"},i={};Object.entries(t).forEach(([r,s])=>{const c=n[r]||r;i[c]=s}),h(e,i),e.__ariaAttributes=Object.keys(i)},updated(e,a){if(JSON.stringify(a.value)!==JSON.stringify(a.oldValue)){e.__ariaAttributes&&e.__ariaAttributes.forEach(r=>e.removeAttribute(r));const t=a.value||{},n={label:"aria-label",labelledby:"aria-labelledby",describedby:"aria-describedby",expanded:"aria-expanded",pressed:"aria-pressed",selected:"aria-selected",checked:"aria-checked",disabled:"aria-disabled",hidden:"aria-hidden",invalid:"aria-invalid",required:"aria-required",live:"aria-live",atomic:"aria-atomic",busy:"aria-busy",controls:"aria-controls",owns:"aria-owns",haspopup:"aria-haspopup",level:"aria-level",modal:"aria-modal"},i={};Object.entries(t).forEach(([r,s])=>{const c=n[r]||r;i[c]=s}),h(e,i),e.__ariaAttributes=Object.keys(i)}},unmounted(e){e.__ariaAttributes&&(e.__ariaAttributes.forEach(a=>e.removeAttribute(a)),delete e.__ariaAttributes)}},I={mounted(e,a){const t=a.value||{},n=t.delay||100,i={panel:t.panelSelector||".el-picker-panel, .el-date-picker, .v-picker, .v-date-picker, .ant-picker-dropdown, .p-datepicker",selectedDay:t.selectedSelector||"td.is-selected, td.selected, td.is-today.is-selected, .v-date-picker-table__current, .ant-picker-cell-selected, .p-highlight",availableDay:t.availableSelector||"td:not(.disabled):not(.is-disabled):not([disabled]), .v-date-picker-table__events, .ant-picker-cell:not(.ant-picker-cell-disabled), .p-datepicker-calendar td:not(.p-disabled)",input:t.inputSelector||".el-input__inner, input, .v-text-field__input, .ant-picker-input, .p-inputtext"};let r=!1,s=null,c=null;const u=d=>{const v=d.getAttribute("aria-controls");let f=null;if(v&&(f=document.getElementById(v)),!f){const y=document.querySelectorAll(".el-picker-panel");for(const M of y)if(M.offsetParent!==null){f=M;break}}if(!f)return!1;let l=null;const q=f.querySelector("td.is-selected");if(q&&(l=q),!l){const y=f.querySelector("td.is-today");y&&(l=y)}if(!l){const y=f.querySelector(".el-date-table tbody td:not(.disabled):not(.is-disabled)");y&&(l=y)}if(!l)return!1;l.setAttribute("tabindex","0");const A=y=>{y.preventDefault(),y.stopPropagation(),l.removeEventListener("click",A)};l.addEventListener("click",A,{once:!0,capture:!0});let N=0;const z=10,j=()=>{if(N++,l.focus({preventScroll:!0}),document.activeElement===l)return setTimeout(()=>{l.removeEventListener("click",A)},100),!0;N<z?setTimeout(j,10):l.removeEventListener("click",A)};return j(),!0},b=d=>{c&&clearTimeout(c),requestAnimationFrame(()=>{c=setTimeout(()=>{u(d)},n)})},m=d=>{s=new MutationObserver(v=>{const f=document.querySelector(".el-picker-panel");f&&!r?(r=!0,b(d)):!f&&r&&(r=!1,c&&(clearTimeout(c),c=null))}),s.observe(document.body,{childList:!0,subtree:!0})},p=(()=>{let d=e.querySelector(i.input);return d||(d=e.querySelectorAll("input")[0]),d||e})();m(p);const g=()=>{};p.addEventListener("focus",g),p.addEventListener("click",g);const K=d=>{d.key==="Enter"||d.key};p.addEventListener("keydown",K);const G=(()=>{const d=new MutationObserver(v=>{v.forEach(f=>{f.type==="attributes"&&f.attributeName==="aria-expanded"&&p.getAttribute("aria-expanded")==="true"&&b(p)})});return d.observe(p,{attributes:!0,attributeFilter:["aria-expanded"]}),d})();e.__a11yDatePickerAriaObserver=G,e.__a11yDatePickerInput=p,e.__a11yDatePickerFocusHandler=g,e.__a11yDatePickerKeyHandler=K,e.__a11yDatePickerObserver=s},unmounted(e){if(e.__a11yDatePickerTimeout&&clearTimeout(e.__a11yDatePickerTimeout),e.__a11yDatePickerInput){const a=e.__a11yDatePickerInput;e.__a11yDatePickerFocusHandler&&(a.removeEventListener("focus",e.__a11yDatePickerFocusHandler),a.removeEventListener("click",e.__a11yDatePickerFocusHandler)),e.__a11yDatePickerKeyHandler&&a.removeEventListener("keydown",e.__a11yDatePickerKeyHandler)}e.__a11yDatePickerObserver&&e.__a11yDatePickerObserver.disconnect(),e.__a11yDatePickerAriaObserver&&e.__a11yDatePickerAriaObserver.disconnect(),delete e.__a11yDatePickerInput,delete e.__a11yDatePickerFocusHandler,delete e.__a11yDatePickerKeyHandler,delete e.__a11yDatePickerObserver,delete e.__a11yDatePickerAriaObserver,delete e.__a11yDatePickerTimeout}},C={"a11y-focus":S,"a11y-trap-focus":w,"a11y-keyboard":T,"a11y-announce":F,"a11y-skip-link":x,"a11y-skip":O,"a11y-aria":L,"a11y-date-picker":I};function H(e){Object.entries(C).forEach(([a,t])=>{e.directive(a,t)})}const W={install:H};o.a11yDirectives=C,o.announce=E,o.announceDirective=F,o.ariaDirective=L,o.containsActiveElement=V,o.datePickerDirective=I,o.default=W,o.focusDirective=S,o.generateId=J,o.getFirstFocusable=R,o.getFocusableElements=k,o.getLastFocusable=B,o.installA11yDirectives=H,o.keyboardDirective=T,o.removeAriaAttributes=U,o.restoreFocus=$,o.saveFocus=X,o.setAriaAttributes=h,o.skipDirective=O,o.skipLinkDirective=x,o.trapFocusDirective=w,Object.defineProperties(o,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(o,k){typeof exports=="object"&&typeof module<"u"?k(exports):typeof define=="function"&&define.amd?define(["exports"],k):(o=typeof globalThis<"u"?globalThis:o||self,k(o.VueA11yDirectives={}))})(this,function(o){"use strict";const k=["BUTTON","A","INPUT","TEXTAREA","SELECT","IFRAME"],w={mounted(e,a){const t=typeof a.value=="object"?a.value:{delay:a.value||0},n=t.delay||0,i=t.select||!1;k.includes(e.tagName)||e.hasAttribute("tabindex")||e.hasAttribute("contenteditable")||(e.setAttribute("tabindex","0"),e.__a11yFocusAddedTabindex=!0),setTimeout(()=>{e.focus&&(e.focus(),i&&(e.tagName==="INPUT"||e.tagName==="TEXTAREA")&&e.select())},n)},unmounted(e){e.__a11yFocusAddedTabindex&&(e.removeAttribute("tabindex"),delete e.__a11yFocusAddedTabindex)}};function m(e){if(!e)return[];const a=["a[href]","button:not([disabled])","textarea:not([disabled])",'input:not([disabled]):not([type="hidden"])',"select:not([disabled])",'[tabindex]:not([tabindex="-1"])','[contenteditable="true"]',"audio[controls]","video[controls]"];return Array.from(e.querySelectorAll(a.join(", "))).filter(n=>{const i=window.getComputedStyle(n);return n.offsetWidth>0&&n.offsetHeight>0&&i.visibility!=="hidden"&&i.display!=="none"})}function E(e,a){Object.entries(a).forEach(([t,n])=>{n!=null&&e.setAttribute(t,n)})}function B(e,a){a.forEach(t=>{e.removeAttribute(t)})}function g(e,a="polite"){const t=document.createElement("div");t.setAttribute("role","status"),t.setAttribute("aria-live",a),t.setAttribute("aria-atomic","true"),t.style.position="absolute",t.style.left="-10000px",t.style.width="1px",t.style.height="1px",t.style.overflow="hidden",document.body.appendChild(t),setTimeout(()=>{t.textContent=e},100),setTimeout(()=>{document.body.removeChild(t)},3e3)}function G(e){const a=m(e);return a.length>0?a[0]:null}function V(e){const a=m(e);return a.length>0?a[a.length-1]:null}function W(e){return e.contains(document.activeElement)}function X(){return document.activeElement}function $(e){e&&e.focus&&e.focus()}function J(e="a11y"){return`${e}-${Math.random().toString(36).substr(2,9)}`}const T={mounted(e,a){const t=a.value||{},n=t.autoFocus!==!1,i=t.onEscape||null,r=document.activeElement;e.__previousFocus=r,n&&setTimeout(()=>{const l=m(e);l.length>0&&l[0].focus()},100);const s=l=>{if(l.key!=="Tab")return;const v=m(e);if(v.length===0)return;const h=v[0],D=v[v.length-1];l.shiftKey&&document.activeElement===h?(l.preventDefault(),D.focus()):!l.shiftKey&&document.activeElement===D&&(l.preventDefault(),h.focus())},c=l=>{l.key==="Escape"&&i&&(l.preventDefault(),l.stopPropagation(),i())};e.addEventListener("keydown",s),e.__handleKeydown=s,i&&(document.addEventListener("keydown",c,!0),e.__handleEscape=c)},unmounted(e){e.__handleKeydown&&(e.removeEventListener("keydown",e.__handleKeydown),delete e.__handleKeydown),e.__handleEscape&&(document.removeEventListener("keydown",e.__handleEscape,!0),delete e.__handleEscape),e.__previousFocus&&(setTimeout(()=>{if(e.__previousFocus&&document.body.contains(e.__previousFocus)&&typeof e.__previousFocus.focus=="function")try{e.__previousFocus.focus()}catch(a){console.warn("Could not restore focus:",a)}},0),delete e.__previousFocus)}},F={mounted(e,a){const t=a.value||{};console.log("Keyboard directive mounted with config:",t);const n=i=>{console.log("Key pressed:",i.key,"Config:",t);const r={Enter:"enter"," ":"space",Escape:"escape",ArrowUp:"arrowUp",ArrowDown:"arrowDown",ArrowLeft:"arrowLeft",ArrowRight:"arrowRight",Tab:"tab",Delete:"delete",Backspace:"backspace"};let s="";(i.ctrlKey||i.metaKey)&&(s+="ctrl+"),i.altKey&&(s+="alt+"),i.shiftKey&&(s+="shift+"),s+=i.key.toLowerCase();const c=r[i.key];if(c&&typeof t[c]=="function"){i.preventDefault(),t[c](i);return}if(t[s]&&typeof t[s]=="function"){i.preventDefault(),t[s](i);return}if(t[i.key]&&typeof t[i.key]=="function"){i.preventDefault(),t[i.key](i);return}if(t.arrows&&["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"].includes(i.key)&&typeof t.arrows=="function"){i.preventDefault(),t.arrows(i);return}if(t.handlers){if(t.handlers[i.key]&&typeof t.handlers[i.key]=="function"){i.preventDefault(),t.handlers[i.key](i);return}if(t.handlers[s]&&typeof t.handlers[s]=="function"){i.preventDefault(),t.handlers[s](i);return}}if(t.custom&&typeof t.custom=="function"){t.custom(i);return}t.enter===!0&&i.key==="Enter"&&!["INPUT","TEXTAREA","SELECT"].includes(i.target.tagName)&&(i.preventDefault(),e.click&&e.click()),t.space===!0&&i.key===" "&&["BUTTON","A"].includes(e.tagName)&&(i.preventDefault(),e.click&&e.click())};e.addEventListener("keydown",n),e.__keyboardHandler=n},unmounted(e){e.__keyboardHandler&&(e.removeEventListener("keydown",e.__keyboardHandler),delete e.__keyboardHandler)}},x={mounted(e,a){if(!a.value)return;const t=typeof a.value=="string"?{message:a.value,priority:"polite"}:a.value;t&&t.message&&g(t.message,t.priority||"polite")},updated(e,a){if(a.value!==a.oldValue&&a.value){const t=typeof a.value=="string"?{message:a.value,priority:"polite"}:a.value;t&&t.message&&g(t.message,t.priority||"polite")}}},O={mounted(e,a){const t=a.value,n=i=>{i.preventDefault();const r=document.querySelector(t);r&&(r.hasAttribute("tabindex")||r.setAttribute("tabindex","-1"),r.focus(),r.scrollIntoView({behavior:"smooth",block:"start"}))};e.addEventListener("click",n),e.__skipLinkHandler=n,e.setAttribute("role","link"),t&&e.setAttribute("aria-label",`Skip to ${t.replace("#","")}`)},unmounted(e){e.__skipLinkHandler&&(e.removeEventListener("click",e.__skipLinkHandler),delete e.__skipLinkHandler)}},P={mounted(e,a){L(e,a)},updated(e,a){L(e,a)},unmounted(e){delete e.__a11ySkipOriginalTabIndex,delete e.__a11ySkipOriginalAriaHidden,delete e.__a11ySkipChildrenState}};function L(e,a){if(a.value===void 0?!0:!!a.value){e.__a11ySkipOriginalTabIndex===void 0&&(e.__a11ySkipOriginalTabIndex=e.getAttribute("tabindex")),e.__a11ySkipOriginalAriaHidden===void 0&&(e.__a11ySkipOriginalAriaHidden=e.getAttribute("aria-hidden")),e.setAttribute("tabindex","-1"),e.setAttribute("aria-hidden","true"),e.setAttribute("data-a11y-skip","true");const n=e.querySelectorAll('a, button, input, select, textarea, [tabindex]:not([tabindex="-1"])');e.__a11ySkipChildrenState||(e.__a11ySkipChildrenState=[]),n.forEach((i,r)=>{e.__a11ySkipChildrenState[r]||(e.__a11ySkipChildrenState[r]={tabIndex:i.getAttribute("tabindex"),disabled:i.disabled}),i.setAttribute("tabindex","-1"),"disabled"in i&&(i.disabled=!0)}),a.modifiers.noInteraction&&(e.style.pointerEvents="none"),a.modifiers.visual&&(e.style.opacity="0.5",e.style.filter="grayscale(100%)",e.style.pointerEvents="none")}else{e.__a11ySkipOriginalTabIndex!==void 0?e.__a11ySkipOriginalTabIndex===null?e.removeAttribute("tabindex"):e.setAttribute("tabindex",e.__a11ySkipOriginalTabIndex):e.removeAttribute("tabindex"),e.__a11ySkipOriginalAriaHidden!==void 0?e.__a11ySkipOriginalAriaHidden===null?e.removeAttribute("aria-hidden"):e.setAttribute("aria-hidden",e.__a11ySkipOriginalAriaHidden):e.removeAttribute("aria-hidden"),e.removeAttribute("data-a11y-skip");const n=e.querySelectorAll("a, button, input, select, textarea, [tabindex]");e.__a11ySkipChildrenState&&n.forEach((i,r)=>{const s=e.__a11ySkipChildrenState[r];s&&(s.tabIndex===null?i.removeAttribute("tabindex"):i.setAttribute("tabindex",s.tabIndex),"disabled"in i&&(i.disabled=s.disabled))}),a.modifiers.noInteraction&&(e.style.pointerEvents=""),a.modifiers.visual&&(e.style.opacity="",e.style.filter="",e.style.pointerEvents="")}}const I={mounted(e,a){const t=a.value||{},n={label:"aria-label",labelledby:"aria-labelledby",describedby:"aria-describedby",expanded:"aria-expanded",pressed:"aria-pressed",selected:"aria-selected",checked:"aria-checked",disabled:"aria-disabled",hidden:"aria-hidden",invalid:"aria-invalid",required:"aria-required",live:"aria-live",atomic:"aria-atomic",busy:"aria-busy",controls:"aria-controls",owns:"aria-owns",haspopup:"aria-haspopup",level:"aria-level",modal:"aria-modal",multiselectable:"aria-multiselectable",orientation:"aria-orientation",placeholder:"aria-placeholder",readonly:"aria-readonly",relevant:"aria-relevant",valuemax:"aria-valuemax",valuemin:"aria-valuemin",valuenow:"aria-valuenow",valuetext:"aria-valuetext"},i={};Object.entries(t).forEach(([r,s])=>{const c=n[r]||r;i[c]=s}),E(e,i),e.__ariaAttributes=Object.keys(i)},updated(e,a){if(JSON.stringify(a.value)!==JSON.stringify(a.oldValue)){e.__ariaAttributes&&e.__ariaAttributes.forEach(r=>e.removeAttribute(r));const t=a.value||{},n={label:"aria-label",labelledby:"aria-labelledby",describedby:"aria-describedby",expanded:"aria-expanded",pressed:"aria-pressed",selected:"aria-selected",checked:"aria-checked",disabled:"aria-disabled",hidden:"aria-hidden",invalid:"aria-invalid",required:"aria-required",live:"aria-live",atomic:"aria-atomic",busy:"aria-busy",controls:"aria-controls",owns:"aria-owns",haspopup:"aria-haspopup",level:"aria-level",modal:"aria-modal"},i={};Object.entries(t).forEach(([r,s])=>{const c=n[r]||r;i[c]=s}),E(e,i),e.__ariaAttributes=Object.keys(i)}},unmounted(e){e.__ariaAttributes&&(e.__ariaAttributes.forEach(a=>e.removeAttribute(a)),delete e.__ariaAttributes)}},K={mounted(e,a){const t=a.value||{},n=t.delay||100,i={panel:t.panelSelector||".el-picker-panel, .el-date-picker, .v-picker, .v-date-picker, .ant-picker-dropdown, .p-datepicker",selectedDay:t.selectedSelector||"td.is-selected, td.selected, td.is-today.is-selected, .v-date-picker-table__current, .ant-picker-cell-selected, .p-highlight",availableDay:t.availableSelector||"td:not(.disabled):not(.is-disabled):not([disabled]), .v-date-picker-table__events, .ant-picker-cell:not(.ant-picker-cell-disabled), .p-datepicker-calendar td:not(.p-disabled)",input:t.inputSelector||".el-input__inner, input, .v-text-field__input, .ant-picker-input, .p-inputtext"};let r=!1,s=null,c=null;const l=u=>{const _=u.getAttribute("aria-controls");let d=null;if(_&&(d=document.getElementById(_)),!d){const y=document.querySelectorAll(".el-picker-panel");for(const A of y)if(A.offsetParent!==null){d=A;break}}if(!d)return!1;let f=null;const q=d.querySelector("td.is-selected");if(q&&(f=q),!f){const y=d.querySelector("td.is-today");y&&(f=y)}if(!f){const y=d.querySelector(".el-date-table tbody td:not(.disabled):not(.is-disabled)");y&&(f=y)}if(!f)return!1;f.setAttribute("tabindex","0");let U=0;const Y=10,j=()=>{if(U++,f.focus({preventScroll:!0}),document.activeElement===f)return!0;U<Y&&setTimeout(j,10)};j();const M=y=>{if(["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"].includes(y.key)){y.preventDefault(),d.__a11yNavigatingWithKeyboard=!0;const A=b=>(console.log("[DEBUG] Preventing",b.type,"during keyboard navigation"),b.preventDefault(),b.stopPropagation(),b.stopImmediatePropagation(),!1),R=["click","mousedown","mouseup","pointerdown","pointerup","touchstart","touchend"];R.forEach(b=>{d.addEventListener(b,A,{capture:!0,once:!0})}),d.querySelectorAll("td").forEach(b=>{R.forEach(Z=>{b.addEventListener(Z,A,{capture:!0,once:!0})})}),setTimeout(()=>{d.__a11yNavigatingWithKeyboard=!1,console.log("[DEBUG] Keyboard navigation complete")},50)}};return d.__a11yKeyboardHandlerAdded||(d.__a11yKeyboardHandlerAdded=!0,d.addEventListener("keydown",M,{capture:!0}),d.__a11yKeyboardHandler=M,console.log("[DEBUG] Keyboard navigation handler installed")),!0},v=u=>{c&&clearTimeout(c),requestAnimationFrame(()=>{c=setTimeout(()=>{l(u)},n)})},h=u=>{s=new MutationObserver(_=>{const d=document.querySelector(".el-picker-panel");d&&!r?(r=!0,v(u)):!d&&r&&(r=!1,c&&(clearTimeout(c),c=null))}),s.observe(document.body,{childList:!0,subtree:!0})},p=(()=>{let u=e.querySelector(i.input);return u||(u=e.querySelectorAll("input")[0]),u||e})();h(p);const S=()=>{};p.addEventListener("focus",S),p.addEventListener("click",S);const N=u=>{u.key==="Enter"||u.key};p.addEventListener("keydown",N);const Q=(()=>{const u=new MutationObserver(_=>{_.forEach(d=>{d.type==="attributes"&&d.attributeName==="aria-expanded"&&p.getAttribute("aria-expanded")==="true"&&v(p)})});return u.observe(p,{attributes:!0,attributeFilter:["aria-expanded"]}),u})();e.__a11yDatePickerAriaObserver=Q,e.__a11yDatePickerInput=p,e.__a11yDatePickerFocusHandler=S,e.__a11yDatePickerKeyHandler=N,e.__a11yDatePickerObserver=s},unmounted(e){if(e.__a11yDatePickerTimeout&&clearTimeout(e.__a11yDatePickerTimeout),e.__a11yDatePickerInput){const a=e.__a11yDatePickerInput;e.__a11yDatePickerFocusHandler&&(a.removeEventListener("focus",e.__a11yDatePickerFocusHandler),a.removeEventListener("click",e.__a11yDatePickerFocusHandler)),e.__a11yDatePickerKeyHandler&&a.removeEventListener("keydown",e.__a11yDatePickerKeyHandler)}e.__a11yDatePickerObserver&&e.__a11yDatePickerObserver.disconnect(),e.__a11yDatePickerAriaObserver&&e.__a11yDatePickerAriaObserver.disconnect(),delete e.__a11yDatePickerInput,delete e.__a11yDatePickerFocusHandler,delete e.__a11yDatePickerKeyHandler,delete e.__a11yDatePickerObserver,delete e.__a11yDatePickerAriaObserver,delete e.__a11yDatePickerTimeout}},H={"a11y-focus":w,"a11y-trap-focus":T,"a11y-keyboard":F,"a11y-announce":x,"a11y-skip-link":O,"a11y-skip":P,"a11y-aria":I,"a11y-date-picker":K};function C(e){Object.entries(H).forEach(([a,t])=>{e.directive(a,t)})}const z={install:C};o.a11yDirectives=H,o.announce=g,o.announceDirective=x,o.ariaDirective=I,o.containsActiveElement=W,o.datePickerDirective=K,o.default=z,o.focusDirective=w,o.generateId=J,o.getFirstFocusable=G,o.getFocusableElements=m,o.getLastFocusable=V,o.installA11yDirectives=C,o.keyboardDirective=F,o.removeAriaAttributes=B,o.restoreFocus=$,o.saveFocus=X,o.setAriaAttributes=E,o.skipDirective=P,o.skipLinkDirective=O,o.trapFocusDirective=T,Object.defineProperties(o,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-a11y-directives",
-  "version": "1.2.0",
+  "version": "1.2.2",
   "description": "A comprehensive set of Vue 3 directives for building accessible web applications with WCAG compliance",
   "main": "dist/vue-a11y-directives.cjs.js",
   "module": "dist/vue-a11y-directives.esm.js",

package/src/date-picker.directive.js

@@ -104,17 +104,7 @@ export default {
       // Make it focusable
       cellToFocus.setAttribute('tabindex', '0');
       
-      // Prevent click event on the cell when focusing programmatically
-      // This ensures focus only, not selection (user must press Enter/Space to select)
-      const preventClick = (e) => {
-        e.preventDefault();
-        e.stopPropagation();
-        cellToFocus.removeEventListener('click', preventClick);
-      };
-      
-      cellToFocus.addEventListener('click', preventClick, { once: true, capture: true });
-      
-      // Keep trying until it actually has focus
+      // Just focus the cell, keyboard navigation will be handled separately
       let attempts = 0;
       const maxAttempts = 10;
       
@@ -124,23 +114,75 @@ export default {
         
         // Check if focus actually worked
         if (document.activeElement === cellToFocus) {
-          // Remove the click preventer after a short delay
-          setTimeout(() => {
-            cellToFocus.removeEventListener('click', preventClick);
-          }, 100);
           return true;
         }
         
         // If not focused yet and we haven't exceeded attempts, try again
         if (attempts < maxAttempts) {
           setTimeout(forceFocus, 10); // Try again in 10ms
-        } else {
-          // Cleanup if we failed
-          cellToFocus.removeEventListener('click', preventClick);
         }
       };
       
       forceFocus();
+      
+      // Setup keyboard navigation handler on the calendar panel
+      // This prevents auto-selection when using arrow keys
+      // We need to capture the keydown BEFORE Element Plus processes it
+      const handleKeyboardNav = (e) => {
+        // Check if it's an arrow key
+        if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(e.key)) {
+          // Find the currently focused cell
+          const focusedCell = document.activeElement;
+          
+          // Prevent any default behavior on the table/cell
+          e.preventDefault();
+          
+          // Mark that we're navigating with keyboard
+          calendarPanel.__a11yNavigatingWithKeyboard = true;
+          
+          // Prevent ALL click/selection events that might be triggered
+          const preventAutoSelect = (event) => {
+            console.log('[DEBUG] Preventing', event.type, 'during keyboard navigation');
+            event.preventDefault();
+            event.stopPropagation();
+            event.stopImmediatePropagation();
+            return false;
+          };
+          
+          // Add preventers for all possible selection events
+          const eventTypes = ['click', 'mousedown', 'mouseup', 'pointerdown', 'pointerup', 'touchstart', 'touchend'];
+          
+          // Add to the entire calendar panel
+          eventTypes.forEach(eventType => {
+            calendarPanel.addEventListener(eventType, preventAutoSelect, { capture: true, once: true });
+          });
+          
+          // Also add to all table cells to be extra safe
+          const allCells = calendarPanel.querySelectorAll('td');
+          allCells.forEach(cell => {
+            eventTypes.forEach(eventType => {
+              cell.addEventListener(eventType, preventAutoSelect, { capture: true, once: true });
+            });
+          });
+          
+          // Let Element Plus's navigation happen (it moves focus)
+          // But our preventers will stop any selection
+          setTimeout(() => {
+            // Clear the flag after Element Plus has moved focus
+            calendarPanel.__a11yNavigatingWithKeyboard = false;
+            console.log('[DEBUG] Keyboard navigation complete');
+          }, 50);
+        }
+      };
+      
+      // Add keyboard handler with capture: true to intercept BEFORE Element Plus
+      if (!calendarPanel.__a11yKeyboardHandlerAdded) {
+        calendarPanel.__a11yKeyboardHandlerAdded = true;
+        calendarPanel.addEventListener('keydown', handleKeyboardNav, { capture: true });
+        calendarPanel.__a11yKeyboardHandler = handleKeyboardNav;
+        console.log('[DEBUG] Keyboard navigation handler installed');
+      }
+      
       return true;
     };