@wordpress/block-library 8.19.8 → 8.19.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3,14 +3,17 @@
3
3
  */
4
4
  import { store as wpStore } from '@wordpress/interactivity';
5
5
  const focusableSelectors = ['a[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])', '[contenteditable]', '[tabindex]:not([tabindex^="-"])'];
6
+
7
+ // This is a fix for Safari in iOS/iPadOS. Without it, Safari doesn't focus out
8
+ // when the user taps in the body. It can be removed once we add an overlay to
9
+ // capture the clicks, instead of relying on the focusout event.
10
+ document.addEventListener('click', () => {});
6
11
  const openMenu = (store, menuOpenedOn) => {
7
12
  const {
8
13
  context,
9
- ref,
10
14
  selectors
11
15
  } = store;
12
16
  selectors.core.navigation.menuOpenedBy(store)[menuOpenedOn] = true;
13
- context.core.navigation.previousFocus = ref;
14
17
  if (context.core.navigation.type === 'overlay') {
15
18
  // Add a `has-modal-open` class to the <html> root.
16
19
  document.documentElement.classList.add('has-modal-open');
@@ -25,7 +28,7 @@ const closeMenu = (store, menuClosedOn) => {
25
28
  // Check if the menu is still open or not.
26
29
  if (!selectors.core.navigation.isMenuOpen(store)) {
27
30
  if (context.core.navigation.modal?.contains(window.document.activeElement)) {
28
- context.core.navigation.previousFocus.focus();
31
+ context.core.navigation.previousFocus?.focus();
29
32
  }
30
33
  context.core.navigation.modal = null;
31
34
  context.core.navigation.previousFocus = null;
@@ -113,6 +116,11 @@ wpStore({
113
116
  closeMenu(store, 'hover');
114
117
  },
115
118
  openMenuOnClick(store) {
119
+ const {
120
+ context,
121
+ ref
122
+ } = store;
123
+ context.core.navigation.previousFocus = ref;
116
124
  openMenu(store, 'click');
117
125
  },
118
126
  closeMenuOnClick(store) {
@@ -124,13 +132,18 @@ wpStore({
124
132
  },
125
133
  toggleMenuOnClick: store => {
126
134
  const {
127
- selectors
135
+ selectors,
136
+ context,
137
+ ref
128
138
  } = store;
139
+ // Safari won't send focus to the clicked element, so we need to manually place it: https://bugs.webkit.org/show_bug.cgi?id=22261
140
+ if (window.document.activeElement !== ref) ref.focus();
129
141
  const menuOpenedBy = selectors.core.navigation.menuOpenedBy(store);
130
142
  if (menuOpenedBy.click || menuOpenedBy.focus) {
131
143
  closeMenu(store, 'click');
132
144
  closeMenu(store, 'focus');
133
145
  } else {
146
+ context.core.navigation.previousFocus = ref;
134
147
  openMenu(store, 'click');
135
148
  }
136
149
  },
@@ -171,7 +184,9 @@ wpStore({
171
184
  // event.relatedTarget === The element receiving focus (if any)
172
185
  // When focusout is outsite the document,
173
186
  // `window.document.activeElement` doesn't change.
174
- if (!context.core.navigation.modal?.contains(event.relatedTarget) && event.target !== window.document.activeElement) {
187
+
188
+ // The event.relatedTarget is null when something outside the navigation menu is clicked. This is only necessary for Safari.
189
+ if (event.relatedTarget === null || !context.core.navigation.modal?.contains(event.relatedTarget) && event.target !== window.document.activeElement) {
175
190
  closeMenu(store, 'click');
176
191
  closeMenu(store, 'focus');
177
192
  }
@@ -1 +1 @@
1
- {"version":3,"names":["store","wpStore","focusableSelectors","openMenu","menuOpenedOn","context","ref","selectors","core","navigation","menuOpenedBy","previousFocus","type","document","documentElement","classList","add","closeMenu","menuClosedOn","isMenuOpen","modal","contains","window","activeElement","focus","remove","effects","initMenu","focusableElements","querySelectorAll","firstFocusableElement","lastFocusableElement","length","focusFirstElement","querySelector","roleAttribute","ariaModal","ariaLabel","Object","values","filter","Boolean","actions","openMenuOnHover","overlayOpenedBy","closeMenuOnHover","openMenuOnClick","closeMenuOnClick","openMenuOnFocus","toggleMenuOnClick","click","handleMenuKeydown","event","key","shiftKey","preventDefault","handleMenuFocusout","relatedTarget","target"],"sources":["@wordpress/block-library/src/navigation/view.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { store as wpStore } from '@wordpress/interactivity';\n\nconst focusableSelectors = [\n\t'a[href]',\n\t'input:not([disabled]):not([type=\"hidden\"]):not([aria-hidden])',\n\t'select:not([disabled]):not([aria-hidden])',\n\t'textarea:not([disabled]):not([aria-hidden])',\n\t'button:not([disabled]):not([aria-hidden])',\n\t'[contenteditable]',\n\t'[tabindex]:not([tabindex^=\"-\"])',\n];\n\nconst openMenu = ( store, menuOpenedOn ) => {\n\tconst { context, ref, selectors } = store;\n\tselectors.core.navigation.menuOpenedBy( store )[ menuOpenedOn ] = true;\n\tcontext.core.navigation.previousFocus = ref;\n\tif ( context.core.navigation.type === 'overlay' ) {\n\t\t// Add a `has-modal-open` class to the <html> root.\n\t\tdocument.documentElement.classList.add( 'has-modal-open' );\n\t}\n};\n\nconst closeMenu = ( store, menuClosedOn ) => {\n\tconst { context, selectors } = store;\n\tselectors.core.navigation.menuOpenedBy( store )[ menuClosedOn ] = false;\n\t// Check if the menu is still open or not.\n\tif ( ! selectors.core.navigation.isMenuOpen( store ) ) {\n\t\tif (\n\t\t\tcontext.core.navigation.modal?.contains(\n\t\t\t\twindow.document.activeElement\n\t\t\t)\n\t\t) {\n\t\t\tcontext.core.navigation.previousFocus.focus();\n\t\t}\n\t\tcontext.core.navigation.modal = null;\n\t\tcontext.core.navigation.previousFocus = null;\n\t\tif ( context.core.navigation.type === 'overlay' ) {\n\t\t\tdocument.documentElement.classList.remove( 'has-modal-open' );\n\t\t}\n\t}\n};\n\nwpStore( {\n\teffects: {\n\t\tcore: {\n\t\t\tnavigation: {\n\t\t\t\tinitMenu: ( store ) => {\n\t\t\t\t\tconst { context, selectors, ref } = store;\n\t\t\t\t\tif ( selectors.core.navigation.isMenuOpen( store ) ) {\n\t\t\t\t\t\tconst focusableElements =\n\t\t\t\t\t\t\tref.querySelectorAll( focusableSelectors );\n\t\t\t\t\t\tcontext.core.navigation.modal = ref;\n\t\t\t\t\t\tcontext.core.navigation.firstFocusableElement =\n\t\t\t\t\t\t\tfocusableElements[ 0 ];\n\t\t\t\t\t\tcontext.core.navigation.lastFocusableElement =\n\t\t\t\t\t\t\tfocusableElements[ focusableElements.length - 1 ];\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\tfocusFirstElement: ( store ) => {\n\t\t\t\t\tconst { selectors, ref } = store;\n\t\t\t\t\tif ( selectors.core.navigation.isMenuOpen( store ) ) {\n\t\t\t\t\t\tref.querySelector(\n\t\t\t\t\t\t\t'.wp-block-navigation-item > *:first-child'\n\t\t\t\t\t\t).focus();\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t},\n\tselectors: {\n\t\tcore: {\n\t\t\tnavigation: {\n\t\t\t\troleAttribute: ( store ) => {\n\t\t\t\t\tconst { context, selectors } = store;\n\t\t\t\t\treturn context.core.navigation.type === 'overlay' &&\n\t\t\t\t\t\tselectors.core.navigation.isMenuOpen( store )\n\t\t\t\t\t\t? 'dialog'\n\t\t\t\t\t\t: null;\n\t\t\t\t},\n\t\t\t\tariaModal: ( store ) => {\n\t\t\t\t\tconst { context, selectors } = store;\n\t\t\t\t\treturn context.core.navigation.type === 'overlay' &&\n\t\t\t\t\t\tselectors.core.navigation.isMenuOpen( store )\n\t\t\t\t\t\t? 'true'\n\t\t\t\t\t\t: null;\n\t\t\t\t},\n\t\t\t\tariaLabel: ( store ) => {\n\t\t\t\t\tconst { context, selectors } = store;\n\t\t\t\t\treturn context.core.navigation.type === 'overlay' &&\n\t\t\t\t\t\tselectors.core.navigation.isMenuOpen( store )\n\t\t\t\t\t\t? context.core.navigation.ariaLabel\n\t\t\t\t\t\t: null;\n\t\t\t\t},\n\t\t\t\tisMenuOpen: ( { context } ) =>\n\t\t\t\t\t// The menu is opened if either `click`, `hover` or `focus` is true.\n\t\t\t\t\tObject.values(\n\t\t\t\t\t\tcontext.core.navigation[\n\t\t\t\t\t\t\tcontext.core.navigation.type === 'overlay'\n\t\t\t\t\t\t\t\t? 'overlayOpenedBy'\n\t\t\t\t\t\t\t\t: 'submenuOpenedBy'\n\t\t\t\t\t\t]\n\t\t\t\t\t).filter( Boolean ).length > 0,\n\t\t\t\tmenuOpenedBy: ( { context } ) =>\n\t\t\t\t\tcontext.core.navigation[\n\t\t\t\t\t\tcontext.core.navigation.type === 'overlay'\n\t\t\t\t\t\t\t? 'overlayOpenedBy'\n\t\t\t\t\t\t\t: 'submenuOpenedBy'\n\t\t\t\t\t],\n\t\t\t},\n\t\t},\n\t},\n\tactions: {\n\t\tcore: {\n\t\t\tnavigation: {\n\t\t\t\topenMenuOnHover( store ) {\n\t\t\t\t\tconst { navigation } = store.context.core;\n\t\t\t\t\tif (\n\t\t\t\t\t\tnavigation.type === 'submenu' &&\n\t\t\t\t\t\t// Only open on hover if the overlay is closed.\n\t\t\t\t\t\tObject.values(\n\t\t\t\t\t\t\tnavigation.overlayOpenedBy || {}\n\t\t\t\t\t\t).filter( Boolean ).length === 0\n\t\t\t\t\t)\n\t\t\t\t\t\topenMenu( store, 'hover' );\n\t\t\t\t},\n\t\t\t\tcloseMenuOnHover( store ) {\n\t\t\t\t\tcloseMenu( store, 'hover' );\n\t\t\t\t},\n\t\t\t\topenMenuOnClick( store ) {\n\t\t\t\t\topenMenu( store, 'click' );\n\t\t\t\t},\n\t\t\t\tcloseMenuOnClick( store ) {\n\t\t\t\t\tcloseMenu( store, 'click' );\n\t\t\t\t\tcloseMenu( store, 'focus' );\n\t\t\t\t},\n\t\t\t\topenMenuOnFocus( store ) {\n\t\t\t\t\topenMenu( store, 'focus' );\n\t\t\t\t},\n\t\t\t\ttoggleMenuOnClick: ( store ) => {\n\t\t\t\t\tconst { selectors } = store;\n\t\t\t\t\tconst menuOpenedBy =\n\t\t\t\t\t\tselectors.core.navigation.menuOpenedBy( store );\n\t\t\t\t\tif ( menuOpenedBy.click || menuOpenedBy.focus ) {\n\t\t\t\t\t\tcloseMenu( store, 'click' );\n\t\t\t\t\t\tcloseMenu( store, 'focus' );\n\t\t\t\t\t} else {\n\t\t\t\t\t\topenMenu( store, 'click' );\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\thandleMenuKeydown: ( store ) => {\n\t\t\t\t\tconst { context, selectors, event } = store;\n\t\t\t\t\tif (\n\t\t\t\t\t\tselectors.core.navigation.menuOpenedBy( store ).click\n\t\t\t\t\t) {\n\t\t\t\t\t\t// If Escape close the menu.\n\t\t\t\t\t\tif ( event?.key === 'Escape' ) {\n\t\t\t\t\t\t\tcloseMenu( store, 'click' );\n\t\t\t\t\t\t\tcloseMenu( store, 'focus' );\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Trap focus if it is an overlay (main menu).\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tcontext.core.navigation.type === 'overlay' &&\n\t\t\t\t\t\t\tevent.key === 'Tab'\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t// If shift + tab it change the direction.\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\tevent.shiftKey &&\n\t\t\t\t\t\t\t\twindow.document.activeElement ===\n\t\t\t\t\t\t\t\t\tcontext.core.navigation\n\t\t\t\t\t\t\t\t\t\t.firstFocusableElement\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\tcontext.core.navigation.lastFocusableElement.focus();\n\t\t\t\t\t\t\t} else if (\n\t\t\t\t\t\t\t\t! event.shiftKey &&\n\t\t\t\t\t\t\t\twindow.document.activeElement ===\n\t\t\t\t\t\t\t\t\tcontext.core.navigation.lastFocusableElement\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\tcontext.core.navigation.firstFocusableElement.focus();\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\thandleMenuFocusout: ( store ) => {\n\t\t\t\t\tconst { context, event } = store;\n\t\t\t\t\t// If focus is outside modal, and in the document, close menu\n\t\t\t\t\t// event.target === The element losing focus\n\t\t\t\t\t// event.relatedTarget === The element receiving focus (if any)\n\t\t\t\t\t// When focusout is outsite the document,\n\t\t\t\t\t// `window.document.activeElement` doesn't change.\n\t\t\t\t\tif (\n\t\t\t\t\t\t! context.core.navigation.modal?.contains(\n\t\t\t\t\t\t\tevent.relatedTarget\n\t\t\t\t\t\t) &&\n\t\t\t\t\t\tevent.target !== window.document.activeElement\n\t\t\t\t\t) {\n\t\t\t\t\t\tcloseMenu( store, 'click' );\n\t\t\t\t\t\tcloseMenu( store, 'focus' );\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t},\n} );\n"],"mappings":"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"}
1
+ {"version":3,"names":["store","wpStore","focusableSelectors","document","addEventListener","openMenu","menuOpenedOn","context","selectors","core","navigation","menuOpenedBy","type","documentElement","classList","add","closeMenu","menuClosedOn","isMenuOpen","modal","contains","window","activeElement","previousFocus","focus","remove","effects","initMenu","ref","focusableElements","querySelectorAll","firstFocusableElement","lastFocusableElement","length","focusFirstElement","querySelector","roleAttribute","ariaModal","ariaLabel","Object","values","filter","Boolean","actions","openMenuOnHover","overlayOpenedBy","closeMenuOnHover","openMenuOnClick","closeMenuOnClick","openMenuOnFocus","toggleMenuOnClick","click","handleMenuKeydown","event","key","shiftKey","preventDefault","handleMenuFocusout","relatedTarget","target"],"sources":["@wordpress/block-library/src/navigation/view.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { store as wpStore } from '@wordpress/interactivity';\n\nconst focusableSelectors = [\n\t'a[href]',\n\t'input:not([disabled]):not([type=\"hidden\"]):not([aria-hidden])',\n\t'select:not([disabled]):not([aria-hidden])',\n\t'textarea:not([disabled]):not([aria-hidden])',\n\t'button:not([disabled]):not([aria-hidden])',\n\t'[contenteditable]',\n\t'[tabindex]:not([tabindex^=\"-\"])',\n];\n\n// This is a fix for Safari in iOS/iPadOS. Without it, Safari doesn't focus out\n// when the user taps in the body. It can be removed once we add an overlay to\n// capture the clicks, instead of relying on the focusout event.\ndocument.addEventListener( 'click', () => {} );\n\nconst openMenu = ( store, menuOpenedOn ) => {\n\tconst { context, selectors } = store;\n\tselectors.core.navigation.menuOpenedBy( store )[ menuOpenedOn ] = true;\n\tif ( context.core.navigation.type === 'overlay' ) {\n\t\t// Add a `has-modal-open` class to the <html> root.\n\t\tdocument.documentElement.classList.add( 'has-modal-open' );\n\t}\n};\n\nconst closeMenu = ( store, menuClosedOn ) => {\n\tconst { context, selectors } = store;\n\tselectors.core.navigation.menuOpenedBy( store )[ menuClosedOn ] = false;\n\t// Check if the menu is still open or not.\n\tif ( ! selectors.core.navigation.isMenuOpen( store ) ) {\n\t\tif (\n\t\t\tcontext.core.navigation.modal?.contains(\n\t\t\t\twindow.document.activeElement\n\t\t\t)\n\t\t) {\n\t\t\tcontext.core.navigation.previousFocus?.focus();\n\t\t}\n\t\tcontext.core.navigation.modal = null;\n\t\tcontext.core.navigation.previousFocus = null;\n\t\tif ( context.core.navigation.type === 'overlay' ) {\n\t\t\tdocument.documentElement.classList.remove( 'has-modal-open' );\n\t\t}\n\t}\n};\n\nwpStore( {\n\teffects: {\n\t\tcore: {\n\t\t\tnavigation: {\n\t\t\t\tinitMenu: ( store ) => {\n\t\t\t\t\tconst { context, selectors, ref } = store;\n\t\t\t\t\tif ( selectors.core.navigation.isMenuOpen( store ) ) {\n\t\t\t\t\t\tconst focusableElements =\n\t\t\t\t\t\t\tref.querySelectorAll( focusableSelectors );\n\t\t\t\t\t\tcontext.core.navigation.modal = ref;\n\t\t\t\t\t\tcontext.core.navigation.firstFocusableElement =\n\t\t\t\t\t\t\tfocusableElements[ 0 ];\n\t\t\t\t\t\tcontext.core.navigation.lastFocusableElement =\n\t\t\t\t\t\t\tfocusableElements[ focusableElements.length - 1 ];\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\tfocusFirstElement: ( store ) => {\n\t\t\t\t\tconst { selectors, ref } = store;\n\t\t\t\t\tif ( selectors.core.navigation.isMenuOpen( store ) ) {\n\t\t\t\t\t\tref.querySelector(\n\t\t\t\t\t\t\t'.wp-block-navigation-item > *:first-child'\n\t\t\t\t\t\t).focus();\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t},\n\tselectors: {\n\t\tcore: {\n\t\t\tnavigation: {\n\t\t\t\troleAttribute: ( store ) => {\n\t\t\t\t\tconst { context, selectors } = store;\n\t\t\t\t\treturn context.core.navigation.type === 'overlay' &&\n\t\t\t\t\t\tselectors.core.navigation.isMenuOpen( store )\n\t\t\t\t\t\t? 'dialog'\n\t\t\t\t\t\t: null;\n\t\t\t\t},\n\t\t\t\tariaModal: ( store ) => {\n\t\t\t\t\tconst { context, selectors } = store;\n\t\t\t\t\treturn context.core.navigation.type === 'overlay' &&\n\t\t\t\t\t\tselectors.core.navigation.isMenuOpen( store )\n\t\t\t\t\t\t? 'true'\n\t\t\t\t\t\t: null;\n\t\t\t\t},\n\t\t\t\tariaLabel: ( store ) => {\n\t\t\t\t\tconst { context, selectors } = store;\n\t\t\t\t\treturn context.core.navigation.type === 'overlay' &&\n\t\t\t\t\t\tselectors.core.navigation.isMenuOpen( store )\n\t\t\t\t\t\t? context.core.navigation.ariaLabel\n\t\t\t\t\t\t: null;\n\t\t\t\t},\n\t\t\t\tisMenuOpen: ( { context } ) =>\n\t\t\t\t\t// The menu is opened if either `click`, `hover` or `focus` is true.\n\t\t\t\t\tObject.values(\n\t\t\t\t\t\tcontext.core.navigation[\n\t\t\t\t\t\t\tcontext.core.navigation.type === 'overlay'\n\t\t\t\t\t\t\t\t? 'overlayOpenedBy'\n\t\t\t\t\t\t\t\t: 'submenuOpenedBy'\n\t\t\t\t\t\t]\n\t\t\t\t\t).filter( Boolean ).length > 0,\n\t\t\t\tmenuOpenedBy: ( { context } ) =>\n\t\t\t\t\tcontext.core.navigation[\n\t\t\t\t\t\tcontext.core.navigation.type === 'overlay'\n\t\t\t\t\t\t\t? 'overlayOpenedBy'\n\t\t\t\t\t\t\t: 'submenuOpenedBy'\n\t\t\t\t\t],\n\t\t\t},\n\t\t},\n\t},\n\tactions: {\n\t\tcore: {\n\t\t\tnavigation: {\n\t\t\t\topenMenuOnHover( store ) {\n\t\t\t\t\tconst { navigation } = store.context.core;\n\t\t\t\t\tif (\n\t\t\t\t\t\tnavigation.type === 'submenu' &&\n\t\t\t\t\t\t// Only open on hover if the overlay is closed.\n\t\t\t\t\t\tObject.values(\n\t\t\t\t\t\t\tnavigation.overlayOpenedBy || {}\n\t\t\t\t\t\t).filter( Boolean ).length === 0\n\t\t\t\t\t)\n\t\t\t\t\t\topenMenu( store, 'hover' );\n\t\t\t\t},\n\t\t\t\tcloseMenuOnHover( store ) {\n\t\t\t\t\tcloseMenu( store, 'hover' );\n\t\t\t\t},\n\t\t\t\topenMenuOnClick( store ) {\n\t\t\t\t\tconst { context, ref } = store;\n\t\t\t\t\tcontext.core.navigation.previousFocus = ref;\n\t\t\t\t\topenMenu( store, 'click' );\n\t\t\t\t},\n\t\t\t\tcloseMenuOnClick( store ) {\n\t\t\t\t\tcloseMenu( store, 'click' );\n\t\t\t\t\tcloseMenu( store, 'focus' );\n\t\t\t\t},\n\t\t\t\topenMenuOnFocus( store ) {\n\t\t\t\t\topenMenu( store, 'focus' );\n\t\t\t\t},\n\t\t\t\ttoggleMenuOnClick: ( store ) => {\n\t\t\t\t\tconst { selectors, context, ref } = store;\n\t\t\t\t\t// Safari won't send focus to the clicked element, so we need to manually place it: https://bugs.webkit.org/show_bug.cgi?id=22261\n\t\t\t\t\tif ( window.document.activeElement !== ref ) ref.focus();\n\t\t\t\t\tconst menuOpenedBy =\n\t\t\t\t\t\tselectors.core.navigation.menuOpenedBy( store );\n\t\t\t\t\tif ( menuOpenedBy.click || menuOpenedBy.focus ) {\n\t\t\t\t\t\tcloseMenu( store, 'click' );\n\t\t\t\t\t\tcloseMenu( store, 'focus' );\n\t\t\t\t\t} else {\n\t\t\t\t\t\tcontext.core.navigation.previousFocus = ref;\n\t\t\t\t\t\topenMenu( store, 'click' );\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\thandleMenuKeydown: ( store ) => {\n\t\t\t\t\tconst { context, selectors, event } = store;\n\t\t\t\t\tif (\n\t\t\t\t\t\tselectors.core.navigation.menuOpenedBy( store ).click\n\t\t\t\t\t) {\n\t\t\t\t\t\t// If Escape close the menu.\n\t\t\t\t\t\tif ( event?.key === 'Escape' ) {\n\t\t\t\t\t\t\tcloseMenu( store, 'click' );\n\t\t\t\t\t\t\tcloseMenu( store, 'focus' );\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\t// Trap focus if it is an overlay (main menu).\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tcontext.core.navigation.type === 'overlay' &&\n\t\t\t\t\t\t\tevent.key === 'Tab'\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t// If shift + tab it change the direction.\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\tevent.shiftKey &&\n\t\t\t\t\t\t\t\twindow.document.activeElement ===\n\t\t\t\t\t\t\t\t\tcontext.core.navigation\n\t\t\t\t\t\t\t\t\t\t.firstFocusableElement\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\tcontext.core.navigation.lastFocusableElement.focus();\n\t\t\t\t\t\t\t} else if (\n\t\t\t\t\t\t\t\t! event.shiftKey &&\n\t\t\t\t\t\t\t\twindow.document.activeElement ===\n\t\t\t\t\t\t\t\t\tcontext.core.navigation.lastFocusableElement\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\tcontext.core.navigation.firstFocusableElement.focus();\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\thandleMenuFocusout: ( store ) => {\n\t\t\t\t\tconst { context, event } = store;\n\t\t\t\t\t// If focus is outside modal, and in the document, close menu\n\t\t\t\t\t// event.target === The element losing focus\n\t\t\t\t\t// event.relatedTarget === The element receiving focus (if any)\n\t\t\t\t\t// When focusout is outsite the document,\n\t\t\t\t\t// `window.document.activeElement` doesn't change.\n\n\t\t\t\t\t// The event.relatedTarget is null when something outside the navigation menu is clicked. This is only necessary for Safari.\n\t\t\t\t\tif (\n\t\t\t\t\t\tevent.relatedTarget === null ||\n\t\t\t\t\t\t( ! context.core.navigation.modal?.contains(\n\t\t\t\t\t\t\tevent.relatedTarget\n\t\t\t\t\t\t) &&\n\t\t\t\t\t\t\tevent.target !== window.document.activeElement )\n\t\t\t\t\t) {\n\t\t\t\t\t\tcloseMenu( store, 'click' );\n\t\t\t\t\t\tcloseMenu( store, 'focus' );\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t},\n} );\n"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wordpress/block-library",
3
- "version": "8.19.8",
3
+ "version": "8.19.9",
4
4
  "description": "Block library for the WordPress editor.",
5
5
  "author": "The WordPress Contributors",
6
6
  "license": "GPL-2.0-or-later",
@@ -31,36 +31,36 @@
31
31
  ],
32
32
  "dependencies": {
33
33
  "@babel/runtime": "^7.16.0",
34
- "@wordpress/a11y": "^3.42.8",
35
- "@wordpress/api-fetch": "^6.39.8",
36
- "@wordpress/autop": "^3.42.8",
37
- "@wordpress/blob": "^3.42.8",
38
- "@wordpress/block-editor": "^12.10.8",
39
- "@wordpress/blocks": "^12.19.8",
40
- "@wordpress/components": "^25.8.8",
41
- "@wordpress/compose": "^6.19.8",
42
- "@wordpress/core-data": "^6.19.8",
43
- "@wordpress/data": "^9.12.8",
44
- "@wordpress/date": "^4.42.8",
45
- "@wordpress/deprecated": "^3.42.8",
46
- "@wordpress/dom": "^3.42.8",
47
- "@wordpress/element": "^5.19.8",
48
- "@wordpress/escape-html": "^2.42.8",
49
- "@wordpress/hooks": "^3.42.8",
50
- "@wordpress/html-entities": "^3.42.8",
51
- "@wordpress/i18n": "^4.42.8",
52
- "@wordpress/icons": "^9.33.8",
53
- "@wordpress/interactivity": "^2.3.8",
54
- "@wordpress/keycodes": "^3.42.8",
55
- "@wordpress/notices": "^4.10.8",
56
- "@wordpress/primitives": "^3.40.8",
57
- "@wordpress/private-apis": "^0.24.8",
58
- "@wordpress/reusable-blocks": "^4.19.8",
59
- "@wordpress/rich-text": "^6.19.8",
60
- "@wordpress/server-side-render": "^4.19.8",
61
- "@wordpress/url": "^3.43.8",
62
- "@wordpress/viewport": "^5.19.8",
63
- "@wordpress/wordcount": "^3.42.8",
34
+ "@wordpress/a11y": "^3.42.9",
35
+ "@wordpress/api-fetch": "^6.39.9",
36
+ "@wordpress/autop": "^3.42.9",
37
+ "@wordpress/blob": "^3.42.9",
38
+ "@wordpress/block-editor": "^12.10.9",
39
+ "@wordpress/blocks": "^12.19.9",
40
+ "@wordpress/components": "^25.8.9",
41
+ "@wordpress/compose": "^6.19.9",
42
+ "@wordpress/core-data": "^6.19.9",
43
+ "@wordpress/data": "^9.12.9",
44
+ "@wordpress/date": "^4.42.9",
45
+ "@wordpress/deprecated": "^3.42.9",
46
+ "@wordpress/dom": "^3.42.9",
47
+ "@wordpress/element": "^5.19.9",
48
+ "@wordpress/escape-html": "^2.42.9",
49
+ "@wordpress/hooks": "^3.42.9",
50
+ "@wordpress/html-entities": "^3.42.9",
51
+ "@wordpress/i18n": "^4.42.9",
52
+ "@wordpress/icons": "^9.33.9",
53
+ "@wordpress/interactivity": "^2.3.9",
54
+ "@wordpress/keycodes": "^3.42.9",
55
+ "@wordpress/notices": "^4.10.9",
56
+ "@wordpress/primitives": "^3.40.9",
57
+ "@wordpress/private-apis": "^0.24.9",
58
+ "@wordpress/reusable-blocks": "^4.19.9",
59
+ "@wordpress/rich-text": "^6.19.9",
60
+ "@wordpress/server-side-render": "^4.19.9",
61
+ "@wordpress/url": "^3.43.9",
62
+ "@wordpress/viewport": "^5.19.9",
63
+ "@wordpress/wordcount": "^3.42.9",
64
64
  "change-case": "^4.1.2",
65
65
  "classnames": "^2.3.1",
66
66
  "colord": "^2.7.0",
@@ -78,5 +78,5 @@
78
78
  "publishConfig": {
79
79
  "access": "public"
80
80
  },
81
- "gitHead": "9ef7560ce92c4736819b5e767810b9a80d51d030"
81
+ "gitHead": "869f3c0fffbae25b9caff583ff534881bcba5be6"
82
82
  }
@@ -83,6 +83,11 @@ const scaleOptions = [
83
83
  },
84
84
  ];
85
85
 
86
+ const disabledClickProps = {
87
+ onClick: ( event ) => event.preventDefault(),
88
+ 'aria-disabled': true,
89
+ };
90
+
86
91
  export default function Image( {
87
92
  temporaryURL,
88
93
  attributes,
@@ -725,7 +730,6 @@ export default function Image( {
725
730
  }
726
731
  }
727
732
  /* eslint-enable no-lonely-if */
728
-
729
733
  img = (
730
734
  <ResizableBox
731
735
  style={ {
@@ -784,7 +788,14 @@ export default function Image( {
784
788
  { /* Hide controls during upload to avoid component remount,
785
789
  which causes duplicated image upload. */ }
786
790
  { ! temporaryURL && controls }
787
- { img }
791
+ { /* If the image has a href, wrap in an <a /> tag to trigger any inherited link element styles */ }
792
+ { !! href ? (
793
+ <a href={ href } { ...disabledClickProps }>
794
+ { img }
795
+ </a>
796
+ ) : (
797
+ img
798
+ ) }
788
799
  { showCaption &&
789
800
  ( ! RichText.isEmpty( caption ) || isSelected ) && (
790
801
  <RichText
@@ -235,6 +235,7 @@ function block_core_image_render_lightbox( $block_content, $block ) {
235
235
  $button =
236
236
  $img[0]
237
237
  . '<button
238
+ class="lightbox-trigger"
238
239
  type="button"
239
240
  aria-haspopup="dialog"
240
241
  aria-label="' . esc_attr( $aria_label ) . '"
@@ -243,11 +244,8 @@ function block_core_image_render_lightbox( $block_content, $block ) {
243
244
  data-wp-style--top="context.core.image.imageButtonTop"
244
245
  style="background: #000"
245
246
  >
246
- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
247
- <path d="M9 5H5V9" stroke="#FFFFFF" stroke-width="1.5"/>
248
- <path d="M15 19L19 19L19 15" stroke="#FFFFFF" stroke-width="1.5"/>
249
- <path d="M15 5H19V9" stroke="#FFFFFF" stroke-width="1.5"/>
250
- <path d="M9 19L5 19L5 15" stroke="#FFFFFF" stroke-width="1.5"/>
247
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" aria-hidden="true" focusable="false">
248
+ <Path stroke="#FFFFFF" d="M6 4a2 2 0 0 0-2 2v3h1.5V6a.5.5 0 0 1 .5-.5h3V4H6Zm3 14.5H6a.5.5 0 0 1-.5-.5v-3H4v3a2 2 0 0 0 2 2h3v-1.5Zm6 1.5v-1.5h3a.5.5 0 0 0 .5-.5v-3H20v3a2 2 0 0 1-2 2h-3Zm3-16a2 2 0 0 1 2 2v3h-1.5V6a.5.5 0 0 0-.5-.5h-3V4h3Z" />
251
249
  </svg>
252
250
  </button>';
253
251
 
@@ -322,12 +320,13 @@ function block_core_image_render_lightbox( $block_content, $block ) {
322
320
  data-wp-on--touchmove="actions.core.image.handleTouchMove"
323
321
  data-wp-on--touchend="actions.core.image.handleTouchEnd"
324
322
  data-wp-on--click="actions.core.image.hideLightbox"
323
+ tabindex="-1"
325
324
  >
326
325
  <button type="button" aria-label="$close_button_label" style="fill: $close_button_color" class="close-button" data-wp-on--click="actions.core.image.hideLightbox">
327
326
  $close_button_icon
328
327
  </button>
329
328
  <div class="lightbox-image-container">$initial_image_content</div>
330
- <div class="lightbox-image-container">$enlarged_image_content</div>
329
+ <div class="lightbox-image-container">$enlarged_image_content</div>
331
330
  <div class="scrim" style="background-color: $background_color" aria-hidden="true"></div>
332
331
  </div>
333
332
  HTML;
package/src/image/view.js CHANGED
@@ -135,7 +135,7 @@ store(
135
135
  false
136
136
  );
137
137
  },
138
- hideLightbox: async ( { context, event } ) => {
138
+ hideLightbox: async ( { context } ) => {
139
139
  context.core.image.hideAnimationEnabled = true;
140
140
  if ( context.core.image.lightboxEnabled ) {
141
141
  // We want to wait until the close animation is completed
@@ -149,19 +149,15 @@ store(
149
149
  'scroll',
150
150
  scrollCallback
151
151
  );
152
+ // If we don't delay before changing the focus,
153
+ // the focus ring will appear on Firefox before
154
+ // the image has finished animating, which looks broken.
155
+ context.core.image.lightboxTriggerRef.focus( {
156
+ preventScroll: true,
157
+ } );
152
158
  }, 450 );
153
159
 
154
160
  context.core.image.lightboxEnabled = false;
155
-
156
- // We want to avoid drawing attention to the button
157
- // after the lightbox closes for mouse and touch users.
158
- // Note that the `event.pointerType` property returns
159
- // as an empty string if a keyboard fired the event.
160
- if ( event.pointerType === '' ) {
161
- context.core.image.lastFocusedElement.focus( {
162
- preventScroll: true,
163
- } );
164
- }
165
161
  }
166
162
  },
167
163
  handleKeydown: ( { context, actions, event } ) => {
@@ -266,6 +262,10 @@ store(
266
262
  image: {
267
263
  initOriginImage: ( { context, ref } ) => {
268
264
  context.core.image.imageRef = ref;
265
+ context.core.image.lightboxTriggerRef =
266
+ ref.parentElement.querySelector(
267
+ '.lightbox-trigger'
268
+ );
269
269
  if ( ref.complete ) {
270
270
  context.core.image.imageLoaded = true;
271
271
  context.core.image.imageCurrentSrc = ref.currentSrc;
@@ -282,14 +282,8 @@ store(
282
282
  focusableElements.length - 1
283
283
  ];
284
284
 
285
- // We want to avoid drawing unnecessary attention to the close
286
- // button for mouse and touch users. Note that even if opening
287
- // the lightbox via keyboard, the event fired is of type
288
- // `pointerEvent`, so we need to rely on the `event.pointerType`
289
- // property, which returns an empty string for keyboard events.
290
- if ( context.core.image.pointerType === '' ) {
291
- ref.querySelector( '.close-button' ).focus();
292
- }
285
+ // Move focus to the dialog when opening it.
286
+ ref.focus();
293
287
  }
294
288
  },
295
289
  setButtonStyles: ( { context, ref } ) => {
@@ -90,6 +90,13 @@ function block_core_navigation_add_directives_to_submenu( $w, $block_attributes
90
90
  $w->set_attribute( 'data-wp-effect', 'effects.core.navigation.initMenu' );
91
91
  $w->set_attribute( 'data-wp-on--focusout', 'actions.core.navigation.handleMenuFocusout' );
92
92
  $w->set_attribute( 'data-wp-on--keydown', 'actions.core.navigation.handleMenuKeydown' );
93
+
94
+ // This is a fix for Safari. Without it, Safari doesn't change the active
95
+ // element when the user clicks on a button. It can be removed once we add
96
+ // an overlay to capture the clicks, instead of relying on the focusout
97
+ // event.
98
+ $w->set_attribute( 'tabindex', '-1' );
99
+
93
100
  if ( ! isset( $block_attributes['openSubmenusOnClick'] ) || false === $block_attributes['openSubmenusOnClick'] ) {
94
101
  $w->set_attribute( 'data-wp-on--mouseenter', 'actions.core.navigation.openMenuOnHover' );
95
102
  $w->set_attribute( 'data-wp-on--mouseleave', 'actions.core.navigation.closeMenuOnHover' );
@@ -13,10 +13,14 @@ const focusableSelectors = [
13
13
  '[tabindex]:not([tabindex^="-"])',
14
14
  ];
15
15
 
16
+ // This is a fix for Safari in iOS/iPadOS. Without it, Safari doesn't focus out
17
+ // when the user taps in the body. It can be removed once we add an overlay to
18
+ // capture the clicks, instead of relying on the focusout event.
19
+ document.addEventListener( 'click', () => {} );
20
+
16
21
  const openMenu = ( store, menuOpenedOn ) => {
17
- const { context, ref, selectors } = store;
22
+ const { context, selectors } = store;
18
23
  selectors.core.navigation.menuOpenedBy( store )[ menuOpenedOn ] = true;
19
- context.core.navigation.previousFocus = ref;
20
24
  if ( context.core.navigation.type === 'overlay' ) {
21
25
  // Add a `has-modal-open` class to the <html> root.
22
26
  document.documentElement.classList.add( 'has-modal-open' );
@@ -33,7 +37,7 @@ const closeMenu = ( store, menuClosedOn ) => {
33
37
  window.document.activeElement
34
38
  )
35
39
  ) {
36
- context.core.navigation.previousFocus.focus();
40
+ context.core.navigation.previousFocus?.focus();
37
41
  }
38
42
  context.core.navigation.modal = null;
39
43
  context.core.navigation.previousFocus = null;
@@ -130,6 +134,8 @@ wpStore( {
130
134
  closeMenu( store, 'hover' );
131
135
  },
132
136
  openMenuOnClick( store ) {
137
+ const { context, ref } = store;
138
+ context.core.navigation.previousFocus = ref;
133
139
  openMenu( store, 'click' );
134
140
  },
135
141
  closeMenuOnClick( store ) {
@@ -140,13 +146,16 @@ wpStore( {
140
146
  openMenu( store, 'focus' );
141
147
  },
142
148
  toggleMenuOnClick: ( store ) => {
143
- const { selectors } = store;
149
+ const { selectors, context, ref } = store;
150
+ // Safari won't send focus to the clicked element, so we need to manually place it: https://bugs.webkit.org/show_bug.cgi?id=22261
151
+ if ( window.document.activeElement !== ref ) ref.focus();
144
152
  const menuOpenedBy =
145
153
  selectors.core.navigation.menuOpenedBy( store );
146
154
  if ( menuOpenedBy.click || menuOpenedBy.focus ) {
147
155
  closeMenu( store, 'click' );
148
156
  closeMenu( store, 'focus' );
149
157
  } else {
158
+ context.core.navigation.previousFocus = ref;
150
159
  openMenu( store, 'click' );
151
160
  }
152
161
  },
@@ -194,11 +203,14 @@ wpStore( {
194
203
  // event.relatedTarget === The element receiving focus (if any)
195
204
  // When focusout is outsite the document,
196
205
  // `window.document.activeElement` doesn't change.
206
+
207
+ // The event.relatedTarget is null when something outside the navigation menu is clicked. This is only necessary for Safari.
197
208
  if (
198
- ! context.core.navigation.modal?.contains(
209
+ event.relatedTarget === null ||
210
+ ( ! context.core.navigation.modal?.contains(
199
211
  event.relatedTarget
200
212
  ) &&
201
- event.target !== window.document.activeElement
213
+ event.target !== window.document.activeElement )
202
214
  ) {
203
215
  closeMenu( store, 'click' );
204
216
  closeMenu( store, 'focus' );