UNPKG

@codegouvfr/react-dsfr

Version:

French State Design System React integration library

4 lines (3 loc) 3.14 kB
/*! DSFR v1.10.2 | SPDX-License-Identifier: MIT | License-Filename: LICENSE.md | restricted use (see terms and conditions) */ !function(){"use strict";var e=window.dsfr,t={HEADER:e.internals.ns.selector("header"),TOOLS_LINKS:e.internals.ns.selector("header__tools-links"),MENU_LINKS:e.internals.ns.selector("header__menu-links"),BUTTONS:e.internals.ns.selector("header__tools-links")+" "+e.internals.ns.selector("btns-group")+", "+e.internals.ns.selector("header__tools-links")+" "+e.internals.ns.selector("links-group"),MODALS:""+e.internals.ns.selector("header__search")+e.internals.ns.selector("modal")+", "+e.internals.ns.selector("header__menu")+e.internals.ns.selector("modal")},n=function(n){function r(){n.apply(this,arguments)}n&&(r.__proto__=n),r.prototype=Object.create(n&&n.prototype),r.prototype.constructor=r;var s={instanceClassName:{configurable:!0}};return s.instanceClassName.get=function(){return"HeaderLinks"},r.prototype.init=function(){var n=this.queryParentSelector(t.HEADER);this.toolsLinks=n.querySelector(t.TOOLS_LINKS),this.menuLinks=n.querySelector(t.MENU_LINKS);var r="-mobile",s=this.toolsLinks.innerHTML.replace(/ +/g," "),a=this.menuLinks.innerHTML.replace(/ +/g," "),o=s.replace(/id="(.*?)"/gm,'id="$1'+r+'"');if((o=o.replace(/(<nav[.\s\S]*-translate [.\s\S]*) aria-controls="(.*?)"([.\s\S]*<\/nav>)/gm,'$1 aria-controls="$2'+r+'"$3'))!==a)switch(e.mode){case e.Modes.ANGULAR:case e.Modes.REACT:case e.Modes.VUE:this.warn("header__tools-links content is different from header__menu-links content.\nAs you're using a dynamic framework, you should handle duplication of this content yourself, please refer to documentation:\n"+e.header.doc);break;default:this.menuLinks.innerHTML=o}},Object.defineProperties(r,s),r}(e.core.Instance),r=function(t){function n(){t.call(this),this._clickHandling=this.clickHandler.bind(this)}t&&(n.__proto__=t),n.prototype=Object.create(t&&t.prototype),n.prototype.constructor=n;var r={instanceClassName:{configurable:!0}};return r.instanceClassName.get=function(){return"HeaderModal"},n.prototype.init=function(){this.isResizing=!0},n.prototype.resize=function(){this.isBreakpoint(e.core.Breakpoints.LG)?this.deactivateModal():this.activateModal()},n.prototype.activateModal=function(){var e=this.element.getInstance("Modal");e&&(e.isEnabled=!0,this.listen("click",this._clickHandling,{capture:!0}))},n.prototype.deactivateModal=function(){var e=this.element.getInstance("Modal");e&&(e.conceal(),e.isEnabled=!1,this.unlisten("click",this._clickHandling,{capture:!0}))},n.prototype.clickHandler=function(t){!t.target.matches("a, button")||t.target.matches("[aria-controls]")||t.target.matches(e.core.DisclosureSelector.PREVENT_CONCEAL)||this.element.getInstance("Modal").conceal()},Object.defineProperties(n,r),n}(e.core.Instance);e.header={HeaderLinks:n,HeaderModal:r,HeaderSelector:t,doc:"https://www.systeme-de-design.gouv.fr/elements-d-interface/composants/en-tete"},e.internals.register(e.header.HeaderSelector.TOOLS_LINKS,e.header.HeaderLinks),e.internals.register(e.header.HeaderSelector.MODALS,e.header.HeaderModal)}(); //# sourceMappingURL=header.nomodule.min.js.map