[ Index ]

PHP Cross Reference of WordPress

title

Body

[close]

/wp-includes/blocks/navigation/ -> view.js (source)

   1  /******/ (function() { // webpackBootstrap
   2  /******/     "use strict";
   3  var __webpack_exports__ = {};
   4  
   5  ;// CONCATENATED MODULE: ./node_modules/micromodal/dist/micromodal.es.js
   6  function e(e,t){for(var o=0;o<t.length;o++){var n=t[o];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}function t(e){return function(e){if(Array.isArray(e))return o(e)}(e)||function(e){if("undefined"!=typeof Symbol&&Symbol.iterator in Object(e))return Array.from(e)}(e)||function(e,t){if(!e)return;if("string"==typeof e)return o(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n||"Set"===n)return Array.from(e);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return o(e,t)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function o(e,t){(null==t||t>e.length)&&(t=e.length);for(var o=0,n=new Array(t);o<t;o++)n[o]=e[o];return n}var n,i,a,r,s,l=(n=["a[href]","area[href]",'input:not([disabled]):not([type="hidden"]):not([aria-hidden])',"select:not([disabled]):not([aria-hidden])","textarea:not([disabled]):not([aria-hidden])","button:not([disabled]):not([aria-hidden])","iframe","object","embed","[contenteditable]",'[tabindex]:not([tabindex^="-"])'],i=function(){function o(e){var n=e.targetModal,i=e.triggers,a=void 0===i?[]:i,r=e.onShow,s=void 0===r?function(){}:r,l=e.onClose,c=void 0===l?function(){}:l,d=e.openTrigger,u=void 0===d?"data-micromodal-trigger":d,f=e.closeTrigger,h=void 0===f?"data-micromodal-close":f,v=e.openClass,g=void 0===v?"is-open":v,m=e.disableScroll,b=void 0!==m&&m,y=e.disableFocus,p=void 0!==y&&y,w=e.awaitCloseAnimation,E=void 0!==w&&w,k=e.awaitOpenAnimation,M=void 0!==k&&k,A=e.debugMode,C=void 0!==A&&A;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,o),this.modal=document.getElementById(n),this.config={debugMode:C,disableScroll:b,openTrigger:u,closeTrigger:h,openClass:g,onShow:s,onClose:c,awaitCloseAnimation:E,awaitOpenAnimation:M,disableFocus:p},a.length>0&&this.registerTriggers.apply(this,t(a)),this.onClick=this.onClick.bind(this),this.onKeydown=this.onKeydown.bind(this)}var i,a,r;return i=o,(a=[{key:"registerTriggers",value:function(){for(var e=this,t=arguments.length,o=new Array(t),n=0;n<t;n++)o[n]=arguments[n];o.filter(Boolean).forEach((function(t){t.addEventListener("click",(function(t){return e.showModal(t)}))}))}},{key:"showModal",value:function(){var e=this,t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null;if(this.activeElement=document.activeElement,this.modal.setAttribute("aria-hidden","false"),this.modal.classList.add(this.config.openClass),this.scrollBehaviour("disable"),this.addEventListeners(),this.config.awaitOpenAnimation){var o=function t(){e.modal.removeEventListener("animationend",t,!1),e.setFocusToFirstNode()};this.modal.addEventListener("animationend",o,!1)}else this.setFocusToFirstNode();this.config.onShow(this.modal,this.activeElement,t)}},{key:"closeModal",value:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null,t=this.modal;if(this.modal.setAttribute("aria-hidden","true"),this.removeEventListeners(),this.scrollBehaviour("enable"),this.activeElement&&this.activeElement.focus&&this.activeElement.focus(),this.config.onClose(this.modal,this.activeElement,e),this.config.awaitCloseAnimation){var o=this.config.openClass;this.modal.addEventListener("animationend",(function e(){t.classList.remove(o),t.removeEventListener("animationend",e,!1)}),!1)}else t.classList.remove(this.config.openClass)}},{key:"closeModalById",value:function(e){this.modal=document.getElementById(e),this.modal&&this.closeModal()}},{key:"scrollBehaviour",value:function(e){if(this.config.disableScroll){var t=document.querySelector("body");switch(e){case"enable":Object.assign(t.style,{overflow:""});break;case"disable":Object.assign(t.style,{overflow:"hidden"})}}}},{key:"addEventListeners",value:function(){this.modal.addEventListener("touchstart",this.onClick),this.modal.addEventListener("click",this.onClick),document.addEventListener("keydown",this.onKeydown)}},{key:"removeEventListeners",value:function(){this.modal.removeEventListener("touchstart",this.onClick),this.modal.removeEventListener("click",this.onClick),document.removeEventListener("keydown",this.onKeydown)}},{key:"onClick",value:function(e){(e.target.hasAttribute(this.config.closeTrigger)||e.target.parentNode.hasAttribute(this.config.closeTrigger))&&(e.preventDefault(),e.stopPropagation(),this.closeModal(e))}},{key:"onKeydown",value:function(e){27===e.keyCode&&this.closeModal(e),9===e.keyCode&&this.retainFocus(e)}},{key:"getFocusableNodes",value:function(){var e=this.modal.querySelectorAll(n);return Array.apply(void 0,t(e))}},{key:"setFocusToFirstNode",value:function(){var e=this;if(!this.config.disableFocus){var t=this.getFocusableNodes();if(0!==t.length){var o=t.filter((function(t){return!t.hasAttribute(e.config.closeTrigger)}));o.length>0&&o[0].focus(),0===o.length&&t[0].focus()}}}},{key:"retainFocus",value:function(e){var t=this.getFocusableNodes();if(0!==t.length)if(t=t.filter((function(e){return null!==e.offsetParent})),this.modal.contains(document.activeElement)){var o=t.indexOf(document.activeElement);e.shiftKey&&0===o&&(t[t.length-1].focus(),e.preventDefault()),!e.shiftKey&&t.length>0&&o===t.length-1&&(t[0].focus(),e.preventDefault())}else t[0].focus()}}])&&e(i.prototype,a),r&&e(i,r),o}(),a=null,r=function(e){if(!document.getElementById(e))return console.warn("MicroModal: ❗Seems like you have missed %c'".concat(e,"'"),"background-color: #f8f9fa;color: #50596c;font-weight: bold;","ID somewhere in your code. Refer example below to resolve it."),console.warn("%cExample:","background-color: #f8f9fa;color: #50596c;font-weight: bold;",'<div class="modal" id="'.concat(e,'"></div>')),!1},s=function(e,t){if(function(e){e.length<=0&&(console.warn("MicroModal: ❗Please specify at least one %c'micromodal-trigger'","background-color: #f8f9fa;color: #50596c;font-weight: bold;","data attribute."),console.warn("%cExample:","background-color: #f8f9fa;color: #50596c;font-weight: bold;",'<a href="#" data-micromodal-trigger="my-modal"></a>'))}(e),!t)return!0;for(var o in t)r(o);return!0},{init:function(e){var o=Object.assign({},{openTrigger:"data-micromodal-trigger"},e),n=t(document.querySelectorAll("[".concat(o.openTrigger,"]"))),r=function(e,t){var o=[];return e.forEach((function(e){var n=e.attributes[t].value;void 0===o[n]&&(o[n]=[]),o[n].push(e)})),o}(n,o.openTrigger);if(!0!==o.debugMode||!1!==s(n,r))for(var l in r){var c=r[l];o.targetModal=l,o.triggers=t(c),a=new i(o)}},show:function(e,t){var o=t||{};o.targetModal=e,!0===o.debugMode&&!1===r(e)||(a&&a.removeEventListeners(),(a=new i(o)).showModal())},close:function(e){e?a.closeModalById(e):a.closeModal()}});"undefined"!=typeof window&&(window.MicroModal=l);/* harmony default export */ var micromodal_es = (l);
   7  
   8  ;// CONCATENATED MODULE: ./node_modules/@wordpress/block-library/build-module/navigation/view.js
   9  /**
  10   * External dependencies
  11   */
  12   // Responsive navigation toggle.
  13  
  14  function navigationToggleModal(modal) {
  15    const dialogContainer = modal.querySelector(`.wp-block-navigation__responsive-dialog`);
  16    const isHidden = 'true' === modal.getAttribute('aria-hidden');
  17    modal.classList.toggle('has-modal-open', !isHidden);
  18    dialogContainer.toggleAttribute('aria-modal', !isHidden);
  19  
  20    if (isHidden) {
  21      dialogContainer.removeAttribute('role');
  22      dialogContainer.removeAttribute('aria-modal');
  23    } else {
  24      dialogContainer.setAttribute('role', 'dialog');
  25      dialogContainer.setAttribute('aria-modal', 'true');
  26    } // Add a class to indicate the modal is open.
  27  
  28  
  29    const htmlElement = document.documentElement;
  30    htmlElement.classList.toggle('has-modal-open');
  31  } // Open on click functionality.
  32  
  33  
  34  function closeSubmenus(element) {
  35    element.querySelectorAll('[aria-expanded="true"]').forEach(function (toggle) {
  36      toggle.setAttribute('aria-expanded', 'false');
  37    });
  38  }
  39  
  40  function toggleSubmenuOnClick(event) {
  41    const buttonToggle = event.target.closest('[aria-expanded]');
  42    const isSubmenuOpen = buttonToggle.getAttribute('aria-expanded');
  43  
  44    if (isSubmenuOpen === 'true') {
  45      closeSubmenus(buttonToggle.closest('.wp-block-navigation-item'));
  46    } else {
  47      // Close all sibling submenus.
  48      const parentElement = buttonToggle.closest('.wp-block-navigation-item');
  49      const navigationParent = buttonToggle.closest('.wp-block-navigation__submenu-container, .wp-block-navigation__container, .wp-block-page-list');
  50      navigationParent.querySelectorAll('.wp-block-navigation-item').forEach(function (child) {
  51        if (child !== parentElement) {
  52          closeSubmenus(child);
  53        }
  54      }); // Open submenu.
  55  
  56      buttonToggle.setAttribute('aria-expanded', 'true');
  57    }
  58  } // Necessary for some themes such as TT1 Blocks, where
  59  // scripts could be loaded before the body.
  60  
  61  
  62  window.addEventListener('load', () => {
  63    micromodal_es.init({
  64      onShow: navigationToggleModal,
  65      onClose: navigationToggleModal,
  66      openClass: 'is-menu-open'
  67    });
  68    const submenuButtons = document.querySelectorAll('.wp-block-navigation-submenu__toggle');
  69    submenuButtons.forEach(function (button) {
  70      button.addEventListener('click', toggleSubmenuOnClick);
  71    }); // Close on click outside.
  72  
  73    document.addEventListener('click', function (event) {
  74      const navigationBlocks = document.querySelectorAll('.wp-block-navigation');
  75      navigationBlocks.forEach(function (block) {
  76        if (!block.contains(event.target)) {
  77          closeSubmenus(block);
  78        }
  79      });
  80    }); // Close on focus outside.
  81  
  82    document.addEventListener('keyup', function (event) {
  83      const submenuBlocks = document.querySelectorAll('.wp-block-navigation-item.has-child');
  84      submenuBlocks.forEach(function (block) {
  85        if (!block.contains(event.target)) {
  86          closeSubmenus(block);
  87        }
  88      });
  89    });
  90  });
  91  
  92  /******/ })()
  93  ;


Generated: Wed Jun 19 01:00:02 2024 Cross-referenced by PHPXref 0.7.1