UNPKG

@wikimedia/codex

Version:

Codex Design System for Wikimedia

2 lines (1 loc) 2.77 kB
"use strict";const a=require("vue"),T=require("./unwrapElement.js");function x(r){const{containerRef:t,bodyRef:l,anchorRef:c,preventScroll:s=!1}=r,m=a.ref(),f=a.ref(),e=a.ref();let o=null;function i(){if(!c||!o)return!1;const n=T.unwrapElement(c.value);return!!(n!=null&&n.contains(o))}function y(){t.value&&p(t.value)}function g(){t.value&&p(t.value,!0)}function b(n){setTimeout(()=>{n.scrollIntoView({behavior:"smooth",block:"nearest",inline:"nearest"})},500)}function p(n,d=!1){let u=Array.from(n.querySelectorAll('\n input, select, textarea, button, object, a, area,\n [contenteditable], [tabindex]:not([tabindex^="-"])\n '));d&&(u=u.reverse());for(const v of u)if(v.focus({preventScroll:s}),document.activeElement===v)return s&&b(v),!0;return!1}async function w(){var d,u;if(await a.nextTick(),o=document.activeElement,i())return;const n=(d=l==null?void 0:l.value)!=null?d:t.value;n&&!p(n)&&((u=e.value)==null||u.focus({preventScroll:s}))}function E(){if(i()){o=null;return}o instanceof HTMLElement&&document.contains(o)&&(o.focus({preventScroll:s}),o=null)}return{focusTrapStart:m,focusTrapEnd:f,focusHolder:e,focusFirst:y,focusLast:g,activateFocusTrap:w,deactivateFocusTrap:E}}function F(){const r=document.documentElement;if(r.scrollHeight<=r.clientHeight)return 0;const t=document.createElement("div");t.style.position="absolute",t.style.top="-9999px",t.style.width="100px",t.style.height="100px",t.style.overflow="scroll",document.body.appendChild(t);const l=t.offsetWidth-t.clientWidth;return document.body.removeChild(t),l}function S(){if(typeof navigator=="undefined")return!1;const r=navigator.userAgent;return/iP(ad|hone|od)/.test(r)||navigator.platform==="MacIntel"&&navigator.maxTouchPoints>1}function h(){return"scrollingElement"in document&&document.scrollingElement instanceof HTMLElement?document.scrollingElement:document.documentElement}function P(r){let t=0,l=0,c=!1;const s=typeof window!="undefined"&&typeof document!="undefined";function m(){if(!s)return;const e=document.body,o=h();S()?(t=o.scrollLeft,l=o.scrollTop,c=!0,e.style.position="fixed",e.style.top="-".concat(l,"px"),e.style.left="0",e.style.right="0",e.style.width="100%"):c=!1;const i=F();i>0&&(e.style.paddingRight="".concat(i,"px")),e.style.overflow="hidden"}function f(){if(!s)return;const e=document.body,o=h();if(e.style.removeProperty("overflow"),e.style.removeProperty("padding-right"),c){const i=t,y=l;c=!1,e.style.removeProperty("position"),e.style.removeProperty("top"),e.style.removeProperty("left"),e.style.removeProperty("right"),e.style.removeProperty("width"),window.requestAnimationFrame(()=>{o.scrollLeft=i,o.scrollTop=y})}}a.watch(r,e=>{e?m():f()},{immediate:!0}),a.onBeforeUnmount(()=>{r.value&&f()})}exports.useFocusTrap=x;exports.useScrollLock=P;