3 lines
7.4 KiB
JavaScript
3 lines
7.4 KiB
JavaScript
/*! DSFR v1.11.2 | SPDX-License-Identifier: MIT | License-Filename: LICENSE.md | restricted use (see terms and conditions) */
|
|
const t=window.dsfr,e={MODAL:t.internals.ns.selector("modal"),SCROLL_DIVIDER:t.internals.ns.selector("scroll-divider"),BODY:t.internals.ns.selector("modal__body"),TITLE:t.internals.ns.selector("modal__title")};class i extends t.core.DisclosureButton{constructor(){super(t.core.DisclosureType.OPENED)}static get instanceClassName(){return"ModalButton"}}const s={CONCEALING_BACKDROP:t.internals.ns.attr("concealing-backdrop")};class n extends t.core.Disclosure{constructor(){super(t.core.DisclosureType.OPENED,e.MODAL,i,"ModalsGroup"),this._isActive=!1,this.scrolling=this.resize.bind(this,!1),this.resizing=this.resize.bind(this,!0)}static get instanceClassName(){return"Modal"}init(){super.init(),this._isDialog="DIALOG"===this.node.tagName,this.isScrolling=!1,this.listenClick(),this.addEmission(t.core.RootEmission.KEYDOWN,this._keydown.bind(this))}_keydown(e){if(e===t.core.KeyCodes.ESCAPE)this._escape()}_escape(){switch(document.activeElement?document.activeElement.tagName:void 0){case"INPUT":case"LABEL":case"TEXTAREA":case"SELECT":case"AUDIO":case"VIDEO":break;default:this.isDisclosed&&(this.conceal(),this.focus())}}retrieved(){this._ensureAccessibleName()}get body(){return this.element.getDescendantInstances("ModalBody","Modal")[0]}handleClick(t){t.target===this.node&&"false"!==this.getAttribute(s.CONCEALING_BACKDROP)&&this.conceal()}disclose(t){return!!super.disclose(t)&&(this.body&&this.body.activate(),this.isScrollLocked=!0,this.setAttribute("aria-modal","true"),this.setAttribute("open","true"),this._isDialog||this.activateModal(),!0)}conceal(t,e){return!!super.conceal(t,e)&&(this.isScrollLocked=!1,this.removeAttribute("aria-modal"),this.removeAttribute("open"),this.body&&this.body.deactivate(),this._isDialog||this.deactivateModal(),!0)}get isDialog(){return this._isDialog}set isDialog(t){this._isDialog=t}activateModal(){this._isActive||(this._isActive=!0,this._hasDialogRole="dialog"===this.getAttribute("role"),this._hasDialogRole||this.setAttribute("role","dialog"))}deactivateModal(){this._isActive&&(this._isActive=!1,this._hasDialogRole||this.removeAttribute("role"))}_setAccessibleName(t,e){const i=this.retrieveNodeId(t,e);this.warn(`add reference to ${e} for accessible name (aria-labelledby)`),this.setAttribute("aria-labelledby",i)}_ensureAccessibleName(){if(this.hasAttribute("aria-labelledby")||this.hasAttribute("aria-label"))return;this.warn("missing accessible name");const t=this.node.querySelector(e.TITLE),i=this.primaryButtons[0];switch(!0){case null!==t:this._setAccessibleName(t,"title");break;case void 0!==i:this.warn("missing required title, fallback to primary button"),this._setAccessibleName(i,"primary")}}}const o=['[tabindex="0"]',"a[href]","button:not([disabled])","input:not([disabled])","select:not([disabled])","textarea:not([disabled])","audio[controls]","video[controls]",'[contenteditable]:not([contenteditable="false"])',"details>summary:first-of-type","details","iframe"].join(),a=['[tabindex]:not([tabindex="-1"]):not([tabindex="0"])'].join(),r=(t,e)=>{if(!(t instanceof Element))return!1;const i=window.getComputedStyle(t);if(!i)return!1;if("hidden"===i.visibility)return!1;for(void 0===e&&(e=t);e.contains(t);){if("none"===i.display)return!1;t=t.parentElement}return!0};class l{constructor(t,e){this.element=null,this.activeElement=null,this.onTrap=t,this.onUntrap=e,this.waiting=this.wait.bind(this),this.handling=this.handle.bind(this),this.focusing=this.maintainFocus.bind(this),this.current=null}get trapped(){return null!==this.element}trap(t){this.trapped&&this.untrap(),this.element=t,this.isTrapping=!0,this.wait(),this.onTrap&&this.onTrap()}wait(){r(this.element)?this.trapping():window.requestAnimationFrame(this.waiting)}trapping(){if(!this.isTrapping)return;this.isTrapping=!1;const t=this.focusables;t.length&&-1===t.indexOf(document.activeElement)&&t[0].focus(),this.element.setAttribute("aria-modal",!0),window.addEventListener("keydown",this.handling),document.body.addEventListener("focus",this.focusing,!0)}stun(t){for(const e of t.children)e!==this.element&&(e.contains(this.element)?this.stun(e):this.stunneds.push(new c(e)))}maintainFocus(t){if(!this.element.contains(t.target)){const e=this.focusables;if(0===e.length)return;const i=e[0];t.preventDefault(),i.focus()}}handle(t){if(9!==t.keyCode)return;const e=this.focusables;if(0===e.length)return;const i=e[0],s=e[e.length-1],n=e.indexOf(document.activeElement);t.shiftKey?!this.element.contains(document.activeElement)||n<1?(t.preventDefault(),s.focus()):(document.activeElement.tabIndex>0||e[n-1].tabIndex>0)&&(t.preventDefault(),e[n-1].focus()):this.element.contains(document.activeElement)&&n!==e.length-1&&-1!==n?document.activeElement.tabIndex>0&&(t.preventDefault(),e[n+1].focus()):(t.preventDefault(),i.focus())}get focusables(){let e=t.internals.dom.querySelectorAllArray(this.element,o);const i=t.internals.dom.querySelectorAllArray(document.documentElement,'input[type="radio"]');if(i.length){const t={};for(const e of i){const i=e.getAttribute("name");void 0===t[i]&&(t[i]=new d(i)),t[i].push(e)}e=e.filter((e=>{if("input"!==e.tagName.toLowerCase()||"radio"!==e.getAttribute("type").toLowerCase())return!0;const i=e.getAttribute("name");return t[i].keep(e)}))}const s=t.internals.dom.querySelectorAllArray(this.element,a);s.sort(((t,e)=>t.tabIndex-e.tabIndex));const n=e.filter((t=>-1===s.indexOf(t)));return s.concat(n).filter((t=>"-1"!==t.tabIndex&&r(t,this.element)))}untrap(){this.trapped&&(this.isTrapping=!1,this.element.removeAttribute("aria-modal"),window.removeEventListener("keydown",this.handling),document.body.removeEventListener("focus",this.focusing,!0),this.element=null,this.onUntrap&&this.onUntrap())}dispose(){this.untrap()}}class c{constructor(t){this.element=t,this.inert=t.getAttribute("inert"),this.element.setAttribute("inert","")}unstun(){null===this.inert?this.element.removeAttribute("inert"):this.element.setAttribute("inert",this.inert)}}class d{constructor(t){this.name=t,this.buttons=[]}push(t){this.buttons.push(t),(t===document.activeElement||t.checked||void 0===this.selected)&&(this.selected=t)}keep(t){return this.selected===t}}class h extends t.core.DisclosuresGroup{constructor(){super("Modal",!1),this.focusTrap=new l}static get instanceClassName(){return"ModalsGroup"}apply(t,e){super.apply(t,e),null===this.current?this.focusTrap.untrap():this.focusTrap.trap(this.current.node)}}class u extends t.core.Instance{static get instanceClassName(){return"ModalBody"}init(){this.listen("scroll",this.divide.bind(this))}activate(){this.isResizing=!0,this.resize()}deactivate(){this.isResizing=!1}divide(){this.node.scrollHeight>this.node.clientHeight?this.node.offsetHeight+this.node.scrollTop>=this.node.scrollHeight?this.removeClass(e.SCROLL_DIVIDER):this.addClass(e.SCROLL_DIVIDER):this.removeClass(e.SCROLL_DIVIDER)}resize(){this.adjust(),this.request(this.adjust.bind(this))}adjust(){const e=32*(this.isBreakpoint(t.core.Breakpoints.MD)?2:1);this.isLegacy?this.style.maxHeight=window.innerHeight-e+"px":this.style.setProperty("--modal-max-height",window.innerHeight-e+"px"),this.divide()}}t.modal={Modal:n,ModalButton:i,ModalBody:u,ModalsGroup:h,ModalSelector:e},t.internals.register(t.modal.ModalSelector.MODAL,t.modal.Modal),t.internals.register(t.modal.ModalSelector.BODY,t.modal.ModalBody),t.internals.register(t.core.RootSelector.ROOT,t.modal.ModalsGroup);
|
|
//# sourceMappingURL=modal.module.min.js.map
|