wp/wp-includes/js/dist/compose.js
changeset 21 48c4eec2b7e6
parent 19 3d72ae0968f4
child 22 8c2e4d02f4ef
--- a/wp/wp-includes/js/dist/compose.js	Thu Sep 29 08:06:27 2022 +0200
+++ b/wp/wp-includes/js/dist/compose.js	Fri Sep 05 18:40:08 2025 +0200
@@ -1,11 +1,194 @@
-/******/ (function() { // webpackBootstrap
+/******/ (() => { // webpackBootstrap
 /******/ 	var __webpack_modules__ = ({
 
-/***/ 8294:
+/***/ 6689:
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   createUndoManager: () => (/* binding */ createUndoManager)
+/* harmony export */ });
+/* harmony import */ var _wordpress_is_shallow_equal__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(923);
+/* harmony import */ var _wordpress_is_shallow_equal__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_is_shallow_equal__WEBPACK_IMPORTED_MODULE_0__);
+/**
+ * WordPress dependencies
+ */
+
+
+/** @typedef {import('./types').HistoryRecord}  HistoryRecord */
+/** @typedef {import('./types').HistoryChange}  HistoryChange */
+/** @typedef {import('./types').HistoryChanges} HistoryChanges */
+/** @typedef {import('./types').UndoManager} UndoManager */
+
+/**
+ * Merge changes for a single item into a record of changes.
+ *
+ * @param {Record< string, HistoryChange >} changes1 Previous changes
+ * @param {Record< string, HistoryChange >} changes2 NextChanges
+ *
+ * @return {Record< string, HistoryChange >} Merged changes
+ */
+function mergeHistoryChanges(changes1, changes2) {
+  /**
+   * @type {Record< string, HistoryChange >}
+   */
+  const newChanges = {
+    ...changes1
+  };
+  Object.entries(changes2).forEach(([key, value]) => {
+    if (newChanges[key]) {
+      newChanges[key] = {
+        ...newChanges[key],
+        to: value.to
+      };
+    } else {
+      newChanges[key] = value;
+    }
+  });
+  return newChanges;
+}
+
+/**
+ * Adds history changes for a single item into a record of changes.
+ *
+ * @param {HistoryRecord}  record  The record to merge into.
+ * @param {HistoryChanges} changes The changes to merge.
+ */
+const addHistoryChangesIntoRecord = (record, changes) => {
+  const existingChangesIndex = record?.findIndex(({
+    id: recordIdentifier
+  }) => {
+    return typeof recordIdentifier === 'string' ? recordIdentifier === changes.id : _wordpress_is_shallow_equal__WEBPACK_IMPORTED_MODULE_0___default()(recordIdentifier, changes.id);
+  });
+  const nextRecord = [...record];
+  if (existingChangesIndex !== -1) {
+    // If the edit is already in the stack leave the initial "from" value.
+    nextRecord[existingChangesIndex] = {
+      id: changes.id,
+      changes: mergeHistoryChanges(nextRecord[existingChangesIndex].changes, changes.changes)
+    };
+  } else {
+    nextRecord.push(changes);
+  }
+  return nextRecord;
+};
+
+/**
+ * Creates an undo manager.
+ *
+ * @return {UndoManager} Undo manager.
+ */
+function createUndoManager() {
+  /**
+   * @type {HistoryRecord[]}
+   */
+  let history = [];
+  /**
+   * @type {HistoryRecord}
+   */
+  let stagedRecord = [];
+  /**
+   * @type {number}
+   */
+  let offset = 0;
+  const dropPendingRedos = () => {
+    history = history.slice(0, offset || undefined);
+    offset = 0;
+  };
+  const appendStagedRecordToLatestHistoryRecord = () => {
+    var _history$index;
+    const index = history.length === 0 ? 0 : history.length - 1;
+    let latestRecord = (_history$index = history[index]) !== null && _history$index !== void 0 ? _history$index : [];
+    stagedRecord.forEach(changes => {
+      latestRecord = addHistoryChangesIntoRecord(latestRecord, changes);
+    });
+    stagedRecord = [];
+    history[index] = latestRecord;
+  };
+
+  /**
+   * Checks whether a record is empty.
+   * A record is considered empty if it the changes keep the same values.
+   * Also updates to function values are ignored.
+   *
+   * @param {HistoryRecord} record
+   * @return {boolean} Whether the record is empty.
+   */
+  const isRecordEmpty = record => {
+    const filteredRecord = record.filter(({
+      changes
+    }) => {
+      return Object.values(changes).some(({
+        from,
+        to
+      }) => typeof from !== 'function' && typeof to !== 'function' && !_wordpress_is_shallow_equal__WEBPACK_IMPORTED_MODULE_0___default()(from, to));
+    });
+    return !filteredRecord.length;
+  };
+  return {
+    /**
+     * Record changes into the history.
+     *
+     * @param {HistoryRecord=} record   A record of changes to record.
+     * @param {boolean}        isStaged Whether to immediately create an undo point or not.
+     */
+    addRecord(record, isStaged = false) {
+      const isEmpty = !record || isRecordEmpty(record);
+      if (isStaged) {
+        if (isEmpty) {
+          return;
+        }
+        record.forEach(changes => {
+          stagedRecord = addHistoryChangesIntoRecord(stagedRecord, changes);
+        });
+      } else {
+        dropPendingRedos();
+        if (stagedRecord.length) {
+          appendStagedRecordToLatestHistoryRecord();
+        }
+        if (isEmpty) {
+          return;
+        }
+        history.push(record);
+      }
+    },
+    undo() {
+      if (stagedRecord.length) {
+        dropPendingRedos();
+        appendStagedRecordToLatestHistoryRecord();
+      }
+      const undoRecord = history[history.length - 1 + offset];
+      if (!undoRecord) {
+        return;
+      }
+      offset -= 1;
+      return undoRecord;
+    },
+    redo() {
+      const redoRecord = history[history.length + offset];
+      if (!redoRecord) {
+        return;
+      }
+      offset += 1;
+      return redoRecord;
+    },
+    hasUndo() {
+      return !!history[history.length - 1 + offset];
+    },
+    hasRedo() {
+      return !!history[history.length + offset];
+    }
+  };
+}
+
+
+/***/ }),
+
+/***/ 3758:
 /***/ (function(module) {
 
 /*!
- * clipboard.js v2.0.10
+ * clipboard.js v2.0.11
  * https://clipboardjs.com/
  *
  * Licensed MIT © Zeno Rocha
@@ -19,12 +202,12 @@
 /******/ 	var __webpack_modules__ = ({
 
 /***/ 686:
-/***/ (function(__unused_webpack_module, __webpack_exports__, __nested_webpack_require_623__) {
+/***/ (function(__unused_webpack_module, __nested_webpack_exports__, __nested_webpack_require_623__) {
 
 "use strict";
 
 // EXPORTS
-__nested_webpack_require_623__.d(__webpack_exports__, {
+__nested_webpack_require_623__.d(__nested_webpack_exports__, {
   "default": function() { return /* binding */ clipboard; }
 });
 
@@ -96,12 +279,28 @@
 
 
 /**
+ * Create fake copy action wrapper using a fake element.
+ * @param {String} target
+ * @param {Object} options
+ * @return {String}
+ */
+
+var fakeCopyAction = function fakeCopyAction(value, options) {
+  var fakeElement = createFakeElement(value);
+  options.container.appendChild(fakeElement);
+  var selectedText = select_default()(fakeElement);
+  command('copy');
+  fakeElement.remove();
+  return selectedText;
+};
+/**
  * Copy action wrapper.
  * @param {String|HTMLElement} target
  * @param {Object} options
  * @return {String}
  */
 
+
 var ClipboardActionCopy = function ClipboardActionCopy(target) {
   var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
     container: document.body
@@ -109,11 +308,10 @@
   var selectedText = '';
 
   if (typeof target === 'string') {
-    var fakeElement = createFakeElement(target);
-    options.container.appendChild(fakeElement);
-    selectedText = select_default()(fakeElement);
-    command('copy');
-    fakeElement.remove();
+    selectedText = fakeCopyAction(target, options);
+  } else if (target instanceof HTMLInputElement && !['text', 'search', 'url', 'tel', 'password'].includes(target === null || target === void 0 ? void 0 : target.type)) {
+    // If input type doesn't support `setSelectionRange`. Simulate it. https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setSelectionRange
+    selectedText = fakeCopyAction(target.value, options);
   } else {
     selectedText = select_default()(target);
     command('copy');
@@ -305,7 +503,6 @@
             trigger.focus();
           }
 
-          document.activeElement.blur();
           window.getSelection().removeAllRanges();
         }
       });
@@ -446,9 +643,9 @@
 /***/ }),
 
 /***/ 438:
-/***/ (function(module, __unused_webpack_exports, __nested_webpack_require_15133__) {
-
-var closest = __nested_webpack_require_15133__(828);
+/***/ (function(module, __unused_webpack_exports, __nested_webpack_require_15749__) {
+
+var closest = __nested_webpack_require_15749__(828);
 
 /**
  * Delegates event to a selector.
@@ -587,10 +784,10 @@
 /***/ }),
 
 /***/ 370:
-/***/ (function(module, __unused_webpack_exports, __nested_webpack_require_18497__) {
-
-var is = __nested_webpack_require_18497__(879);
-var delegate = __nested_webpack_require_18497__(438);
+/***/ (function(module, __unused_webpack_exports, __nested_webpack_require_19113__) {
+
+var is = __nested_webpack_require_19113__(879);
+var delegate = __nested_webpack_require_19113__(438);
 
 /**
  * Validates all params and calls the right
@@ -818,7 +1015,7 @@
 /******/ 	var __webpack_module_cache__ = {};
 /******/ 	
 /******/ 	// The require function
-/******/ 	function __nested_webpack_require_23879__(moduleId) {
+/******/ 	function __nested_webpack_require_24495__(moduleId) {
 /******/ 		// Check if module is in cache
 /******/ 		if(__webpack_module_cache__[moduleId]) {
 /******/ 			return __webpack_module_cache__[moduleId].exports;
@@ -831,7 +1028,7 @@
 /******/ 		};
 /******/ 	
 /******/ 		// Execute the module function
-/******/ 		__webpack_modules__[moduleId](module, module.exports, __nested_webpack_require_23879__);
+/******/ 		__webpack_modules__[moduleId](module, module.exports, __nested_webpack_require_24495__);
 /******/ 	
 /******/ 		// Return the exports of the module
 /******/ 		return module.exports;
@@ -841,11 +1038,11 @@
 /******/ 	/* webpack/runtime/compat get default export */
 /******/ 	!function() {
 /******/ 		// getDefaultExport function for compatibility with non-harmony modules
-/******/ 		__nested_webpack_require_23879__.n = function(module) {
+/******/ 		__nested_webpack_require_24495__.n = function(module) {
 /******/ 			var getter = module && module.__esModule ?
 /******/ 				function() { return module['default']; } :
 /******/ 				function() { return module; };
-/******/ 			__nested_webpack_require_23879__.d(getter, { a: getter });
+/******/ 			__nested_webpack_require_24495__.d(getter, { a: getter });
 /******/ 			return getter;
 /******/ 		};
 /******/ 	}();
@@ -853,9 +1050,9 @@
 /******/ 	/* webpack/runtime/define property getters */
 /******/ 	!function() {
 /******/ 		// define getter functions for harmony exports
-/******/ 		__nested_webpack_require_23879__.d = function(exports, definition) {
+/******/ 		__nested_webpack_require_24495__.d = function(exports, definition) {
 /******/ 			for(var key in definition) {
-/******/ 				if(__nested_webpack_require_23879__.o(definition, key) && !__nested_webpack_require_23879__.o(exports, key)) {
+/******/ 				if(__nested_webpack_require_24495__.o(definition, key) && !__nested_webpack_require_24495__.o(exports, key)) {
 /******/ 					Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
 /******/ 				}
 /******/ 			}
@@ -864,22 +1061,22 @@
 /******/ 	
 /******/ 	/* webpack/runtime/hasOwnProperty shorthand */
 /******/ 	!function() {
-/******/ 		__nested_webpack_require_23879__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }
+/******/ 		__nested_webpack_require_24495__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }
 /******/ 	}();
 /******/ 	
 /************************************************************************/
 /******/ 	// module exports must be returned from runtime so entry inlining is disabled
 /******/ 	// startup
 /******/ 	// Load entry module and return exports
-/******/ 	return __nested_webpack_require_23879__(686);
+/******/ 	return __nested_webpack_require_24495__(686);
 /******/ })()
 .default;
 });
 
 /***/ }),
 
-/***/ 7973:
-/***/ (function(module, exports, __webpack_require__) {
+/***/ 1933:
+/***/ ((module, exports, __webpack_require__) => {
 
 var __WEBPACK_AMD_DEFINE_RESULT__;/*global define:false */
 /**
@@ -1944,8 +2141,8 @@
 
 /***/ }),
 
-/***/ 5538:
-/***/ (function() {
+/***/ 5760:
+/***/ (() => {
 
 /**
  * adds a bindGlobal method to Mousetrap that allows you to
@@ -1997,19 +2194,11 @@
 
 /***/ }),
 
-/***/ 235:
-/***/ (function(module, __unused_webpack_exports, __webpack_require__) {
-
-var e=__webpack_require__(9196),n={display:"block",opacity:0,position:"absolute",top:0,left:0,height:"100%",width:"100%",overflow:"hidden",pointerEvents:"none",zIndex:-1},t=function(t){var r=t.onResize,u=e.useRef();return function(n,t){var r=function(){return n.current&&n.current.contentDocument&&n.current.contentDocument.defaultView};function u(){t();var e=r();e&&e.addEventListener("resize",t)}e.useEffect((function(){return r()?u():n.current&&n.current.addEventListener&&n.current.addEventListener("load",u),function(){var e=r();e&&"function"==typeof e.removeEventListener&&e.removeEventListener("resize",t)}}),[])}(u,(function(){return r(u)})),e.createElement("iframe",{style:n,src:"about:blank",ref:u,"aria-hidden":!0,tabIndex:-1,frameBorder:0})},r=function(e){return{width:null!=e?e.offsetWidth:null,height:null!=e?e.offsetHeight:null}};module.exports=function(n){void 0===n&&(n=r);var u=e.useState(n(null)),o=u[0],i=u[1],c=e.useCallback((function(e){return i(n(e.current))}),[n]);return[e.useMemo((function(){return e.createElement(t,{onResize:c})}),[c]),o]};
-
-
-/***/ }),
-
-/***/ 9196:
-/***/ (function(module) {
+/***/ 923:
+/***/ ((module) => {
 
 "use strict";
-module.exports = window["React"];
+module.exports = window["wp"]["isShallowEqual"];
 
 /***/ })
 
@@ -2041,144 +2230,1041 @@
 /******/ 	
 /************************************************************************/
 /******/ 	/* webpack/runtime/compat get default export */
-/******/ 	!function() {
+/******/ 	(() => {
 /******/ 		// getDefaultExport function for compatibility with non-harmony modules
-/******/ 		__webpack_require__.n = function(module) {
+/******/ 		__webpack_require__.n = (module) => {
 /******/ 			var getter = module && module.__esModule ?
-/******/ 				function() { return module['default']; } :
-/******/ 				function() { return module; };
+/******/ 				() => (module['default']) :
+/******/ 				() => (module);
 /******/ 			__webpack_require__.d(getter, { a: getter });
 /******/ 			return getter;
 /******/ 		};
-/******/ 	}();
+/******/ 	})();
 /******/ 	
 /******/ 	/* webpack/runtime/define property getters */
-/******/ 	!function() {
+/******/ 	(() => {
 /******/ 		// define getter functions for harmony exports
-/******/ 		__webpack_require__.d = function(exports, definition) {
+/******/ 		__webpack_require__.d = (exports, definition) => {
 /******/ 			for(var key in definition) {
 /******/ 				if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
 /******/ 					Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
 /******/ 				}
 /******/ 			}
 /******/ 		};
-/******/ 	}();
+/******/ 	})();
 /******/ 	
 /******/ 	/* webpack/runtime/hasOwnProperty shorthand */
-/******/ 	!function() {
-/******/ 		__webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }
-/******/ 	}();
+/******/ 	(() => {
+/******/ 		__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
+/******/ 	})();
 /******/ 	
 /******/ 	/* webpack/runtime/make namespace object */
-/******/ 	!function() {
+/******/ 	(() => {
 /******/ 		// define __esModule on exports
-/******/ 		__webpack_require__.r = function(exports) {
+/******/ 		__webpack_require__.r = (exports) => {
 /******/ 			if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
 /******/ 				Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 /******/ 			}
 /******/ 			Object.defineProperty(exports, '__esModule', { value: true });
 /******/ 		};
-/******/ 	}();
+/******/ 	})();
 /******/ 	
 /************************************************************************/
 var __webpack_exports__ = {};
 // This entry need to be wrapped in an IIFE because it need to be in strict mode.
-!function() {
+(() => {
 "use strict";
 // ESM COMPAT FLAG
 __webpack_require__.r(__webpack_exports__);
 
 // EXPORTS
 __webpack_require__.d(__webpack_exports__, {
-  "__experimentalUseDialog": function() { return /* reexport */ use_dialog; },
-  "__experimentalUseDisabled": function() { return /* reexport */ useDisabled; },
-  "__experimentalUseDragging": function() { return /* reexport */ useDragging; },
-  "__experimentalUseDropZone": function() { return /* reexport */ useDropZone; },
-  "__experimentalUseFixedWindowList": function() { return /* reexport */ useFixedWindowList; },
-  "__experimentalUseFocusOutside": function() { return /* reexport */ useFocusOutside; },
-  "compose": function() { return /* reexport */ compose; },
-  "createHigherOrderComponent": function() { return /* reexport */ create_higher_order_component; },
-  "ifCondition": function() { return /* reexport */ if_condition; },
-  "pure": function() { return /* reexport */ higher_order_pure; },
-  "useAsyncList": function() { return /* reexport */ use_async_list; },
-  "useConstrainedTabbing": function() { return /* reexport */ use_constrained_tabbing; },
-  "useCopyOnClick": function() { return /* reexport */ useCopyOnClick; },
-  "useCopyToClipboard": function() { return /* reexport */ useCopyToClipboard; },
-  "useDebounce": function() { return /* reexport */ useDebounce; },
-  "useFocusOnMount": function() { return /* reexport */ useFocusOnMount; },
-  "useFocusReturn": function() { return /* reexport */ use_focus_return; },
-  "useFocusableIframe": function() { return /* reexport */ useFocusableIframe; },
-  "useInstanceId": function() { return /* reexport */ useInstanceId; },
-  "useIsomorphicLayoutEffect": function() { return /* reexport */ use_isomorphic_layout_effect; },
-  "useKeyboardShortcut": function() { return /* reexport */ use_keyboard_shortcut; },
-  "useMediaQuery": function() { return /* reexport */ useMediaQuery; },
-  "useMergeRefs": function() { return /* reexport */ useMergeRefs; },
-  "usePrevious": function() { return /* reexport */ usePrevious; },
-  "useReducedMotion": function() { return /* reexport */ use_reduced_motion; },
-  "useRefEffect": function() { return /* reexport */ useRefEffect; },
-  "useResizeObserver": function() { return /* reexport */ use_resize_observer; },
-  "useThrottle": function() { return /* reexport */ useThrottle; },
-  "useViewportMatch": function() { return /* reexport */ use_viewport_match; },
-  "useWarnOnChange": function() { return /* reexport */ use_warn_on_change; },
-  "withGlobalEvents": function() { return /* reexport */ withGlobalEvents; },
-  "withInstanceId": function() { return /* reexport */ with_instance_id; },
-  "withSafeTimeout": function() { return /* reexport */ with_safe_timeout; },
-  "withState": function() { return /* reexport */ withState; }
+  __experimentalUseDialog: () => (/* reexport */ use_dialog),
+  __experimentalUseDragging: () => (/* reexport */ useDragging),
+  __experimentalUseDropZone: () => (/* reexport */ useDropZone),
+  __experimentalUseFixedWindowList: () => (/* reexport */ useFixedWindowList),
+  __experimentalUseFocusOutside: () => (/* reexport */ useFocusOutside),
+  compose: () => (/* reexport */ higher_order_compose),
+  createHigherOrderComponent: () => (/* reexport */ createHigherOrderComponent),
+  debounce: () => (/* reexport */ debounce),
+  ifCondition: () => (/* reexport */ if_condition),
+  observableMap: () => (/* reexport */ observableMap),
+  pipe: () => (/* reexport */ higher_order_pipe),
+  pure: () => (/* reexport */ higher_order_pure),
+  throttle: () => (/* reexport */ throttle),
+  useAsyncList: () => (/* reexport */ use_async_list),
+  useConstrainedTabbing: () => (/* reexport */ use_constrained_tabbing),
+  useCopyOnClick: () => (/* reexport */ useCopyOnClick),
+  useCopyToClipboard: () => (/* reexport */ useCopyToClipboard),
+  useDebounce: () => (/* reexport */ useDebounce),
+  useDebouncedInput: () => (/* reexport */ useDebouncedInput),
+  useDisabled: () => (/* reexport */ useDisabled),
+  useFocusOnMount: () => (/* reexport */ useFocusOnMount),
+  useFocusReturn: () => (/* reexport */ use_focus_return),
+  useFocusableIframe: () => (/* reexport */ useFocusableIframe),
+  useInstanceId: () => (/* reexport */ use_instance_id),
+  useIsomorphicLayoutEffect: () => (/* reexport */ use_isomorphic_layout_effect),
+  useKeyboardShortcut: () => (/* reexport */ use_keyboard_shortcut),
+  useMediaQuery: () => (/* reexport */ useMediaQuery),
+  useMergeRefs: () => (/* reexport */ useMergeRefs),
+  useObservableValue: () => (/* reexport */ useObservableValue),
+  usePrevious: () => (/* reexport */ usePrevious),
+  useReducedMotion: () => (/* reexport */ use_reduced_motion),
+  useRefEffect: () => (/* reexport */ useRefEffect),
+  useResizeObserver: () => (/* reexport */ useResizeAware),
+  useStateWithHistory: () => (/* reexport */ useStateWithHistory),
+  useThrottle: () => (/* reexport */ useThrottle),
+  useViewportMatch: () => (/* reexport */ use_viewport_match),
+  useWarnOnChange: () => (/* reexport */ use_warn_on_change),
+  withGlobalEvents: () => (/* reexport */ withGlobalEvents),
+  withInstanceId: () => (/* reexport */ with_instance_id),
+  withSafeTimeout: () => (/* reexport */ with_safe_timeout),
+  withState: () => (/* reexport */ withState)
+});
+
+;// CONCATENATED MODULE: ./node_modules/tslib/tslib.es6.mjs
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+/* global Reflect, Promise, SuppressedError, Symbol */
+
+var extendStatics = function(d, b) {
+  extendStatics = Object.setPrototypeOf ||
+      ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+      function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+  return extendStatics(d, b);
+};
+
+function __extends(d, b) {
+  if (typeof b !== "function" && b !== null)
+      throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+  extendStatics(d, b);
+  function __() { this.constructor = d; }
+  d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+}
+
+var __assign = function() {
+  __assign = Object.assign || function __assign(t) {
+      for (var s, i = 1, n = arguments.length; i < n; i++) {
+          s = arguments[i];
+          for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+      }
+      return t;
+  }
+  return __assign.apply(this, arguments);
+}
+
+function __rest(s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+      t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function")
+      for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+          if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+              t[p[i]] = s[p[i]];
+      }
+  return t;
+}
+
+function __decorate(decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+}
+
+function __param(paramIndex, decorator) {
+  return function (target, key) { decorator(target, key, paramIndex); }
+}
+
+function __esDecorate(ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
+  function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; }
+  var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
+  var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
+  var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
+  var _, done = false;
+  for (var i = decorators.length - 1; i >= 0; i--) {
+      var context = {};
+      for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
+      for (var p in contextIn.access) context.access[p] = contextIn.access[p];
+      context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
+      var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
+      if (kind === "accessor") {
+          if (result === void 0) continue;
+          if (result === null || typeof result !== "object") throw new TypeError("Object expected");
+          if (_ = accept(result.get)) descriptor.get = _;
+          if (_ = accept(result.set)) descriptor.set = _;
+          if (_ = accept(result.init)) initializers.unshift(_);
+      }
+      else if (_ = accept(result)) {
+          if (kind === "field") initializers.unshift(_);
+          else descriptor[key] = _;
+      }
+  }
+  if (target) Object.defineProperty(target, contextIn.name, descriptor);
+  done = true;
+};
+
+function __runInitializers(thisArg, initializers, value) {
+  var useValue = arguments.length > 2;
+  for (var i = 0; i < initializers.length; i++) {
+      value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
+  }
+  return useValue ? value : void 0;
+};
+
+function __propKey(x) {
+  return typeof x === "symbol" ? x : "".concat(x);
+};
+
+function __setFunctionName(f, name, prefix) {
+  if (typeof name === "symbol") name = name.description ? "[".concat(name.description, "]") : "";
+  return Object.defineProperty(f, "name", { configurable: true, value: prefix ? "".concat(prefix, " ", name) : name });
+};
+
+function __metadata(metadataKey, metadataValue) {
+  if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue);
+}
+
+function __awaiter(thisArg, _arguments, P, generator) {
+  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+  return new (P || (P = Promise))(function (resolve, reject) {
+      function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+      function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+      function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+      step((generator = generator.apply(thisArg, _arguments || [])).next());
+  });
+}
+
+function __generator(thisArg, body) {
+  var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+  return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+  function verb(n) { return function (v) { return step([n, v]); }; }
+  function step(op) {
+      if (f) throw new TypeError("Generator is already executing.");
+      while (g && (g = 0, op[0] && (_ = 0)), _) try {
+          if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+          if (y = 0, t) op = [op[0] & 2, t.value];
+          switch (op[0]) {
+              case 0: case 1: t = op; break;
+              case 4: _.label++; return { value: op[1], done: false };
+              case 5: _.label++; y = op[1]; op = [0]; continue;
+              case 7: op = _.ops.pop(); _.trys.pop(); continue;
+              default:
+                  if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                  if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                  if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                  if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                  if (t[2]) _.ops.pop();
+                  _.trys.pop(); continue;
+          }
+          op = body.call(thisArg, _);
+      } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+      if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+  }
+}
+
+var __createBinding = Object.create ? (function(o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  var desc = Object.getOwnPropertyDescriptor(m, k);
+  if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+  }
+  Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  o[k2] = m[k];
 });
 
-;// CONCATENATED MODULE: external "lodash"
-var external_lodash_namespaceObject = window["lodash"];
+function __exportStar(m, o) {
+  for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(o, p)) __createBinding(o, m, p);
+}
+
+function __values(o) {
+  var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
+  if (m) return m.call(o);
+  if (o && typeof o.length === "number") return {
+      next: function () {
+          if (o && i >= o.length) o = void 0;
+          return { value: o && o[i++], done: !o };
+      }
+  };
+  throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+}
+
+function __read(o, n) {
+  var m = typeof Symbol === "function" && o[Symbol.iterator];
+  if (!m) return o;
+  var i = m.call(o), r, ar = [], e;
+  try {
+      while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+  }
+  catch (error) { e = { error: error }; }
+  finally {
+      try {
+          if (r && !r.done && (m = i["return"])) m.call(i);
+      }
+      finally { if (e) throw e.error; }
+  }
+  return ar;
+}
+
+/** @deprecated */
+function __spread() {
+  for (var ar = [], i = 0; i < arguments.length; i++)
+      ar = ar.concat(__read(arguments[i]));
+  return ar;
+}
+
+/** @deprecated */
+function __spreadArrays() {
+  for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
+  for (var r = Array(s), k = 0, i = 0; i < il; i++)
+      for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
+          r[k] = a[j];
+  return r;
+}
+
+function __spreadArray(to, from, pack) {
+  if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+      if (ar || !(i in from)) {
+          if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+          ar[i] = from[i];
+      }
+  }
+  return to.concat(ar || Array.prototype.slice.call(from));
+}
+
+function __await(v) {
+  return this instanceof __await ? (this.v = v, this) : new __await(v);
+}
+
+function __asyncGenerator(thisArg, _arguments, generator) {
+  if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
+  var g = generator.apply(thisArg, _arguments || []), i, q = [];
+  return i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i;
+  function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }
+  function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }
+  function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }
+  function fulfill(value) { resume("next", value); }
+  function reject(value) { resume("throw", value); }
+  function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }
+}
+
+function __asyncDelegator(o) {
+  var i, p;
+  return i = {}, verb("next"), verb("throw", function (e) { throw e; }), verb("return"), i[Symbol.iterator] = function () { return this; }, i;
+  function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: false } : f ? f(v) : v; } : f; }
+}
+
+function __asyncValues(o) {
+  if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
+  var m = o[Symbol.asyncIterator], i;
+  return m ? m.call(o) : (o = typeof __values === "function" ? __values(o) : o[Symbol.iterator](), i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i);
+  function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }
+  function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }
+}
+
+function __makeTemplateObject(cooked, raw) {
+  if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+  return cooked;
+};
+
+var __setModuleDefault = Object.create ? (function(o, v) {
+  Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+  o["default"] = v;
+};
+
+function __importStar(mod) {
+  if (mod && mod.__esModule) return mod;
+  var result = {};
+  if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+  __setModuleDefault(result, mod);
+  return result;
+}
+
+function __importDefault(mod) {
+  return (mod && mod.__esModule) ? mod : { default: mod };
+}
+
+function __classPrivateFieldGet(receiver, state, kind, f) {
+  if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+  if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+  return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+}
+
+function __classPrivateFieldSet(receiver, state, value, kind, f) {
+  if (kind === "m") throw new TypeError("Private method is not writable");
+  if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a setter");
+  if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
+  return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
+}
+
+function __classPrivateFieldIn(state, receiver) {
+  if (receiver === null || (typeof receiver !== "object" && typeof receiver !== "function")) throw new TypeError("Cannot use 'in' operator on non-object");
+  return typeof state === "function" ? receiver === state : state.has(receiver);
+}
+
+function __addDisposableResource(env, value, async) {
+  if (value !== null && value !== void 0) {
+    if (typeof value !== "object" && typeof value !== "function") throw new TypeError("Object expected.");
+    var dispose;
+    if (async) {
+        if (!Symbol.asyncDispose) throw new TypeError("Symbol.asyncDispose is not defined.");
+        dispose = value[Symbol.asyncDispose];
+    }
+    if (dispose === void 0) {
+        if (!Symbol.dispose) throw new TypeError("Symbol.dispose is not defined.");
+        dispose = value[Symbol.dispose];
+    }
+    if (typeof dispose !== "function") throw new TypeError("Object not disposable.");
+    env.stack.push({ value: value, dispose: dispose, async: async });
+  }
+  else if (async) {
+    env.stack.push({ async: true });
+  }
+  return value;
+}
+
+var _SuppressedError = typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+  var e = new Error(message);
+  return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+};
+
+function __disposeResources(env) {
+  function fail(e) {
+    env.error = env.hasError ? new _SuppressedError(e, env.error, "An error was suppressed during disposal.") : e;
+    env.hasError = true;
+  }
+  function next() {
+    while (env.stack.length) {
+      var rec = env.stack.pop();
+      try {
+        var result = rec.dispose && rec.dispose.call(rec.value);
+        if (rec.async) return Promise.resolve(result).then(next, function(e) { fail(e); return next(); });
+      }
+      catch (e) {
+          fail(e);
+      }
+    }
+    if (env.hasError) throw env.error;
+  }
+  return next();
+}
+
+/* harmony default export */ const tslib_es6 = ({
+  __extends,
+  __assign,
+  __rest,
+  __decorate,
+  __param,
+  __metadata,
+  __awaiter,
+  __generator,
+  __createBinding,
+  __exportStar,
+  __values,
+  __read,
+  __spread,
+  __spreadArrays,
+  __spreadArray,
+  __await,
+  __asyncGenerator,
+  __asyncDelegator,
+  __asyncValues,
+  __makeTemplateObject,
+  __importStar,
+  __importDefault,
+  __classPrivateFieldGet,
+  __classPrivateFieldSet,
+  __classPrivateFieldIn,
+  __addDisposableResource,
+  __disposeResources,
+});
+
+;// CONCATENATED MODULE: ./node_modules/lower-case/dist.es2015/index.js
+/**
+ * Source: ftp://ftp.unicode.org/Public/UCD/latest/ucd/SpecialCasing.txt
+ */
+var SUPPORTED_LOCALE = {
+    tr: {
+        regexp: /\u0130|\u0049|\u0049\u0307/g,
+        map: {
+            İ: "\u0069",
+            I: "\u0131",
+            İ: "\u0069",
+        },
+    },
+    az: {
+        regexp: /\u0130/g,
+        map: {
+            İ: "\u0069",
+            I: "\u0131",
+            İ: "\u0069",
+        },
+    },
+    lt: {
+        regexp: /\u0049|\u004A|\u012E|\u00CC|\u00CD|\u0128/g,
+        map: {
+            I: "\u0069\u0307",
+            J: "\u006A\u0307",
+            Į: "\u012F\u0307",
+            Ì: "\u0069\u0307\u0300",
+            Í: "\u0069\u0307\u0301",
+            Ĩ: "\u0069\u0307\u0303",
+        },
+    },
+};
+/**
+ * Localized lower case.
+ */
+function localeLowerCase(str, locale) {
+    var lang = SUPPORTED_LOCALE[locale.toLowerCase()];
+    if (lang)
+        return lowerCase(str.replace(lang.regexp, function (m) { return lang.map[m]; }));
+    return lowerCase(str);
+}
+/**
+ * Lower case as a function.
+ */
+function lowerCase(str) {
+    return str.toLowerCase();
+}
+
+;// CONCATENATED MODULE: ./node_modules/no-case/dist.es2015/index.js
+
+// Support camel case ("camelCase" -> "camel Case" and "CAMELCase" -> "CAMEL Case").
+var DEFAULT_SPLIT_REGEXP = [/([a-z0-9])([A-Z])/g, /([A-Z])([A-Z][a-z])/g];
+// Remove all non-word characters.
+var DEFAULT_STRIP_REGEXP = /[^A-Z0-9]+/gi;
+/**
+ * Normalize the string into something other libraries can manipulate easier.
+ */
+function noCase(input, options) {
+    if (options === void 0) { options = {}; }
+    var _a = options.splitRegexp, splitRegexp = _a === void 0 ? DEFAULT_SPLIT_REGEXP : _a, _b = options.stripRegexp, stripRegexp = _b === void 0 ? DEFAULT_STRIP_REGEXP : _b, _c = options.transform, transform = _c === void 0 ? lowerCase : _c, _d = options.delimiter, delimiter = _d === void 0 ? " " : _d;
+    var result = replace(replace(input, splitRegexp, "$1\0$2"), stripRegexp, "\0");
+    var start = 0;
+    var end = result.length;
+    // Trim the delimiter from around the output string.
+    while (result.charAt(start) === "\0")
+        start++;
+    while (result.charAt(end - 1) === "\0")
+        end--;
+    // Transform each token independently.
+    return result.slice(start, end).split("\0").map(transform).join(delimiter);
+}
+/**
+ * Replace `re` in the input string with the replacement value.
+ */
+function replace(input, re, value) {
+    if (re instanceof RegExp)
+        return input.replace(re, value);
+    return re.reduce(function (input, re) { return input.replace(re, value); }, input);
+}
+
+;// CONCATENATED MODULE: ./node_modules/pascal-case/dist.es2015/index.js
+
+
+function pascalCaseTransform(input, index) {
+    var firstChar = input.charAt(0);
+    var lowerChars = input.substr(1).toLowerCase();
+    if (index > 0 && firstChar >= "0" && firstChar <= "9") {
+        return "_" + firstChar + lowerChars;
+    }
+    return "" + firstChar.toUpperCase() + lowerChars;
+}
+function pascalCaseTransformMerge(input) {
+    return input.charAt(0).toUpperCase() + input.slice(1).toLowerCase();
+}
+function pascalCase(input, options) {
+    if (options === void 0) { options = {}; }
+    return noCase(input, __assign({ delimiter: "", transform: pascalCaseTransform }, options));
+}
+
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/utils/create-higher-order-component/index.js
 /**
  * External dependencies
  */
 
-
 /**
  * Given a function mapping a component to an enhanced component and modifier
  * name, returns the enhanced component augmented with a generated displayName.
  *
- * @param  mapComponent Function mapping component to enhanced component.
- * @param  modifierName Seed name from which to generated display name.
+ * @param mapComponent Function mapping component to enhanced component.
+ * @param modifierName Seed name from which to generated display name.
  *
  * @return Component class with generated display name assigned.
  */
 function createHigherOrderComponent(mapComponent, modifierName) {
   return Inner => {
     const Outer = mapComponent(Inner);
-    const displayName = Inner.displayName || Inner.name || 'Component';
-    Outer.displayName = `${(0,external_lodash_namespaceObject.upperFirst)((0,external_lodash_namespaceObject.camelCase)(modifierName))}(${displayName})`;
+    Outer.displayName = hocName(modifierName, Inner);
     return Outer;
   };
 }
 
-/* harmony default export */ var create_higher_order_component = (createHigherOrderComponent);
+/**
+ * Returns a displayName for a higher-order component, given a wrapper name.
+ *
+ * @example
+ *     hocName( 'MyMemo', Widget ) === 'MyMemo(Widget)';
+ *     hocName( 'MyMemo', <div /> ) === 'MyMemo(Component)';
+ *
+ * @param name  Name assigned to higher-order component's wrapper component.
+ * @param Inner Wrapped component inside higher-order component.
+ * @return       Wrapped name of higher-order component.
+ */
+const hocName = (name, Inner) => {
+  const inner = Inner.displayName || Inner.name || 'Component';
+  const outer = pascalCase(name !== null && name !== void 0 ? name : '');
+  return `${outer}(${inner})`;
+};
+
+;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/utils/debounce/index.js
+/**
+ * Parts of this source were derived and modified from lodash,
+ * released under the MIT license.
+ *
+ * https://github.com/lodash/lodash
+ *
+ * Copyright JS Foundation and other contributors <https://js.foundation/>
+ *
+ * Based on Underscore.js, copyright Jeremy Ashkenas,
+ * DocumentCloud and Investigative Reporters & Editors <http://underscorejs.org/>
+ *
+ * This software consists of voluntary contributions made by many
+ * individuals. For exact contribution history, see the revision history
+ * available at https://github.com/lodash/lodash
+ *
+ * The following license applies to all parts of this software except as
+ * documented below:
+ *
+ * ====
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining
+ * a copy of this software and associated documentation files (the
+ * "Software"), to deal in the Software without restriction, including
+ * without limitation the rights to use, copy, modify, merge, publish,
+ * distribute, sublicense, and/or sell copies of the Software, and to
+ * permit persons to whom the Software is furnished to do so, subject to
+ * the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be
+ * included in all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+ * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+ * MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+ * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+ * LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+ * OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+ * WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ */
+
+/**
+ * A simplified and properly typed version of lodash's `debounce`, that
+ * always uses timers instead of sometimes using rAF.
+ *
+ * Creates a debounced function that delays invoking `func` until after `wait`
+ * milliseconds have elapsed since the last time the debounced function was
+ * invoked. The debounced function comes with a `cancel` method to cancel delayed
+ * `func` invocations and a `flush` method to immediately invoke them. Provide
+ * `options` to indicate whether `func` should be invoked on the leading and/or
+ * trailing edge of the `wait` timeout. The `func` is invoked with the last
+ * arguments provided to the debounced function. Subsequent calls to the debounced
+ * function return the result of the last `func` invocation.
+ *
+ * **Note:** If `leading` and `trailing` options are `true`, `func` is
+ * invoked on the trailing edge of the timeout only if the debounced function
+ * is invoked more than once during the `wait` timeout.
+ *
+ * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
+ * until the next tick, similar to `setTimeout` with a timeout of `0`.
+ *
+ * @param {Function}                   func             The function to debounce.
+ * @param {number}                     wait             The number of milliseconds to delay.
+ * @param {Partial< DebounceOptions >} options          The options object.
+ * @param {boolean}                    options.leading  Specify invoking on the leading edge of the timeout.
+ * @param {number}                     options.maxWait  The maximum time `func` is allowed to be delayed before it's invoked.
+ * @param {boolean}                    options.trailing Specify invoking on the trailing edge of the timeout.
+ *
+ * @return Returns the new debounced function.
+ */
+const debounce = (func, wait, options) => {
+  let lastArgs;
+  let lastThis;
+  let maxWait = 0;
+  let result;
+  let timerId;
+  let lastCallTime;
+  let lastInvokeTime = 0;
+  let leading = false;
+  let maxing = false;
+  let trailing = true;
+  if (options) {
+    leading = !!options.leading;
+    maxing = 'maxWait' in options;
+    if (options.maxWait !== undefined) {
+      maxWait = Math.max(options.maxWait, wait);
+    }
+    trailing = 'trailing' in options ? !!options.trailing : trailing;
+  }
+  function invokeFunc(time) {
+    const args = lastArgs;
+    const thisArg = lastThis;
+    lastArgs = undefined;
+    lastThis = undefined;
+    lastInvokeTime = time;
+    result = func.apply(thisArg, args);
+    return result;
+  }
+  function startTimer(pendingFunc, waitTime) {
+    timerId = setTimeout(pendingFunc, waitTime);
+  }
+  function cancelTimer() {
+    if (timerId !== undefined) {
+      clearTimeout(timerId);
+    }
+  }
+  function leadingEdge(time) {
+    // Reset any `maxWait` timer.
+    lastInvokeTime = time;
+    // Start the timer for the trailing edge.
+    startTimer(timerExpired, wait);
+    // Invoke the leading edge.
+    return leading ? invokeFunc(time) : result;
+  }
+  function getTimeSinceLastCall(time) {
+    return time - (lastCallTime || 0);
+  }
+  function remainingWait(time) {
+    const timeSinceLastCall = getTimeSinceLastCall(time);
+    const timeSinceLastInvoke = time - lastInvokeTime;
+    const timeWaiting = wait - timeSinceLastCall;
+    return maxing ? Math.min(timeWaiting, maxWait - timeSinceLastInvoke) : timeWaiting;
+  }
+  function shouldInvoke(time) {
+    const timeSinceLastCall = getTimeSinceLastCall(time);
+    const timeSinceLastInvoke = time - lastInvokeTime;
+
+    // Either this is the first call, activity has stopped and we're at the
+    // trailing edge, the system time has gone backwards and we're treating
+    // it as the trailing edge, or we've hit the `maxWait` limit.
+    return lastCallTime === undefined || timeSinceLastCall >= wait || timeSinceLastCall < 0 || maxing && timeSinceLastInvoke >= maxWait;
+  }
+  function timerExpired() {
+    const time = Date.now();
+    if (shouldInvoke(time)) {
+      return trailingEdge(time);
+    }
+    // Restart the timer.
+    startTimer(timerExpired, remainingWait(time));
+    return undefined;
+  }
+  function clearTimer() {
+    timerId = undefined;
+  }
+  function trailingEdge(time) {
+    clearTimer();
+
+    // Only invoke if we have `lastArgs` which means `func` has been
+    // debounced at least once.
+    if (trailing && lastArgs) {
+      return invokeFunc(time);
+    }
+    lastArgs = lastThis = undefined;
+    return result;
+  }
+  function cancel() {
+    cancelTimer();
+    lastInvokeTime = 0;
+    clearTimer();
+    lastArgs = lastCallTime = lastThis = undefined;
+  }
+  function flush() {
+    return pending() ? trailingEdge(Date.now()) : result;
+  }
+  function pending() {
+    return timerId !== undefined;
+  }
+  function debounced(...args) {
+    const time = Date.now();
+    const isInvoking = shouldInvoke(time);
+    lastArgs = args;
+    lastThis = this;
+    lastCallTime = time;
+    if (isInvoking) {
+      if (!pending()) {
+        return leadingEdge(lastCallTime);
+      }
+      if (maxing) {
+        // Handle invocations in a tight loop.
+        startTimer(timerExpired, wait);
+        return invokeFunc(lastCallTime);
+      }
+    }
+    if (!pending()) {
+      startTimer(timerExpired, wait);
+    }
+    return result;
+  }
+  debounced.cancel = cancel;
+  debounced.flush = flush;
+  debounced.pending = pending;
+  return debounced;
+};
+
+;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/utils/throttle/index.js
+/**
+ * Parts of this source were derived and modified from lodash,
+ * released under the MIT license.
+ *
+ * https://github.com/lodash/lodash
+ *
+ * Copyright JS Foundation and other contributors <https://js.foundation/>
+ *
+ * Based on Underscore.js, copyright Jeremy Ashkenas,
+ * DocumentCloud and Investigative Reporters & Editors <http://underscorejs.org/>
+ *
+ * This software consists of voluntary contributions made by many
+ * individuals. For exact contribution history, see the revision history
+ * available at https://github.com/lodash/lodash
+ *
+ * The following license applies to all parts of this software except as
+ * documented below:
+ *
+ * ====
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining
+ * a copy of this software and associated documentation files (the
+ * "Software"), to deal in the Software without restriction, including
+ * without limitation the rights to use, copy, modify, merge, publish,
+ * distribute, sublicense, and/or sell copies of the Software, and to
+ * permit persons to whom the Software is furnished to do so, subject to
+ * the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be
+ * included in all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+ * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+ * MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+ * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+ * LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+ * OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+ * WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ */
+
+/**
+ * Internal dependencies
+ */
+
+/**
+ * A simplified and properly typed version of lodash's `throttle`, that
+ * always uses timers instead of sometimes using rAF.
+ *
+ * Creates a throttled function that only invokes `func` at most once per
+ * every `wait` milliseconds. The throttled function comes with a `cancel`
+ * method to cancel delayed `func` invocations and a `flush` method to
+ * immediately invoke them. Provide `options` to indicate whether `func`
+ * should be invoked on the leading and/or trailing edge of the `wait`
+ * timeout. The `func` is invoked with the last arguments provided to the
+ * throttled function. Subsequent calls to the throttled function return
+ * the result of the last `func` invocation.
+ *
+ * **Note:** If `leading` and `trailing` options are `true`, `func` is
+ * invoked on the trailing edge of the timeout only if the throttled function
+ * is invoked more than once during the `wait` timeout.
+ *
+ * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
+ * until the next tick, similar to `setTimeout` with a timeout of `0`.
+ *
+ * @param {Function}                   func             The function to throttle.
+ * @param {number}                     wait             The number of milliseconds to throttle invocations to.
+ * @param {Partial< ThrottleOptions >} options          The options object.
+ * @param {boolean}                    options.leading  Specify invoking on the leading edge of the timeout.
+ * @param {boolean}                    options.trailing Specify invoking on the trailing edge of the timeout.
+ * @return Returns the new throttled function.
+ */
+const throttle = (func, wait, options) => {
+  let leading = true;
+  let trailing = true;
+  if (options) {
+    leading = 'leading' in options ? !!options.leading : leading;
+    trailing = 'trailing' in options ? !!options.trailing : trailing;
+  }
+  return debounce(func, wait, {
+    leading,
+    trailing,
+    maxWait: wait
+  });
+};
+
+;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/utils/observable-map/index.js
+/**
+ * A constructor (factory) for `ObservableMap`, a map-like key/value data structure
+ * where the individual entries are observable: using the `subscribe` method, you can
+ * subscribe to updates for a particular keys. Each subscriber always observes one
+ * specific key and is not notified about any unrelated changes (for different keys)
+ * in the `ObservableMap`.
+ *
+ * @template K The type of the keys in the map.
+ * @template V The type of the values in the map.
+ * @return   A new instance of the `ObservableMap` type.
+ */
+function observableMap() {
+  const map = new Map();
+  const listeners = new Map();
+  function callListeners(name) {
+    const list = listeners.get(name);
+    if (!list) {
+      return;
+    }
+    for (const listener of list) {
+      listener();
+    }
+  }
+  return {
+    get(name) {
+      return map.get(name);
+    },
+    set(name, value) {
+      map.set(name, value);
+      callListeners(name);
+    },
+    delete(name) {
+      map.delete(name);
+      callListeners(name);
+    },
+    subscribe(name, listener) {
+      let list = listeners.get(name);
+      if (!list) {
+        list = new Set();
+        listeners.set(name, list);
+      }
+      list.add(listener);
+      return () => {
+        list.delete(listener);
+        if (list.size === 0) {
+          listeners.delete(name);
+        }
+      };
+    }
+  };
+}
+
+;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/higher-order/pipe.js
+/**
+ * Parts of this source were derived and modified from lodash,
+ * released under the MIT license.
+ *
+ * https://github.com/lodash/lodash
+ *
+ * Copyright JS Foundation and other contributors <https://js.foundation/>
+ *
+ * Based on Underscore.js, copyright Jeremy Ashkenas,
+ * DocumentCloud and Investigative Reporters & Editors <http://underscorejs.org/>
+ *
+ * This software consists of voluntary contributions made by many
+ * individuals. For exact contribution history, see the revision history
+ * available at https://github.com/lodash/lodash
+ *
+ * The following license applies to all parts of this software except as
+ * documented below:
+ *
+ * ====
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining
+ * a copy of this software and associated documentation files (the
+ * "Software"), to deal in the Software without restriction, including
+ * without limitation the rights to use, copy, modify, merge, publish,
+ * distribute, sublicense, and/or sell copies of the Software, and to
+ * permit persons to whom the Software is furnished to do so, subject to
+ * the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be
+ * included in all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+ * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+ * MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+ * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+ * LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+ * OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+ * WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ */
+
+/**
+ * Creates a pipe function.
+ *
+ * Allows to choose whether to perform left-to-right or right-to-left composition.
+ *
+ * @see https://lodash.com/docs/4#flow
+ *
+ * @param {boolean} reverse True if right-to-left, false for left-to-right composition.
+ */
+const basePipe = (reverse = false) => (...funcs) => (...args) => {
+  const functions = funcs.flat();
+  if (reverse) {
+    functions.reverse();
+  }
+  return functions.reduce((prev, func) => [func(...prev)], args)[0];
+};
+
+/**
+ * Composes multiple higher-order components into a single higher-order component. Performs left-to-right function
+ * composition, where each successive invocation is supplied the return value of the previous.
+ *
+ * This is inspired by `lodash`'s `flow` function.
+ *
+ * @see https://lodash.com/docs/4#flow
+ */
+const pipe = basePipe();
+
+/* harmony default export */ const higher_order_pipe = (pipe);
 
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/higher-order/compose.js
 /**
+ * Internal dependencies
+ */
+
+
+/**
+ * Composes multiple higher-order components into a single higher-order component. Performs right-to-left function
+ * composition, where each successive invocation is supplied the return value of the previous.
+ *
+ * This is inspired by `lodash`'s `flowRight` function.
+ *
+ * @see https://lodash.com/docs/4#flow-right
+ */
+const compose = basePipe(true);
+/* harmony default export */ const higher_order_compose = (compose);
+
+;// CONCATENATED MODULE: external "ReactJSXRuntime"
+const external_ReactJSXRuntime_namespaceObject = window["ReactJSXRuntime"];
+;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/higher-order/if-condition/index.js
+/**
  * External dependencies
  */
 
 /**
- * Composes multiple higher-order components into a single higher-order component. Performs right-to-left function
- * composition, where each successive invocation is supplied the return value of the previous.
- *
- * This is just a re-export of `lodash`'s `flowRight` function.
- *
- * @see https://docs-lodash.com/v4/flow-right/
- */
-
-/* harmony default export */ var compose = (external_lodash_namespaceObject.flowRight);
-
-;// CONCATENATED MODULE: external ["wp","element"]
-var external_wp_element_namespaceObject = window["wp"]["element"];
-;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/higher-order/if-condition/index.js
-
-
-/**
  * Internal dependencies
  */
 
+
 /**
  * Higher-order component creator, creating a new component which renders if
  * the given condition is satisfied or with the given optional prop name.
@@ -2192,154 +3278,115 @@
  * <ConditionalComponent foo="bar" />; // => <div>bar</div>;
  * ```
  *
- * @param  predicate Function to test condition.
+ * @param predicate Function to test condition.
  *
  * @return Higher-order component.
  */
 
-const ifCondition = predicate => create_higher_order_component(WrappedComponent => props => {
-  if (!predicate(props)) {
-    return null;
-  }
-
-  return (0,external_wp_element_namespaceObject.createElement)(WrappedComponent, props);
-}, 'ifCondition');
-
-/* harmony default export */ var if_condition = (ifCondition);
-
-;// CONCATENATED MODULE: external ["wp","isShallowEqual"]
-var external_wp_isShallowEqual_namespaceObject = window["wp"]["isShallowEqual"];
-var external_wp_isShallowEqual_default = /*#__PURE__*/__webpack_require__.n(external_wp_isShallowEqual_namespaceObject);
+function ifCondition(predicate) {
+  return createHigherOrderComponent(WrappedComponent => props => {
+    if (!predicate(props)) {
+      return null;
+    }
+    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WrappedComponent, {
+      ...props
+    });
+  }, 'ifCondition');
+}
+/* harmony default export */ const if_condition = (ifCondition);
+
+// EXTERNAL MODULE: external ["wp","isShallowEqual"]
+var external_wp_isShallowEqual_ = __webpack_require__(923);
+var external_wp_isShallowEqual_default = /*#__PURE__*/__webpack_require__.n(external_wp_isShallowEqual_);
+;// CONCATENATED MODULE: external ["wp","element"]
+const external_wp_element_namespaceObject = window["wp"]["element"];
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/higher-order/pure/index.js
-
+/**
+ * External dependencies
+ */
 
 /**
  * WordPress dependencies
  */
 
 
+
 /**
  * Internal dependencies
  */
 
 
 /**
- * External dependencies
- */
-
-/**
  * Given a component returns the enhanced component augmented with a component
  * only re-rendering when its props/state change
+ *
+ * @deprecated Use `memo` or `PureComponent` instead.
  */
-const pure = create_higher_order_component(Wrapped => {
-  if (Wrapped.prototype instanceof external_wp_element_namespaceObject.Component) {
-    return class extends Wrapped {
+
+const pure = createHigherOrderComponent(function (WrappedComponent) {
+  if (WrappedComponent.prototype instanceof external_wp_element_namespaceObject.Component) {
+    return class extends WrappedComponent {
       shouldComponentUpdate(nextProps, nextState) {
         return !external_wp_isShallowEqual_default()(nextProps, this.props) || !external_wp_isShallowEqual_default()(nextState, this.state);
       }
-
     };
   }
-
   return class extends external_wp_element_namespaceObject.Component {
     shouldComponentUpdate(nextProps) {
       return !external_wp_isShallowEqual_default()(nextProps, this.props);
     }
-
     render() {
-      return (0,external_wp_element_namespaceObject.createElement)(Wrapped, this.props);
+      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WrappedComponent, {
+        ...this.props
+      });
     }
-
   };
 }, 'pure');
-/* harmony default export */ var higher_order_pure = (pure);
-
-;// CONCATENATED MODULE: ./node_modules/@babel/runtime/helpers/esm/extends.js
-function _extends() {
-  _extends = Object.assign ? Object.assign.bind() : function (target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-
-    return target;
-  };
-  return _extends.apply(this, arguments);
-}
+/* harmony default export */ const higher_order_pure = (pure);
+
 ;// CONCATENATED MODULE: external ["wp","deprecated"]
-var external_wp_deprecated_namespaceObject = window["wp"]["deprecated"];
+const external_wp_deprecated_namespaceObject = window["wp"]["deprecated"];
 var external_wp_deprecated_default = /*#__PURE__*/__webpack_require__.n(external_wp_deprecated_namespaceObject);
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/higher-order/with-global-events/listener.js
 /**
- * External dependencies
- */
-
-/**
  * Class responsible for orchestrating event handling on the global window,
  * binding a single event to be shared across all handling instances, and
  * removing the handler when no instances are listening for the event.
  */
-
 class Listener {
   constructor() {
     /** @type {any} */
     this.listeners = {};
     this.handleEvent = this.handleEvent.bind(this);
   }
-
-  add(
-  /** @type {any} */
-  eventType,
-  /** @type {any} */
-  instance) {
+  add( /** @type {any} */eventType, /** @type {any} */instance) {
     if (!this.listeners[eventType]) {
       // Adding first listener for this type, so bind event.
       window.addEventListener(eventType, this.handleEvent);
       this.listeners[eventType] = [];
     }
-
     this.listeners[eventType].push(instance);
   }
-
-  remove(
-  /** @type {any} */
-  eventType,
-  /** @type {any} */
-  instance) {
-    this.listeners[eventType] = (0,external_lodash_namespaceObject.without)(this.listeners[eventType], instance);
-
+  remove( /** @type {any} */eventType, /** @type {any} */instance) {
+    if (!this.listeners[eventType]) {
+      return;
+    }
+    this.listeners[eventType] = this.listeners[eventType].filter(( /** @type {any} */listener) => listener !== instance);
     if (!this.listeners[eventType].length) {
       // Removing last listener for this type, so unbind event.
       window.removeEventListener(eventType, this.handleEvent);
       delete this.listeners[eventType];
     }
   }
-
-  handleEvent(
-  /** @type {any} */
-  event) {
-    (0,external_lodash_namespaceObject.forEach)(this.listeners[event.type], instance => {
+  handleEvent( /** @type {any} */event) {
+    this.listeners[event.type]?.forEach(( /** @type {any} */instance) => {
       instance.handleEvent(event);
     });
   }
-
 }
-
-/* harmony default export */ var listener = (Listener);
+/* harmony default export */ const listener = (Listener);
 
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/higher-order/with-global-events/index.js
-
-
-
-/**
- * External dependencies
- */
-
 /**
  * WordPress dependencies
  */
@@ -2357,8 +3404,8 @@
  */
 
 const with_global_events_listener = new listener();
+
 /* eslint-disable jsdoc/no-undefined-types */
-
 /**
  * Higher-order component creator which, given an object of DOM event types and
  * values corresponding to a callback function name on the component, will
@@ -2378,71 +3425,57 @@
  *
  * @return {any} Higher-order component.
  */
-
 function withGlobalEvents(eventTypesToHandlers) {
   external_wp_deprecated_default()('wp.compose.withGlobalEvents', {
     since: '5.7',
     alternative: 'useEffect'
-  }); // @ts-ignore We don't need to fix the type-related issues because this is deprecated.
-
-  return create_higher_order_component(WrappedComponent => {
+  });
+
+  // @ts-ignore We don't need to fix the type-related issues because this is deprecated.
+  return createHigherOrderComponent(WrappedComponent => {
     class Wrapper extends external_wp_element_namespaceObject.Component {
-      constructor(
-      /** @type {any} */
-      props) {
+      constructor( /** @type {any} */props) {
         super(props);
         this.handleEvent = this.handleEvent.bind(this);
         this.handleRef = this.handleRef.bind(this);
       }
-
       componentDidMount() {
-        (0,external_lodash_namespaceObject.forEach)(eventTypesToHandlers, (_, eventType) => {
+        Object.keys(eventTypesToHandlers).forEach(eventType => {
           with_global_events_listener.add(eventType, this);
         });
       }
-
       componentWillUnmount() {
-        (0,external_lodash_namespaceObject.forEach)(eventTypesToHandlers, (_, eventType) => {
+        Object.keys(eventTypesToHandlers).forEach(eventType => {
           with_global_events_listener.remove(eventType, this);
         });
       }
-
-      handleEvent(
-      /** @type {any} */
-      event) {
-        const handler = eventTypesToHandlers[
-        /** @type {keyof GlobalEventHandlersEventMap} */
+      handleEvent( /** @type {any} */event) {
+        const handler = eventTypesToHandlers[( /** @type {keyof GlobalEventHandlersEventMap} */
         event.type
-        /* eslint-enable jsdoc/no-undefined-types */
-        ];
-
+
+        /* eslint-enable jsdoc/no-undefined-types */)];
         if (typeof this.wrappedRef[handler] === 'function') {
           this.wrappedRef[handler](event);
         }
       }
-
-      handleRef(
-      /** @type {any} */
-      el) {
-        this.wrappedRef = el; // Any component using `withGlobalEvents` that is not setting a `ref`
+      handleRef( /** @type {any} */el) {
+        this.wrappedRef = el;
+        // Any component using `withGlobalEvents` that is not setting a `ref`
         // will cause `this.props.forwardedRef` to be `null`, so we need this
         // check.
-
         if (this.props.forwardedRef) {
           this.props.forwardedRef(el);
         }
       }
-
       render() {
-        return (0,external_wp_element_namespaceObject.createElement)(WrappedComponent, _extends({}, this.props.ownProps, {
+        return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WrappedComponent, {
+          ...this.props.ownProps,
           ref: this.handleRef
-        }));
+        });
       }
-
     }
-
     return (0,external_wp_element_namespaceObject.forwardRef)((props, ref) => {
-      return (0,external_wp_element_namespaceObject.createElement)(Wrapper, {
+      return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(Wrapper, {
         ownProps: props,
         forwardedRef: ref
       });
@@ -2451,94 +3484,92 @@
 }
 
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-instance-id/index.js
-// Disable reason: Object and object are distinctly different types in TypeScript and we mean the lowercase object in thise case
-// but eslint wants to force us to use `Object`. See https://stackoverflow.com/questions/49464634/difference-between-object-and-object-in-typescript
-
-/* eslint-disable jsdoc/check-types */
-
 /**
  * WordPress dependencies
  */
 
-/**
- * @type {WeakMap<object, number>}
- */
-
 const instanceMap = new WeakMap();
+
 /**
  * Creates a new id for a given object.
  *
- * @param {object} object Object reference to create an id for.
- * @return {number} The instance id (index).
+ * @param object Object reference to create an id for.
+ * @return The instance id (index).
  */
-
 function createId(object) {
   const instances = instanceMap.get(object) || 0;
   instanceMap.set(object, instances + 1);
   return instances;
 }
+
+/**
+ * Specify the useInstanceId *function* signatures.
+ *
+ * More accurately, useInstanceId distinguishes between three different
+ * signatures:
+ *
+ * 1. When only object is given, the returned value is a number
+ * 2. When object and prefix is given, the returned value is a string
+ * 3. When preferredId is given, the returned value is the type of preferredId
+ *
+ * @param object Object reference to create an id for.
+ */
+
 /**
  * Provides a unique instance ID.
  *
- * @param {object}          object           Object reference to create an id for.
- * @param {string}          [prefix]         Prefix for the unique id.
- * @param {string | number} [preferredId=''] Default ID to use.
- * @return {string | number} The unique instance id.
+ * @param object        Object reference to create an id for.
+ * @param [prefix]      Prefix for the unique id.
+ * @param [preferredId] Default ID to use.
+ * @return The unique instance id.
  */
-
-
-function useInstanceId(object, prefix) {
-  let preferredId = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '';
+function useInstanceId(object, prefix, preferredId) {
   return (0,external_wp_element_namespaceObject.useMemo)(() => {
-    if (preferredId) return preferredId;
+    if (preferredId) {
+      return preferredId;
+    }
     const id = createId(object);
     return prefix ? `${prefix}-${id}` : id;
-  }, [object]);
+  }, [object, preferredId, prefix]);
 }
-/* eslint-enable jsdoc/check-types */
+/* harmony default export */ const use_instance_id = (useInstanceId);
 
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/higher-order/with-instance-id/index.js
-
-
-
 /**
  * Internal dependencies
  */
 
 
+
+
 /**
  * A Higher Order Component used to be provide a unique instance ID by
  * component.
  */
-
-const withInstanceId = create_higher_order_component(WrappedComponent => {
+const withInstanceId = createHigherOrderComponent(WrappedComponent => {
   return props => {
-    const instanceId = useInstanceId(WrappedComponent); // @ts-ignore
-
-    return (0,external_wp_element_namespaceObject.createElement)(WrappedComponent, _extends({}, props, {
+    const instanceId = use_instance_id(WrappedComponent);
+    // @ts-ignore
+    return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(WrappedComponent, {
+      ...props,
       instanceId: instanceId
-    }));
+    });
   };
-}, 'withInstanceId');
-/* harmony default export */ var with_instance_id = (withInstanceId);
+}, 'instanceId');
+/* harmony default export */ const with_instance_id = (withInstanceId);
 
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/higher-order/with-safe-timeout/index.js
-
-
 /**
- * External dependencies
+ * WordPress dependencies
  */
 
 
 /**
- * WordPress dependencies
- */
-
-/**
  * Internal dependencies
  */
 
 
+
 /**
  * We cannot use the `Window['setTimeout']` and `Window['clearTimeout']`
  * types here because those functions include functionality that is not handled
@@ -2552,7 +3583,7 @@
  * A higher-order component used to provide and manage delayed function calls
  * that ought to be bound to a component's lifecycle.
  */
-const withSafeTimeout = create_higher_order_component(OriginalComponent => {
+const withSafeTimeout = createHigherOrderComponent(OriginalComponent => {
   return class WrappedComponent extends external_wp_element_namespaceObject.Component {
     constructor(props) {
       super(props);
@@ -2560,11 +3591,9 @@
       this.setTimeout = this.setTimeout.bind(this);
       this.clearTimeout = this.clearTimeout.bind(this);
     }
-
     componentWillUnmount() {
       this.timeouts.forEach(clearTimeout);
     }
-
     setTimeout(fn, delay) {
       const id = setTimeout(() => {
         fn();
@@ -2573,33 +3602,32 @@
       this.timeouts.push(id);
       return id;
     }
-
     clearTimeout(id) {
       clearTimeout(id);
-      this.timeouts = (0,external_lodash_namespaceObject.without)(this.timeouts, id);
+      this.timeouts = this.timeouts.filter(timeoutId => timeoutId !== id);
     }
-
     render() {
-      const props = { ...this.props,
-        setTimeout: this.setTimeout,
-        clearTimeout: this.clearTimeout
-      };
-      return (0,external_wp_element_namespaceObject.createElement)(OriginalComponent, props);
+      return (
+        /*#__PURE__*/
+        // @ts-ignore
+        (0,external_ReactJSXRuntime_namespaceObject.jsx)(OriginalComponent, {
+          ...this.props,
+          setTimeout: this.setTimeout,
+          clearTimeout: this.clearTimeout
+        })
+      );
     }
-
   };
 }, 'withSafeTimeout');
-/* harmony default export */ var with_safe_timeout = (withSafeTimeout);
+/* harmony default export */ const with_safe_timeout = (withSafeTimeout);
 
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/higher-order/with-state/index.js
-
-
-
 /**
  * WordPress dependencies
  */
 
 
+
 /**
  * Internal dependencies
  */
@@ -2616,36 +3644,31 @@
  * @return {any} A higher order component wrapper accepting a component that takes the state props + its own props + `setState` and returning a component that only accepts the own props.
  */
 
-function withState() {
-  let initialState = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+function withState(initialState = {}) {
   external_wp_deprecated_default()('wp.compose.withState', {
     since: '5.8',
     alternative: 'wp.element.useState'
   });
-  return create_higher_order_component(OriginalComponent => {
+  return createHigherOrderComponent(OriginalComponent => {
     return class WrappedComponent extends external_wp_element_namespaceObject.Component {
-      constructor(
-      /** @type {any} */
-      props) {
+      constructor( /** @type {any} */props) {
         super(props);
         this.setState = this.setState.bind(this);
         this.state = initialState;
       }
-
       render() {
-        return (0,external_wp_element_namespaceObject.createElement)(OriginalComponent, _extends({}, this.props, this.state, {
+        return /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)(OriginalComponent, {
+          ...this.props,
+          ...this.state,
           setState: this.setState
-        }));
+        });
       }
-
     };
   }, 'withState');
 }
 
-;// CONCATENATED MODULE: external ["wp","keycodes"]
-var external_wp_keycodes_namespaceObject = window["wp"]["keycodes"];
 ;// CONCATENATED MODULE: external ["wp","dom"]
-var external_wp_dom_namespaceObject = window["wp"]["dom"];
+const external_wp_dom_namespaceObject = window["wp"]["dom"];
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-ref-effect/index.js
 /**
  * External dependencies
@@ -2655,6 +3678,7 @@
  * WordPress dependencies
  */
 
+
 /**
  * Effect-like ref callback. Just like with `useEffect`, this allows you to
  * return a cleanup function to be run if the ref changes or one of the
@@ -2669,12 +3693,11 @@
  * to be removed. It *is* necessary if you add dependencies because the ref
  * callback will be called multiple times for the same node.
  *
- * @param  callback     Callback with ref as argument.
- * @param  dependencies Dependencies of the callback.
+ * @param callback     Callback with ref as argument.
+ * @param dependencies Dependencies of the callback.
  *
  * @return Ref callback.
  */
-
 function useRefEffect(callback, dependencies) {
   const cleanup = (0,external_wp_element_namespaceObject.useRef)();
   return (0,external_wp_element_namespaceObject.useCallback)(node => {
@@ -2718,39 +3741,43 @@
  * }
  * ```
  */
-
 function useConstrainedTabbing() {
-  return useRefEffect((
-  /** @type {HTMLElement} */
-  node) => {
-    /** @type {number|undefined} */
-    let timeoutId;
-
-    function onKeyDown(
-    /** @type {KeyboardEvent} */
-    event) {
+  return useRefEffect(( /** @type {HTMLElement} */node) => {
+    function onKeyDown( /** @type {KeyboardEvent} */event) {
       const {
-        keyCode,
+        key,
         shiftKey,
         target
       } = event;
-
-      if (keyCode !== external_wp_keycodes_namespaceObject.TAB) {
+      if (key !== 'Tab') {
         return;
       }
-
       const action = shiftKey ? 'findPrevious' : 'findNext';
-      const nextElement = external_wp_dom_namespaceObject.focus.tabbable[action](
-      /** @type {HTMLElement} */
-      target) || null; // If the element that is about to receive focus is outside the
+      const nextElement = external_wp_dom_namespaceObject.focus.tabbable[action]( /** @type {HTMLElement} */target) || null;
+
+      // When the target element contains the element that is about to
+      // receive focus, for example when the target is a tabbable
+      // container, browsers may disagree on where to move focus next.
+      // In this case we can't rely on native browsers behavior. We need
+      // to manage focus instead.
+      // See https://github.com/WordPress/gutenberg/issues/46041.
+      if ( /** @type {HTMLElement} */target.contains(nextElement)) {
+        event.preventDefault();
+        nextElement?.focus();
+        return;
+      }
+
+      // If the element that is about to receive focus is inside the
+      // area, rely on native browsers behavior and let tabbing follow
+      // the native tab sequence.
+      if (node.contains(nextElement)) {
+        return;
+      }
+
+      // If the element that is about to receive focus is outside the
       // area, move focus to a div and insert it at the start or end of
       // the area, depending on the direction. Without preventing default
       // behaviour, the browser will then move focus to the next element.
-
-      if (node.contains(nextElement)) {
-        return;
-      }
-
       const domAction = shiftKey ? 'append' : 'prepend';
       const {
         ownerDocument
@@ -2758,29 +3785,28 @@
       const trap = ownerDocument.createElement('div');
       trap.tabIndex = -1;
       node[domAction](trap);
-      trap.focus(); // Remove after the browser moves focus to the next element.
-
-      timeoutId = setTimeout(() => node.removeChild(trap));
+
+      // Remove itself when the trap loses focus.
+      trap.addEventListener('blur', () => node.removeChild(trap));
+      trap.focus();
     }
-
     node.addEventListener('keydown', onKeyDown);
     return () => {
       node.removeEventListener('keydown', onKeyDown);
-      clearTimeout(timeoutId);
     };
   }, []);
 }
-
-/* harmony default export */ var use_constrained_tabbing = (useConstrainedTabbing);
+/* harmony default export */ const use_constrained_tabbing = (useConstrainedTabbing);
 
 // EXTERNAL MODULE: ./node_modules/clipboard/dist/clipboard.js
-var dist_clipboard = __webpack_require__(8294);
+var dist_clipboard = __webpack_require__(3758);
 var clipboard_default = /*#__PURE__*/__webpack_require__.n(dist_clipboard);
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-copy-on-click/index.js
 /**
  * External dependencies
  */
 
+
 /**
  * WordPress dependencies
  */
@@ -2788,7 +3814,6 @@
 
 
 /* eslint-disable jsdoc/no-undefined-types */
-
 /**
  * Copies the text to the clipboard when the element is clicked.
  *
@@ -2802,46 +3827,40 @@
  * @return {boolean} Whether or not the text has been copied. Resets after the
  *                   timeout.
  */
-
-function useCopyOnClick(ref, text) {
-  let timeout = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 4000;
-
+function useCopyOnClick(ref, text, timeout = 4000) {
   /* eslint-enable jsdoc/no-undefined-types */
   external_wp_deprecated_default()('wp.compose.useCopyOnClick', {
     since: '5.8',
     alternative: 'wp.compose.useCopyToClipboard'
   });
+
   /** @type {import('react').MutableRefObject<Clipboard | undefined>} */
-
   const clipboard = (0,external_wp_element_namespaceObject.useRef)();
   const [hasCopied, setHasCopied] = (0,external_wp_element_namespaceObject.useState)(false);
   (0,external_wp_element_namespaceObject.useEffect)(() => {
     /** @type {number | undefined} */
     let timeoutId;
-
     if (!ref.current) {
       return;
-    } // Clipboard listens to click events.
-
-
+    }
+
+    // Clipboard listens to click events.
     clipboard.current = new (clipboard_default())(ref.current, {
       text: () => typeof text === 'function' ? text() : text
     });
-    clipboard.current.on('success', _ref => {
-      let {
-        clearSelection,
-        trigger
-      } = _ref;
+    clipboard.current.on('success', ({
+      clearSelection,
+      trigger
+    }) => {
       // Clearing selection will move focus back to the triggering button,
       // ensuring that it is not reset to the body, and further that it is
       // kept within the rendered node.
-      clearSelection(); // Handle ClipboardJS focus bug, see https://github.com/zenorocha/clipboard.js/issues/680
-
+      clearSelection();
+
+      // Handle ClipboardJS focus bug, see https://github.com/zenorocha/clipboard.js/issues/680
       if (trigger) {
-        /** @type {HTMLElement} */
-        trigger.focus();
+        /** @type {HTMLElement} */trigger.focus();
       }
-
       if (timeout) {
         setHasCopied(true);
         clearTimeout(timeoutId);
@@ -2852,7 +3871,6 @@
       if (clipboard.current) {
         clipboard.current.destroy();
       }
-
       clearTimeout(timeoutId);
     };
   }, [text, timeout, setHasCopied]);
@@ -2864,6 +3882,7 @@
  * External dependencies
  */
 
+
 /**
  * WordPress dependencies
  */
@@ -2879,12 +3898,12 @@
  * @param {T} value
  * @return {import('react').RefObject<T>} The updated ref
  */
-
 function useUpdatedRef(value) {
   const ref = (0,external_wp_element_namespaceObject.useRef)(value);
   ref.current = value;
   return ref;
 }
+
 /**
  * Copies the given text to the clipboard when the element is clicked.
  *
@@ -2895,10 +3914,8 @@
  *
  * @return {import('react').Ref<TElementType>} A ref to assign to the target element.
  */
-
-
 function useCopyToClipboard(text, onSuccess) {
-  // Store the dependencies as refs and continuesly update them so they're
+  // Store the dependencies as refs and continuously update them so they're
   // fresh when the callback is called.
   const textRef = useUpdatedRef(text);
   const onSuccessRef = useUpdatedRef(onSuccess);
@@ -2908,20 +3925,14 @@
       text() {
         return typeof textRef.current === 'function' ? textRef.current() : textRef.current || '';
       }
-
     });
-    clipboard.on('success', _ref => {
-      let {
-        clearSelection
-      } = _ref;
+    clipboard.on('success', ({
+      clearSelection
+    }) => {
       // Clearing selection will move focus back to the triggering
       // button, ensuring that it is not reset to the body, and
       // further that it is kept within the rendered node.
-      clearSelection(); // Handle ClipboardJS focus bug, see
-      // https://github.com/zenorocha/clipboard.js/issues/680
-
-      node.focus();
-
+      clearSelection();
       if (onSuccessRef.current) {
         onSuccessRef.current();
       }
@@ -2932,12 +3943,20 @@
   }, []);
 }
 
+;// CONCATENATED MODULE: external ["wp","keycodes"]
+const external_wp_keycodes_namespaceObject = window["wp"]["keycodes"];
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-focus-on-mount/index.js
 /**
  * WordPress dependencies
  */
 
 
+
+/**
+ * Internal dependencies
+ */
+
+
 /**
  * Hook used to focus the first tabbable element on mount.
  *
@@ -2959,37 +3978,52 @@
  * }
  * ```
  */
-
-function useFocusOnMount() {
-  let focusOnMount = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'firstElement';
+function useFocusOnMount(focusOnMount = 'firstElement') {
   const focusOnMountRef = (0,external_wp_element_namespaceObject.useRef)(focusOnMount);
+
+  /**
+   * Sets focus on a DOM element.
+   *
+   * @param {HTMLElement} target The DOM element to set focus to.
+   * @return {void}
+   */
+  const setFocus = target => {
+    target.focus({
+      // When focusing newly mounted dialogs,
+      // the position of the popover is often not right on the first render
+      // This prevents the layout shifts when focusing the dialogs.
+      preventScroll: true
+    });
+  };
+
+  /** @type {import('react').MutableRefObject<ReturnType<setTimeout> | undefined>} */
+  const timerId = (0,external_wp_element_namespaceObject.useRef)();
   (0,external_wp_element_namespaceObject.useEffect)(() => {
     focusOnMountRef.current = focusOnMount;
   }, [focusOnMount]);
-  return (0,external_wp_element_namespaceObject.useCallback)(node => {
-    var _node$ownerDocument$a, _node$ownerDocument;
-
+  return useRefEffect(node => {
+    var _node$ownerDocument$a;
     if (!node || focusOnMountRef.current === false) {
       return;
     }
-
-    if (node.contains((_node$ownerDocument$a = (_node$ownerDocument = node.ownerDocument) === null || _node$ownerDocument === void 0 ? void 0 : _node$ownerDocument.activeElement) !== null && _node$ownerDocument$a !== void 0 ? _node$ownerDocument$a : null)) {
+    if (node.contains((_node$ownerDocument$a = node.ownerDocument?.activeElement) !== null && _node$ownerDocument$a !== void 0 ? _node$ownerDocument$a : null)) {
       return;
     }
-
-    let target = node;
-
     if (focusOnMountRef.current === 'firstElement') {
-      const firstTabbable = external_wp_dom_namespaceObject.focus.tabbable.find(node)[0];
-
-      if (firstTabbable) {
-        target =
-        /** @type {HTMLElement} */
-        firstTabbable;
+      timerId.current = setTimeout(() => {
+        const firstTabbable = external_wp_dom_namespaceObject.focus.tabbable.find(node)[0];
+        if (firstTabbable) {
+          setFocus(firstTabbable);
+        }
+      }, 0);
+      return;
+    }
+    setFocus(node);
+    return () => {
+      if (timerId.current) {
+        clearTimeout(timerId.current);
       }
-    }
-
-    target.focus();
+    };
   }, []);
 }
 
@@ -2998,11 +4032,13 @@
  * WordPress dependencies
  */
 
+
+/** @type {Element|null} */
+let origin = null;
+
 /**
- * When opening modals/sidebars/dialogs, the focus
- * must move to the opened area and return to the
- * previously focused element when closed.
- * The current hook implements the returning behavior.
+ * Adds the unmount behavior of returning focus to the element which had it
+ * previously as is expected for roles like menus or dialogs.
  *
  * @param {() => void} [onFocusReturn] Overrides the default return behavior.
  * @return {import('react').RefCallback<HTMLElement>} Element Ref.
@@ -3022,12 +4058,10 @@
  * }
  * ```
  */
-
 function useFocusReturn(onFocusReturn) {
   /** @type {import('react').MutableRefObject<null | HTMLElement>} */
   const ref = (0,external_wp_element_namespaceObject.useRef)(null);
   /** @type {import('react').MutableRefObject<null | Element>} */
-
   const focusedBeforeMount = (0,external_wp_element_namespaceObject.useRef)(null);
   const onFocusReturnRef = (0,external_wp_element_namespaceObject.useRef)(onFocusReturn);
   (0,external_wp_element_namespaceObject.useEffect)(() => {
@@ -3036,46 +4070,38 @@
   return (0,external_wp_element_namespaceObject.useCallback)(node => {
     if (node) {
       // Set ref to be used when unmounting.
-      ref.current = node; // Only set when the node mounts.
-
+      ref.current = node;
+
+      // Only set when the node mounts.
       if (focusedBeforeMount.current) {
         return;
       }
-
       focusedBeforeMount.current = node.ownerDocument.activeElement;
     } else if (focusedBeforeMount.current) {
-      var _ref$current, _ref$current2, _ref$current3;
-
-      const isFocused = (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.contains((_ref$current2 = ref.current) === null || _ref$current2 === void 0 ? void 0 : _ref$current2.ownerDocument.activeElement);
-
-      if ((_ref$current3 = ref.current) !== null && _ref$current3 !== void 0 && _ref$current3.isConnected && !isFocused) {
+      const isFocused = ref.current?.contains(ref.current?.ownerDocument.activeElement);
+      if (ref.current?.isConnected && !isFocused) {
+        var _origin;
+        (_origin = origin) !== null && _origin !== void 0 ? _origin : origin = focusedBeforeMount.current;
         return;
-      } // Defer to the component's own explicit focus return behavior, if
+      }
+
+      // Defer to the component's own explicit focus return behavior, if
       // specified. This allows for support that the `onFocusReturn`
       // decides to allow the default behavior to occur under some
       // conditions.
-
-
       if (onFocusReturnRef.current) {
         onFocusReturnRef.current();
       } else {
-        var _focusedBeforeMount$c;
-
-        /** @type {null | HTMLElement} */
-        (_focusedBeforeMount$c = focusedBeforeMount.current) === null || _focusedBeforeMount$c === void 0 ? void 0 : _focusedBeforeMount$c.focus();
+        /** @type {null|HTMLElement} */(!focusedBeforeMount.current.isConnected ? origin : focusedBeforeMount.current)?.focus();
       }
+      origin = null;
     }
   }, []);
 }
-
-/* harmony default export */ var use_focus_return = (useFocusReturn);
+/* harmony default export */ const use_focus_return = (useFocusReturn);
 
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-focus-outside/index.js
 /**
- * External dependencies
- */
-
-/**
  * WordPress dependencies
  */
 
@@ -3083,17 +4109,14 @@
 /**
  * Input types which are classified as button types, for use in considering
  * whether element is a (focus-normalized) button.
- *
- * @type {string[]}
  */
-
 const INPUT_BUTTON_TYPES = ['button', 'submit'];
+
 /**
- * @typedef {HTMLButtonElement | HTMLLinkElement | HTMLInputElement} FocusNormalizedButton
+ * List of HTML button elements subject to focus normalization
+ *
+ * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus
  */
-// Disable reason: Rule doesn't support predicate return types.
-
-/* eslint-disable jsdoc/valid-types */
 
 /**
  * Returns true if the given element is a button element subject to focus
@@ -3101,100 +4124,60 @@
  *
  * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus
  *
- * @param {EventTarget} eventTarget The target from a mouse or touch event.
+ * @param eventTarget The target from a mouse or touch event.
  *
- * @return {eventTarget is FocusNormalizedButton} Whether element is a button.
+ * @return Whether the element is a button element subject to focus normalization.
  */
-
 function isFocusNormalizedButton(eventTarget) {
   if (!(eventTarget instanceof window.HTMLElement)) {
     return false;
   }
-
   switch (eventTarget.nodeName) {
     case 'A':
     case 'BUTTON':
       return true;
-
     case 'INPUT':
-      return (0,external_lodash_namespaceObject.includes)(INPUT_BUTTON_TYPES,
-      /** @type {HTMLInputElement} */
-      eventTarget.type);
+      return INPUT_BUTTON_TYPES.includes(eventTarget.type);
   }
-
   return false;
 }
-/* eslint-enable jsdoc/valid-types */
-
-/**
- * @typedef {import('react').SyntheticEvent} SyntheticEvent
- */
-
-/**
- * @callback EventCallback
- * @param {SyntheticEvent} event input related event.
- */
-
-/**
- * @typedef FocusOutsideReactElement
- * @property {EventCallback} handleFocusOutside callback for a focus outside event.
- */
-
-/**
- * @typedef {import('react').MutableRefObject<FocusOutsideReactElement | undefined>} FocusOutsideRef
- */
-
-/**
- * @typedef {Object} FocusOutsideReturnValue
- * @property {EventCallback} onFocus      An event handler for focus events.
- * @property {EventCallback} onBlur       An event handler for blur events.
- * @property {EventCallback} onMouseDown  An event handler for mouse down events.
- * @property {EventCallback} onMouseUp    An event handler for mouse up events.
- * @property {EventCallback} onTouchStart An event handler for touch start events.
- * @property {EventCallback} onTouchEnd   An event handler for touch end events.
- */
-
 /**
  * A react hook that can be used to check whether focus has moved outside the
  * element the event handlers are bound to.
  *
- * @param {EventCallback} onFocusOutside A callback triggered when focus moves outside
- *                                       the element the event handlers are bound to.
+ * @param onFocusOutside A callback triggered when focus moves outside
+ *                       the element the event handlers are bound to.
  *
- * @return {FocusOutsideReturnValue} An object containing event handlers. Bind the event handlers
- *                                   to a wrapping element element to capture when focus moves
- *                                   outside that element.
+ * @return An object containing event handlers. Bind the event handlers to a
+ * wrapping element element to capture when focus moves outside that element.
  */
-
-
 function useFocusOutside(onFocusOutside) {
   const currentOnFocusOutside = (0,external_wp_element_namespaceObject.useRef)(onFocusOutside);
   (0,external_wp_element_namespaceObject.useEffect)(() => {
     currentOnFocusOutside.current = onFocusOutside;
   }, [onFocusOutside]);
   const preventBlurCheck = (0,external_wp_element_namespaceObject.useRef)(false);
-  /**
-   * @type {import('react').MutableRefObject<number | undefined>}
-   */
-
   const blurCheckTimeoutId = (0,external_wp_element_namespaceObject.useRef)();
+
   /**
    * Cancel a blur check timeout.
    */
-
   const cancelBlurCheck = (0,external_wp_element_namespaceObject.useCallback)(() => {
     clearTimeout(blurCheckTimeoutId.current);
-  }, []); // Cancel blur checks on unmount.
-
+  }, []);
+
+  // Cancel blur checks on unmount.
   (0,external_wp_element_namespaceObject.useEffect)(() => {
     return () => cancelBlurCheck();
-  }, []); // Cancel a blur check if the callback or ref is no longer provided.
-
+  }, []);
+
+  // Cancel a blur check if the callback or ref is no longer provided.
   (0,external_wp_element_namespaceObject.useEffect)(() => {
     if (!onFocusOutside) {
       cancelBlurCheck();
     }
   }, [onFocusOutside, cancelBlurCheck]);
+
   /**
    * Handles a mousedown or mouseup event to respectively assign and
    * unassign a flag for preventing blur check on button elements. Some
@@ -3202,43 +4185,50 @@
    * button elements when clicked, while others do. The logic here
    * intends to normalize this as treating click on buttons as focus.
    *
+   * @param event
    * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus
-   *
-   * @param {SyntheticEvent} event Event for mousedown or mouseup.
    */
-
   const normalizeButtonFocus = (0,external_wp_element_namespaceObject.useCallback)(event => {
     const {
       type,
       target
     } = event;
-    const isInteractionEnd = (0,external_lodash_namespaceObject.includes)(['mouseup', 'touchend'], type);
-
+    const isInteractionEnd = ['mouseup', 'touchend'].includes(type);
     if (isInteractionEnd) {
       preventBlurCheck.current = false;
     } else if (isFocusNormalizedButton(target)) {
       preventBlurCheck.current = true;
     }
   }, []);
+
   /**
    * A callback triggered when a blur event occurs on the element the handler
    * is bound to.
    *
    * Calls the `onFocusOutside` callback in an immediate timeout if focus has
    * move outside the bound element and is still within the document.
-   *
-   * @param {SyntheticEvent} event Blur event.
    */
-
   const queueBlurCheck = (0,external_wp_element_namespaceObject.useCallback)(event => {
     // React does not allow using an event reference asynchronously
     // due to recycling behavior, except when explicitly persisted.
-    event.persist(); // Skip blur check if clicking button. See `normalizeButtonFocus`.
-
+    event.persist();
+
+    // Skip blur check if clicking button. See `normalizeButtonFocus`.
     if (preventBlurCheck.current) {
       return;
     }
 
+    // The usage of this attribute should be avoided. The only use case
+    // would be when we load modals that are not React components and
+    // therefore don't exist in the React tree. An example is opening
+    // the Media Library modal from another dialog.
+    // This attribute should contain a selector of the related target
+    // we want to ignore, because we still need to trigger the blur event
+    // on all other cases.
+    const ignoreForRelatedTarget = event.target.getAttribute('data-unstable-ignore-focus-outside-for-relatedtarget');
+    if (ignoreForRelatedTarget && event.relatedTarget?.closest(ignoreForRelatedTarget)) {
+      return;
+    }
     blurCheckTimeoutId.current = setTimeout(() => {
       // If document is not focused then focus should remain
       // inside the wrapped component and therefore we cancel
@@ -3248,7 +4238,6 @@
         event.preventDefault();
         return;
       }
-
       if ('function' === typeof currentOnFocusOutside.current) {
         currentOnFocusOutside.current(event);
       }
@@ -3269,13 +4258,12 @@
  * WordPress dependencies
  */
 
+
 /* eslint-disable jsdoc/valid-types */
-
 /**
  * @template T
  * @typedef {T extends import('react').Ref<infer R> ? R : never} TypeFromRef
  */
-
 /* eslint-enable jsdoc/valid-types */
 
 /**
@@ -3283,18 +4271,16 @@
  * @param {import('react').Ref<T>} ref
  * @param {T}                      value
  */
-
 function assignRef(ref, value) {
   if (typeof ref === 'function') {
     ref(value);
   } else if (ref && ref.hasOwnProperty('current')) {
     /* eslint-disable jsdoc/no-undefined-types */
-
-    /** @type {import('react').MutableRefObject<T>} */
-    ref.current = value;
+    /** @type {import('react').MutableRefObject<T>} */ref.current = value;
     /* eslint-enable jsdoc/no-undefined-types */
   }
 }
+
 /**
  * Merges refs into one ref callback.
  *
@@ -3338,55 +4324,56 @@
  *
  * @return {import('react').RefCallback<TypeFromRef<TRef>>} The merged ref callback.
  */
-
-
 function useMergeRefs(refs) {
   const element = (0,external_wp_element_namespaceObject.useRef)();
+  const isAttached = (0,external_wp_element_namespaceObject.useRef)(false);
   const didElementChange = (0,external_wp_element_namespaceObject.useRef)(false);
   /* eslint-disable jsdoc/no-undefined-types */
-
   /** @type {import('react').MutableRefObject<TRef[]>} */
-
   /* eslint-enable jsdoc/no-undefined-types */
-
   const previousRefs = (0,external_wp_element_namespaceObject.useRef)([]);
-  const currentRefs = (0,external_wp_element_namespaceObject.useRef)(refs); // Update on render before the ref callback is called, so the ref callback
+  const currentRefs = (0,external_wp_element_namespaceObject.useRef)(refs);
+
+  // Update on render before the ref callback is called, so the ref callback
   // always has access to the current refs.
-
-  currentRefs.current = refs; // If any of the refs change, call the previous ref with `null` and the new
+  currentRefs.current = refs;
+
+  // If any of the refs change, call the previous ref with `null` and the new
   // ref with the node, except when the element changes in the same cycle, in
   // which case the ref callbacks will already have been called.
-
   (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
-    if (didElementChange.current === false) {
+    if (didElementChange.current === false && isAttached.current === true) {
       refs.forEach((ref, index) => {
         const previousRef = previousRefs.current[index];
-
         if (ref !== previousRef) {
           assignRef(previousRef, null);
           assignRef(ref, element.current);
         }
       });
     }
-
     previousRefs.current = refs;
-  }, refs); // No dependencies, must be reset after every render so ref callbacks are
+  }, refs);
+
+  // No dependencies, must be reset after every render so ref callbacks are
   // correctly called after a ref change.
-
   (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
     didElementChange.current = false;
-  }); // There should be no dependencies so that `callback` is only called when
+  });
+
+  // There should be no dependencies so that `callback` is only called when
   // the node changes.
-
   return (0,external_wp_element_namespaceObject.useCallback)(value => {
     // Update the element so it can be used when calling ref callbacks on a
     // dependency change.
     assignRef(element, value);
-    didElementChange.current = true; // When an element changes, the current ref callback should be called
+    didElementChange.current = true;
+    isAttached.current = value !== null;
+
+    // When an element changes, the current ref callback should be called
     // with the new element and the previous one with `null`.
-
-    const refsToAssign = value ? currentRefs.current : previousRefs.current; // Update the latest refs.
-
+    const refsToAssign = value ? currentRefs.current : previousRefs.current;
+
+    // Update the latest refs.
     for (const ref of refsToAssign) {
       assignRef(ref, value);
     }
@@ -3395,89 +4382,6 @@
 
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-dialog/index.js
 /**
- * WordPress dependencies
- */
-
-
-/**
- * Internal dependencies
- */
-
-
-
-
-
-
-/* eslint-disable jsdoc/valid-types */
-
-/**
- * @typedef DialogOptions
- * @property {Parameters<useFocusOnMount>[0]} focusOnMount Focus on mount arguments.
- * @property {() => void}                     onClose      Function to call when the dialog is closed.
- */
-
-/* eslint-enable jsdoc/valid-types */
-
-/**
- * Returns a ref and props to apply to a dialog wrapper to enable the following behaviors:
- *  - constrained tabbing.
- *  - focus on mount.
- *  - return focus on unmount.
- *  - focus outside.
- *
- * @param {DialogOptions} options Dialog Options.
- */
-
-function useDialog(options) {
-  /**
-   * @type {import('react').MutableRefObject<DialogOptions | undefined>}
-   */
-  const currentOptions = (0,external_wp_element_namespaceObject.useRef)();
-  (0,external_wp_element_namespaceObject.useEffect)(() => {
-    currentOptions.current = options;
-  }, Object.values(options));
-  const constrainedTabbingRef = use_constrained_tabbing();
-  const focusOnMountRef = useFocusOnMount(options.focusOnMount);
-  const focusReturnRef = use_focus_return();
-  const focusOutsideProps = useFocusOutside(event => {
-    var _currentOptions$curre, _currentOptions$curre2;
-
-    // This unstable prop  is here only to manage backward compatibility
-    // for the Popover component otherwise, the onClose should be enough.
-    // @ts-ignore unstable property
-    if ((_currentOptions$curre = currentOptions.current) !== null && _currentOptions$curre !== void 0 && _currentOptions$curre.__unstableOnClose) {
-      // @ts-ignore unstable property
-      currentOptions.current.__unstableOnClose('focus-outside', event);
-    } else if ((_currentOptions$curre2 = currentOptions.current) !== null && _currentOptions$curre2 !== void 0 && _currentOptions$curre2.onClose) {
-      currentOptions.current.onClose();
-    }
-  });
-  const closeOnEscapeRef = (0,external_wp_element_namespaceObject.useCallback)(node => {
-    if (!node) {
-      return;
-    }
-
-    node.addEventListener('keydown', (
-    /** @type {KeyboardEvent} */
-    event) => {
-      var _currentOptions$curre3;
-
-      // Close on escape.
-      if (event.keyCode === external_wp_keycodes_namespaceObject.ESCAPE && !event.defaultPrevented && (_currentOptions$curre3 = currentOptions.current) !== null && _currentOptions$curre3 !== void 0 && _currentOptions$curre3.onClose) {
-        event.preventDefault();
-        currentOptions.current.onClose();
-      }
-    });
-  }, []);
-  return [useMergeRefs([options.focusOnMount !== false ? constrainedTabbingRef : null, options.focusOnMount !== false ? focusReturnRef : null, options.focusOnMount !== false ? focusOnMountRef : null, closeOnEscapeRef]), { ...focusOutsideProps,
-    tabIndex: '-1'
-  }];
-}
-
-/* harmony default export */ var use_dialog = (useDialog);
-
-;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-disabled/index.js
-/**
  * External dependencies
  */
 
@@ -3488,26 +4392,83 @@
 
 
 /**
- * Names of control nodes which qualify for disabled behavior.
- *
- * See WHATWG HTML Standard: 4.10.18.5: "Enabling and disabling form controls: the disabled attribute".
+ * Internal dependencies
+ */
+
+
+
+
+
+/**
+ * Returns a ref and props to apply to a dialog wrapper to enable the following behaviors:
+ *  - constrained tabbing.
+ *  - focus on mount.
+ *  - return focus on unmount.
+ *  - focus outside.
  *
- * @see https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#enabling-and-disabling-form-controls:-the-disabled-attribute
- *
- * @type {string[]}
+ * @param options Dialog Options.
  */
-
-const DISABLED_ELIGIBLE_NODE_NAMES = ['BUTTON', 'FIELDSET', 'INPUT', 'OPTGROUP', 'OPTION', 'SELECT', 'TEXTAREA'];
+function useDialog(options) {
+  const currentOptions = (0,external_wp_element_namespaceObject.useRef)();
+  const {
+    constrainTabbing = options.focusOnMount !== false
+  } = options;
+  (0,external_wp_element_namespaceObject.useEffect)(() => {
+    currentOptions.current = options;
+  }, Object.values(options));
+  const constrainedTabbingRef = use_constrained_tabbing();
+  const focusOnMountRef = useFocusOnMount(options.focusOnMount);
+  const focusReturnRef = use_focus_return();
+  const focusOutsideProps = useFocusOutside(event => {
+    // This unstable prop  is here only to manage backward compatibility
+    // for the Popover component otherwise, the onClose should be enough.
+    if (currentOptions.current?.__unstableOnClose) {
+      currentOptions.current.__unstableOnClose('focus-outside', event);
+    } else if (currentOptions.current?.onClose) {
+      currentOptions.current.onClose();
+    }
+  });
+  const closeOnEscapeRef = (0,external_wp_element_namespaceObject.useCallback)(node => {
+    if (!node) {
+      return;
+    }
+    node.addEventListener('keydown', event => {
+      // Close on escape.
+      if (event.keyCode === external_wp_keycodes_namespaceObject.ESCAPE && !event.defaultPrevented && currentOptions.current?.onClose) {
+        event.preventDefault();
+        currentOptions.current.onClose();
+      }
+    });
+  }, []);
+  return [useMergeRefs([constrainTabbing ? constrainedTabbingRef : null, options.focusOnMount !== false ? focusReturnRef : null, options.focusOnMount !== false ? focusOnMountRef : null, closeOnEscapeRef]), {
+    ...focusOutsideProps,
+    tabIndex: -1
+  }];
+}
+/* harmony default export */ const use_dialog = (useDialog);
+
+;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-disabled/index.js
+/**
+ * Internal dependencies
+ */
+
+
+
 /**
  * In some circumstances, such as block previews, all focusable DOM elements
  * (input fields, links, buttons, etc.) need to be disabled. This hook adds the
  * behavior to disable nested DOM elements to the returned ref.
  *
- * @return {import('react').RefObject<HTMLElement>} Element Ref.
+ * If you can, prefer the use of the inert HTML attribute.
+ *
+ * @param {Object}   config            Configuration object.
+ * @param {boolean=} config.isDisabled Whether the element should be disabled.
+ * @return {import('react').RefCallback<HTMLElement>} Element Ref.
  *
  * @example
  * ```js
- * import { __experimentalUseDisabled as useDisabled } from '@wordpress/compose';
+ * import { useDisabled } from '@wordpress/compose';
+ *
  * const DisabledExample = () => {
  * 	const disabledRef = useDisabled();
  *	return (
@@ -3519,66 +4480,54 @@
  * };
  * ```
  */
-
-function useDisabled() {
-  /** @type {import('react').RefObject<HTMLElement>} */
-  const node = (0,external_wp_element_namespaceObject.useRef)(null);
-
-  const disable = () => {
-    if (!node.current) {
+function useDisabled({
+  isDisabled: isDisabledProp = false
+} = {}) {
+  return useRefEffect(node => {
+    if (isDisabledProp) {
+      return;
+    }
+    const defaultView = node?.ownerDocument?.defaultView;
+    if (!defaultView) {
       return;
     }
 
-    external_wp_dom_namespaceObject.focus.focusable.find(node.current).forEach(focusable => {
-      if ((0,external_lodash_namespaceObject.includes)(DISABLED_ELIGIBLE_NODE_NAMES, focusable.nodeName)) {
-        focusable.setAttribute('disabled', '');
-      }
-
-      if (focusable.nodeName === 'A') {
-        focusable.setAttribute('tabindex', '-1');
-      }
-
-      const tabIndex = focusable.getAttribute('tabindex');
-
-      if (tabIndex !== null && tabIndex !== '-1') {
-        focusable.removeAttribute('tabindex');
-      }
-
-      if (focusable.hasAttribute('contenteditable')) {
-        focusable.setAttribute('contenteditable', 'false');
-      }
+    /** A variable keeping track of the previous updates in order to restore them. */
+    const updates = [];
+    const disable = () => {
+      node.childNodes.forEach(child => {
+        if (!(child instanceof defaultView.HTMLElement)) {
+          return;
+        }
+        if (!child.getAttribute('inert')) {
+          child.setAttribute('inert', 'true');
+          updates.push(() => {
+            child.removeAttribute('inert');
+          });
+        }
+      });
+    };
+
+    // Debounce re-disable since disabling process itself will incur
+    // additional mutations which should be ignored.
+    const debouncedDisable = debounce(disable, 0, {
+      leading: true
     });
-  }; // Debounce re-disable since disabling process itself will incur
-  // additional mutations which should be ignored.
-
-
-  const debouncedDisable = (0,external_wp_element_namespaceObject.useCallback)((0,external_lodash_namespaceObject.debounce)(disable, undefined, {
-    leading: true
-  }), []);
-  (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
     disable();
+
     /** @type {MutationObserver | undefined} */
-
-    let observer;
-
-    if (node.current) {
-      observer = new window.MutationObserver(debouncedDisable);
-      observer.observe(node.current, {
-        childList: true,
-        attributes: true,
-        subtree: true
-      });
-    }
-
+    const observer = new window.MutationObserver(debouncedDisable);
+    observer.observe(node, {
+      childList: true
+    });
     return () => {
       if (observer) {
         observer.disconnect();
       }
-
       debouncedDisable.cancel();
+      updates.forEach(update => update());
     };
-  }, []);
-  return node;
+  }, [isDisabledProp]);
 }
 
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-isomorphic-layout-effect/index.js
@@ -3586,38 +4535,39 @@
  * WordPress dependencies
  */
 
+
 /**
  * Preferred over direct usage of `useLayoutEffect` when supporting
  * server rendered components (SSR) because currently React
  * throws a warning when using useLayoutEffect in that environment.
  */
-
 const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? external_wp_element_namespaceObject.useLayoutEffect : external_wp_element_namespaceObject.useEffect;
-/* harmony default export */ var use_isomorphic_layout_effect = (useIsomorphicLayoutEffect);
+/* harmony default export */ const use_isomorphic_layout_effect = (useIsomorphicLayoutEffect);
 
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-dragging/index.js
 /**
  * WordPress dependencies
  */
 
+
 /**
  * Internal dependencies
  */
 
 
+// Event handlers that are triggered from `document` listeners accept a MouseEvent,
+// while those triggered from React listeners accept a React.MouseEvent.
 /**
- * @param {Object}                  props
- * @param {(e: MouseEvent) => void} props.onDragStart
- * @param {(e: MouseEvent) => void} props.onDragMove
- * @param {(e: MouseEvent) => void} props.onDragEnd
+ * @param {Object}                                  props
+ * @param {(e: import('react').MouseEvent) => void} props.onDragStart
+ * @param {(e: MouseEvent) => void}                 props.onDragMove
+ * @param {(e?: MouseEvent) => void}                props.onDragEnd
  */
-
-function useDragging(_ref) {
-  let {
-    onDragStart,
-    onDragMove,
-    onDragEnd
-  } = _ref;
+function useDragging({
+  onDragStart,
+  onDragMove,
+  onDragEnd
+}) {
   const [isDragging, setIsDragging] = (0,external_wp_element_namespaceObject.useState)(false);
   const eventsRef = (0,external_wp_element_namespaceObject.useRef)({
     onDragStart,
@@ -3629,32 +4579,29 @@
     eventsRef.current.onDragMove = onDragMove;
     eventsRef.current.onDragEnd = onDragEnd;
   }, [onDragStart, onDragMove, onDragEnd]);
-  const onMouseMove = (0,external_wp_element_namespaceObject.useCallback)((
-  /** @type {MouseEvent} */
-  event) => eventsRef.current.onDragMove && eventsRef.current.onDragMove(event), []);
-  const endDrag = (0,external_wp_element_namespaceObject.useCallback)((
-  /** @type {MouseEvent} */
-  event) => {
+
+  /** @type {(e: MouseEvent) => void} */
+  const onMouseMove = (0,external_wp_element_namespaceObject.useCallback)(event => eventsRef.current.onDragMove && eventsRef.current.onDragMove(event), []);
+  /** @type {(e?: MouseEvent) => void} */
+  const endDrag = (0,external_wp_element_namespaceObject.useCallback)(event => {
     if (eventsRef.current.onDragEnd) {
       eventsRef.current.onDragEnd(event);
     }
-
     document.removeEventListener('mousemove', onMouseMove);
     document.removeEventListener('mouseup', endDrag);
     setIsDragging(false);
   }, []);
-  const startDrag = (0,external_wp_element_namespaceObject.useCallback)((
-  /** @type {MouseEvent} */
-  event) => {
+  /** @type {(e: import('react').MouseEvent) => void} */
+  const startDrag = (0,external_wp_element_namespaceObject.useCallback)(event => {
     if (eventsRef.current.onDragStart) {
       eventsRef.current.onDragStart(event);
     }
-
     document.addEventListener('mousemove', onMouseMove);
     document.addEventListener('mouseup', endDrag);
     setIsDragging(true);
-  }, []); // Remove the global events when unmounting if needed.
-
+  }, []);
+
+  // Remove the global events when unmounting if needed.
   (0,external_wp_element_namespaceObject.useEffect)(() => {
     return () => {
       if (isDragging) {
@@ -3671,10 +4618,10 @@
 }
 
 // EXTERNAL MODULE: ./node_modules/mousetrap/mousetrap.js
-var mousetrap_mousetrap = __webpack_require__(7973);
+var mousetrap_mousetrap = __webpack_require__(1933);
 var mousetrap_default = /*#__PURE__*/__webpack_require__.n(mousetrap_mousetrap);
 // EXTERNAL MODULE: ./node_modules/mousetrap/plugins/global-bind/mousetrap-global-bind.js
-var mousetrap_global_bind = __webpack_require__(5538);
+var mousetrap_global_bind = __webpack_require__(5760);
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-keyboard-shortcut/index.js
 /**
  * External dependencies
@@ -3687,6 +4634,7 @@
  */
 
 
+
 /**
  * A block selection object.
  *
@@ -3698,24 +4646,7 @@
  * @property {import('react').RefObject<HTMLElement>} [target]     React reference to the DOM element used to catch the keyboard event.
  */
 
-/**
- * Return true if platform is MacOS.
- *
- * @param {Window} [_window] window object by default; used for DI testing.
- *
- * @return {boolean} True if MacOS; false otherwise.
- */
-
-function isAppleOS() {
-  let _window = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
-
-  const {
-    platform
-  } = _window.navigator;
-  return platform.indexOf('Mac') !== -1 || (0,external_lodash_namespaceObject.includes)(['iPad', 'iPhone'], platform);
-}
 /* eslint-disable jsdoc/valid-types */
-
 /**
  * Attach a keyboard shortcut handler.
  *
@@ -3725,18 +4656,14 @@
  * @param {(e: import('mousetrap').ExtendedKeyboardEvent, combo: string) => void} callback  Shortcut callback.
  * @param {WPKeyboardShortcutConfig}                                              options   Shortcut options.
  */
-
-
-function useKeyboardShortcut(
-/* eslint-enable jsdoc/valid-types */
-shortcuts, callback) {
-  let {
-    bindGlobal = false,
-    eventName = 'keydown',
-    isDisabled = false,
-    // This is important for performance considerations.
-    target
-  } = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+function useKeyboardShortcut( /* eslint-enable jsdoc/valid-types */
+shortcuts, callback, {
+  bindGlobal = false,
+  eventName = 'keydown',
+  isDisabled = false,
+  // This is important for performance considerations.
+  target
+} = {}) {
   const currentCallback = (0,external_wp_element_namespaceObject.useRef)(callback);
   (0,external_wp_element_namespaceObject.useEffect)(() => {
     currentCallback.current = callback;
@@ -3745,74 +4672,97 @@
     if (isDisabled) {
       return;
     }
-
-    const mousetrap = new (mousetrap_default())(target && target.current ? target.current : // We were passing `document` here previously, so to successfully cast it to Element we must cast it first to `unknown`.
+    const mousetrap = new (mousetrap_default())(target && target.current ? target.current :
+    // We were passing `document` here previously, so to successfully cast it to Element we must cast it first to `unknown`.
     // Not sure if this is a mistake but it was the behavior previous to the addition of types so we're just doing what's
     // necessary to maintain the existing behavior.
-
-    /** @type {Element} */
-
-    /** @type {unknown} */
+    /** @type {Element} */ /** @type {unknown} */
     document);
-    (0,external_lodash_namespaceObject.castArray)(shortcuts).forEach(shortcut => {
-      const keys = shortcut.split('+'); // Determines whether a key is a modifier by the length of the string.
+    const shortcutsArray = Array.isArray(shortcuts) ? shortcuts : [shortcuts];
+    shortcutsArray.forEach(shortcut => {
+      const keys = shortcut.split('+');
+      // Determines whether a key is a modifier by the length of the string.
       // E.g. if I add a pass a shortcut Shift+Cmd+M, it'll determine that
       // the modifiers are Shift and Cmd because they're not a single character.
-
       const modifiers = new Set(keys.filter(value => value.length > 1));
       const hasAlt = modifiers.has('alt');
-      const hasShift = modifiers.has('shift'); // This should be better moved to the shortcut registration instead.
-
-      if (isAppleOS() && (modifiers.size === 1 && hasAlt || modifiers.size === 2 && hasAlt && hasShift)) {
+      const hasShift = modifiers.has('shift');
+
+      // This should be better moved to the shortcut registration instead.
+      if ((0,external_wp_keycodes_namespaceObject.isAppleOS)() && (modifiers.size === 1 && hasAlt || modifiers.size === 2 && hasAlt && hasShift)) {
         throw new Error(`Cannot bind ${shortcut}. Alt and Shift+Alt modifiers are reserved for character input.`);
       }
-
-      const bindFn = bindGlobal ? 'bindGlobal' : 'bind'; // @ts-ignore `bindGlobal` is an undocumented property
-
-      mousetrap[bindFn](shortcut, function () {
-        return (
-          /* eslint-enable jsdoc/valid-types */
-          currentCallback.current(...arguments)
-        );
-      }, eventName);
+      const bindFn = bindGlobal ? 'bindGlobal' : 'bind';
+      // @ts-ignore `bindGlobal` is an undocumented property
+      mousetrap[bindFn](shortcut, ( /* eslint-disable jsdoc/valid-types */
+      /** @type {[e: import('mousetrap').ExtendedKeyboardEvent, combo: string]} */...args) => /* eslint-enable jsdoc/valid-types */
+      currentCallback.current(...args), eventName);
     });
     return () => {
       mousetrap.reset();
     };
   }, [shortcuts, bindGlobal, eventName, target, isDisabled]);
 }
-
-/* harmony default export */ var use_keyboard_shortcut = (useKeyboardShortcut);
+/* harmony default export */ const use_keyboard_shortcut = (useKeyboardShortcut);
 
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-media-query/index.js
 /**
  * WordPress dependencies
  */
 
+const matchMediaCache = new Map();
+
+/**
+ * A new MediaQueryList object for the media query
+ *
+ * @param {string} [query] Media Query.
+ * @return {MediaQueryList|null} A new object for the media query
+ */
+function getMediaQueryList(query) {
+  if (!query) {
+    return null;
+  }
+  let match = matchMediaCache.get(query);
+  if (match) {
+    return match;
+  }
+  if (typeof window !== 'undefined' && typeof window.matchMedia === 'function') {
+    match = window.matchMedia(query);
+    matchMediaCache.set(query, match);
+    return match;
+  }
+  return null;
+}
+
 /**
  * Runs a media query and returns its value when it changes.
  *
  * @param {string} [query] Media Query.
  * @return {boolean} return value of the media query.
  */
-
 function useMediaQuery(query) {
-  const [match, setMatch] = (0,external_wp_element_namespaceObject.useState)(() => !!(query && typeof window !== 'undefined' && window.matchMedia(query).matches));
-  (0,external_wp_element_namespaceObject.useEffect)(() => {
-    if (!query) {
-      return;
-    }
-
-    const updateMatch = () => setMatch(window.matchMedia(query).matches);
-
-    updateMatch();
-    const list = window.matchMedia(query);
-    list.addListener(updateMatch);
-    return () => {
-      list.removeListener(updateMatch);
+  const source = (0,external_wp_element_namespaceObject.useMemo)(() => {
+    const mediaQueryList = getMediaQueryList(query);
+    return {
+      /** @type {(onStoreChange: () => void) => () => void} */
+      subscribe(onStoreChange) {
+        if (!mediaQueryList) {
+          return () => {};
+        }
+
+        // Avoid a fatal error when browsers don't support `addEventListener` on MediaQueryList.
+        mediaQueryList.addEventListener?.('change', onStoreChange);
+        return () => {
+          mediaQueryList.removeEventListener?.('change', onStoreChange);
+        };
+      },
+      getValue() {
+        var _mediaQueryList$match;
+        return (_mediaQueryList$match = mediaQueryList?.matches) !== null && _mediaQueryList$match !== void 0 ? _mediaQueryList$match : false;
+      }
     };
   }, [query]);
-  return !!query && match;
+  return (0,external_wp_element_namespaceObject.useSyncExternalStore)(source.subscribe, source.getValue, () => false);
 }
 
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-previous/index.js
@@ -3820,23 +4770,24 @@
  * WordPress dependencies
  */
 
+
 /**
  * Use something's value from the previous render.
  * Based on https://usehooks.com/usePrevious/.
  *
- * @param  value The value to track.
+ * @param value The value to track.
  *
  * @return The value from the previous render.
  */
-
 function usePrevious(value) {
-  const ref = (0,external_wp_element_namespaceObject.useRef)(); // Store current value in ref.
-
+  const ref = (0,external_wp_element_namespaceObject.useRef)();
+
+  // Store current value in ref.
   (0,external_wp_element_namespaceObject.useEffect)(() => {
     ref.current = value;
   }, [value]); // Re-run when value changes.
+
   // Return previous value (happens before update in useEffect above).
-
   return ref.current;
 }
 
@@ -3845,21 +4796,111 @@
  * Internal dependencies
  */
 
+
 /**
  * Hook returning whether the user has a preference for reduced motion.
  *
  * @return {boolean} Reduced motion preference value.
  */
-
 const useReducedMotion = () => useMediaQuery('(prefers-reduced-motion: reduce)');
-
-/* harmony default export */ var use_reduced_motion = (useReducedMotion);
+/* harmony default export */ const use_reduced_motion = (useReducedMotion);
+
+// EXTERNAL MODULE: ./node_modules/@wordpress/undo-manager/build-module/index.js
+var build_module = __webpack_require__(6689);
+;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-state-with-history/index.js
+/**
+ * WordPress dependencies
+ */
+
+
+function undoRedoReducer(state, action) {
+  switch (action.type) {
+    case 'UNDO':
+      {
+        const undoRecord = state.manager.undo();
+        if (undoRecord) {
+          return {
+            ...state,
+            value: undoRecord[0].changes.prop.from
+          };
+        }
+        return state;
+      }
+    case 'REDO':
+      {
+        const redoRecord = state.manager.redo();
+        if (redoRecord) {
+          return {
+            ...state,
+            value: redoRecord[0].changes.prop.to
+          };
+        }
+        return state;
+      }
+    case 'RECORD':
+      {
+        state.manager.addRecord([{
+          id: 'object',
+          changes: {
+            prop: {
+              from: state.value,
+              to: action.value
+            }
+          }
+        }], action.isStaged);
+        return {
+          ...state,
+          value: action.value
+        };
+      }
+  }
+  return state;
+}
+function initReducer(value) {
+  return {
+    manager: (0,build_module.createUndoManager)(),
+    value
+  };
+}
+
+/**
+ * useState with undo/redo history.
+ *
+ * @param initialValue Initial value.
+ * @return Value, setValue, hasUndo, hasRedo, undo, redo.
+ */
+function useStateWithHistory(initialValue) {
+  const [state, dispatch] = (0,external_wp_element_namespaceObject.useReducer)(undoRedoReducer, initialValue, initReducer);
+  return {
+    value: state.value,
+    setValue: (0,external_wp_element_namespaceObject.useCallback)((newValue, isStaged) => {
+      dispatch({
+        type: 'RECORD',
+        value: newValue,
+        isStaged
+      });
+    }, []),
+    hasUndo: state.manager.hasUndo(),
+    hasRedo: state.manager.hasRedo(),
+    undo: (0,external_wp_element_namespaceObject.useCallback)(() => {
+      dispatch({
+        type: 'UNDO'
+      });
+    }, []),
+    redo: (0,external_wp_element_namespaceObject.useCallback)(() => {
+      dispatch({
+        type: 'REDO'
+      });
+    }, [])
+  };
+}
 
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-viewport-match/index.js
 /**
  * WordPress dependencies
  */
 
+
 /**
  * Internal dependencies
  */
@@ -3876,7 +4917,6 @@
  *
  * @type {Record<WPBreakpoint, number>}
  */
-
 const BREAKPOINTS = {
   huge: 1440,
   wide: 1280,
@@ -3885,6 +4925,7 @@
   small: 600,
   mobile: 480
 };
+
 /**
  * @typedef {">=" | "<"} WPViewportOperator
  */
@@ -3894,24 +4935,22 @@
  *
  * @type {Record<WPViewportOperator, string>}
  */
-
 const CONDITIONS = {
   '>=': 'min-width',
   '<': 'max-width'
 };
+
 /**
  * Object mapping media query operators to a function that given a breakpointValue and a width evaluates if the operator matches the values.
  *
  * @type {Record<WPViewportOperator, (breakpointValue: number, width: number) => boolean>}
  */
-
 const OPERATOR_EVALUATORS = {
   '>=': (breakpointValue, width) => width >= breakpointValue,
   '<': (breakpointValue, width) => width < breakpointValue
 };
-const ViewportMatchWidthContext = (0,external_wp_element_namespaceObject.createContext)(
-/** @type {null | number} */
-null);
+const ViewportMatchWidthContext = (0,external_wp_element_namespaceObject.createContext)( /** @type {null | number} */null);
+
 /**
  * Returns true if the viewport matches the given query, or false otherwise.
  *
@@ -3927,39 +4966,218 @@
  *
  * @return {boolean} Whether viewport matches query.
  */
-
-const useViewportMatch = function (breakpoint) {
-  let operator = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '>=';
+const useViewportMatch = (breakpoint, operator = '>=') => {
   const simulatedWidth = (0,external_wp_element_namespaceObject.useContext)(ViewportMatchWidthContext);
   const mediaQuery = !simulatedWidth && `(${CONDITIONS[operator]}: ${BREAKPOINTS[breakpoint]}px)`;
   const mediaQueryResult = useMediaQuery(mediaQuery || undefined);
-
   if (simulatedWidth) {
     return OPERATOR_EVALUATORS[operator](BREAKPOINTS[breakpoint], simulatedWidth);
   }
-
   return mediaQueryResult;
 };
-
 useViewportMatch.__experimentalWidthProvider = ViewportMatchWidthContext.Provider;
-/* harmony default export */ var use_viewport_match = (useViewportMatch);
-
-// EXTERNAL MODULE: ./node_modules/react-resize-aware/dist/index.js
-var dist = __webpack_require__(235);
-var dist_default = /*#__PURE__*/__webpack_require__.n(dist);
+/* harmony default export */ const use_viewport_match = (useViewportMatch);
+
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-resize-observer/index.js
 /**
  * External dependencies
  */
 
 /**
+ * WordPress dependencies
+ */
+
+
+// This of course could've been more streamlined with internal state instead of
+// refs, but then host hooks / components could not opt out of renders.
+// This could've been exported to its own module, but the current build doesn't
+// seem to work with module imports and I had no more time to spend on this...
+function useResolvedElement(subscriber, refOrElement) {
+  const callbackRefElement = (0,external_wp_element_namespaceObject.useRef)(null);
+  const lastReportRef = (0,external_wp_element_namespaceObject.useRef)(null);
+  const cleanupRef = (0,external_wp_element_namespaceObject.useRef)();
+  const callSubscriber = (0,external_wp_element_namespaceObject.useCallback)(() => {
+    let element = null;
+    if (callbackRefElement.current) {
+      element = callbackRefElement.current;
+    } else if (refOrElement) {
+      if (refOrElement instanceof HTMLElement) {
+        element = refOrElement;
+      } else {
+        element = refOrElement.current;
+      }
+    }
+    if (lastReportRef.current && lastReportRef.current.element === element && lastReportRef.current.reporter === callSubscriber) {
+      return;
+    }
+    if (cleanupRef.current) {
+      cleanupRef.current();
+      // Making sure the cleanup is not called accidentally multiple times.
+      cleanupRef.current = null;
+    }
+    lastReportRef.current = {
+      reporter: callSubscriber,
+      element
+    };
+
+    // Only calling the subscriber, if there's an actual element to report.
+    if (element) {
+      cleanupRef.current = subscriber(element);
+    }
+  }, [refOrElement, subscriber]);
+
+  // On each render, we check whether a ref changed, or if we got a new raw
+  // element.
+  (0,external_wp_element_namespaceObject.useEffect)(() => {
+    // With this we're *technically* supporting cases where ref objects' current value changes, but only if there's a
+    // render accompanying that change as well.
+    // To guarantee we always have the right element, one must use the ref callback provided instead, but we support
+    // RefObjects to make the hook API more convenient in certain cases.
+    callSubscriber();
+  }, [callSubscriber]);
+  return (0,external_wp_element_namespaceObject.useCallback)(element => {
+    callbackRefElement.current = element;
+    callSubscriber();
+  }, [callSubscriber]);
+}
+
+// Declaring my own type here instead of using the one provided by TS (available since 4.2.2), because this way I'm not
+// forcing consumers to use a specific TS version.
+
+// We're only using the first element of the size sequences, until future versions of the spec solidify on how
+// exactly it'll be used for fragments in multi-column scenarios:
+// From the spec:
+// > The box size properties are exposed as FrozenArray in order to support elements that have multiple fragments,
+// > which occur in multi-column scenarios. However the current definitions of content rect and border box do not
+// > mention how those boxes are affected by multi-column layout. In this spec, there will only be a single
+// > ResizeObserverSize returned in the FrozenArray, which will correspond to the dimensions of the first column.
+// > A future version of this spec will extend the returned FrozenArray to contain the per-fragment size information.
+// (https://drafts.csswg.org/resize-observer/#resize-observer-entry-interface)
+//
+// Also, testing these new box options revealed that in both Chrome and FF everything is returned in the callback,
+// regardless of the "box" option.
+// The spec states the following on this:
+// > This does not have any impact on which box dimensions are returned to the defined callback when the event
+// > is fired, it solely defines which box the author wishes to observe layout changes on.
+// (https://drafts.csswg.org/resize-observer/#resize-observer-interface)
+// I'm not exactly clear on what this means, especially when you consider a later section stating the following:
+// > This section is non-normative. An author may desire to observe more than one CSS box.
+// > In this case, author will need to use multiple ResizeObservers.
+// (https://drafts.csswg.org/resize-observer/#resize-observer-interface)
+// Which is clearly not how current browser implementations behave, and seems to contradict the previous quote.
+// For this reason I decided to only return the requested size,
+// even though it seems we have access to results for all box types.
+// This also means that we get to keep the current api, being able to return a simple { width, height } pair,
+// regardless of box option.
+const extractSize = (entry, boxProp, sizeType) => {
+  if (!entry[boxProp]) {
+    if (boxProp === 'contentBoxSize') {
+      // The dimensions in `contentBoxSize` and `contentRect` are equivalent according to the spec.
+      // See the 6th step in the description for the RO algorithm:
+      // https://drafts.csswg.org/resize-observer/#create-and-populate-resizeobserverentry-h
+      // > Set this.contentRect to logical this.contentBoxSize given target and observedBox of "content-box".
+      // In real browser implementations of course these objects differ, but the width/height values should be equivalent.
+      return entry.contentRect[sizeType === 'inlineSize' ? 'width' : 'height'];
+    }
+    return undefined;
+  }
+
+  // A couple bytes smaller than calling Array.isArray() and just as effective here.
+  return entry[boxProp][0] ? entry[boxProp][0][sizeType] :
+  // TS complains about this, because the RO entry type follows the spec and does not reflect Firefox's current
+  // behaviour of returning objects instead of arrays for `borderBoxSize` and `contentBoxSize`.
+  // @ts-ignore
+  entry[boxProp][sizeType];
+};
+function useResizeObserver(opts = {}) {
+  // Saving the callback as a ref. With this, I don't need to put onResize in the
+  // effect dep array, and just passing in an anonymous function without memoising
+  // will not reinstantiate the hook's ResizeObserver.
+  const onResize = opts.onResize;
+  const onResizeRef = (0,external_wp_element_namespaceObject.useRef)(undefined);
+  onResizeRef.current = onResize;
+  const round = opts.round || Math.round;
+
+  // Using a single instance throughout the hook's lifetime
+  const resizeObserverRef = (0,external_wp_element_namespaceObject.useRef)();
+  const [size, setSize] = (0,external_wp_element_namespaceObject.useState)({
+    width: undefined,
+    height: undefined
+  });
+
+  // In certain edge cases the RO might want to report a size change just after
+  // the component unmounted.
+  const didUnmount = (0,external_wp_element_namespaceObject.useRef)(false);
+  (0,external_wp_element_namespaceObject.useEffect)(() => {
+    didUnmount.current = false;
+    return () => {
+      didUnmount.current = true;
+    };
+  }, []);
+
+  // Using a ref to track the previous width / height to avoid unnecessary renders.
+  const previous = (0,external_wp_element_namespaceObject.useRef)({
+    width: undefined,
+    height: undefined
+  });
+
+  // This block is kinda like a useEffect, only it's called whenever a new
+  // element could be resolved based on the ref option. It also has a cleanup
+  // function.
+  const refCallback = useResolvedElement((0,external_wp_element_namespaceObject.useCallback)(element => {
+    // We only use a single Resize Observer instance, and we're instantiating it on demand, only once there's something to observe.
+    // This instance is also recreated when the `box` option changes, so that a new observation is fired if there was a previously observed element with a different box option.
+    if (!resizeObserverRef.current || resizeObserverRef.current.box !== opts.box || resizeObserverRef.current.round !== round) {
+      resizeObserverRef.current = {
+        box: opts.box,
+        round,
+        instance: new ResizeObserver(entries => {
+          const entry = entries[0];
+          let boxProp = 'borderBoxSize';
+          if (opts.box === 'border-box') {
+            boxProp = 'borderBoxSize';
+          } else {
+            boxProp = opts.box === 'device-pixel-content-box' ? 'devicePixelContentBoxSize' : 'contentBoxSize';
+          }
+          const reportedWidth = extractSize(entry, boxProp, 'inlineSize');
+          const reportedHeight = extractSize(entry, boxProp, 'blockSize');
+          const newWidth = reportedWidth ? round(reportedWidth) : undefined;
+          const newHeight = reportedHeight ? round(reportedHeight) : undefined;
+          if (previous.current.width !== newWidth || previous.current.height !== newHeight) {
+            const newSize = {
+              width: newWidth,
+              height: newHeight
+            };
+            previous.current.width = newWidth;
+            previous.current.height = newHeight;
+            if (onResizeRef.current) {
+              onResizeRef.current(newSize);
+            } else if (!didUnmount.current) {
+              setSize(newSize);
+            }
+          }
+        })
+      };
+    }
+    resizeObserverRef.current.instance.observe(element, {
+      box: opts.box
+    });
+    return () => {
+      if (resizeObserverRef.current) {
+        resizeObserverRef.current.instance.unobserve(element);
+      }
+    };
+  }, [opts.box, round]), opts.ref);
+  return (0,external_wp_element_namespaceObject.useMemo)(() => ({
+    ref: refCallback,
+    width: size.width,
+    height: size.height
+  }), [refCallback, size ? size.width : null, size ? size.height : null]);
+}
+
+/**
  * Hook which allows to listen the resize event of any target element when it changes sizes.
- * _Note: `useResizeObserver` will report `null` until after first render_
- *
- * Simply a re-export of `react-resize-aware` so refer to its documentation <https://github.com/FezVrasta/react-resize-aware>
- * for more details.
- *
- * @see https://github.com/FezVrasta/react-resize-aware
+ * _Note: `useResizeObserver` will report `null` until after first render.
  *
  * @example
  *
@@ -3975,57 +5193,76 @@
  * 	);
  * };
  * ```
- *
  */
-
-/* harmony default export */ var use_resize_observer = ((dist_default()));
+function useResizeAware() {
+  const {
+    ref,
+    width,
+    height
+  } = useResizeObserver();
+  const sizes = (0,external_wp_element_namespaceObject.useMemo)(() => {
+    return {
+      width: width !== null && width !== void 0 ? width : null,
+      height: height !== null && height !== void 0 ? height : null
+    };
+  }, [width, height]);
+  const resizeListener = /*#__PURE__*/(0,external_ReactJSXRuntime_namespaceObject.jsx)("div", {
+    style: {
+      position: 'absolute',
+      top: 0,
+      left: 0,
+      right: 0,
+      bottom: 0,
+      pointerEvents: 'none',
+      opacity: 0,
+      overflow: 'hidden',
+      zIndex: -1
+    },
+    "aria-hidden": "true",
+    ref: ref
+  });
+  return [resizeListener, sizes];
+}
 
 ;// CONCATENATED MODULE: external ["wp","priorityQueue"]
-var external_wp_priorityQueue_namespaceObject = window["wp"]["priorityQueue"];
+const external_wp_priorityQueue_namespaceObject = window["wp"]["priorityQueue"];
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-async-list/index.js
 /**
  * WordPress dependencies
  */
 
 
-
 /**
  * Returns the first items from list that are present on state.
  *
- * @param  list  New array.
- * @param  state Current state.
+ * @param list  New array.
+ * @param state Current state.
  * @return First items present iin state.
  */
 function getFirstItemsPresentInState(list, state) {
   const firstItems = [];
-
   for (let i = 0; i < list.length; i++) {
     const item = list[i];
-
     if (!state.includes(item)) {
       break;
     }
-
     firstItems.push(item);
   }
-
   return firstItems;
 }
+
 /**
  * React hook returns an array which items get asynchronously appended from a source array.
  * This behavior is useful if we want to render a list of items asynchronously for performance reasons.
  *
- * @param  list   Source array.
- * @param  config Configuration object.
+ * @param list   Source array.
+ * @param config Configuration object.
  *
  * @return Async array.
  */
-
-
-function useAsyncList(list) {
-  let config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
-    step: 1
-  };
+function useAsyncList(list, config = {
+  step: 1
+}) {
   const {
     step = 1
   } = config;
@@ -4033,42 +5270,33 @@
   (0,external_wp_element_namespaceObject.useEffect)(() => {
     // On reset, we keep the first items that were previously rendered.
     let firstItems = getFirstItemsPresentInState(list, current);
-
     if (firstItems.length < step) {
       firstItems = firstItems.concat(list.slice(firstItems.length, step));
     }
-
     setCurrent(firstItems);
-    let nextIndex = firstItems.length;
     const asyncQueue = (0,external_wp_priorityQueue_namespaceObject.createQueue)();
-
-    const append = () => {
-      if (list.length <= nextIndex) {
-        return;
-      }
-
-      setCurrent(state => [...state, ...list.slice(nextIndex, nextIndex + step)]);
-      nextIndex += step;
-      asyncQueue.add({}, append);
-    };
-
-    asyncQueue.add({}, append);
+    for (let i = firstItems.length; i < list.length; i += step) {
+      asyncQueue.add({}, () => {
+        (0,external_wp_element_namespaceObject.flushSync)(() => {
+          setCurrent(state => [...state, ...list.slice(i, i + step)]);
+        });
+      });
+    }
     return () => asyncQueue.reset();
   }, [list]);
   return current;
 }
-
-/* harmony default export */ var use_async_list = (useAsyncList);
+/* harmony default export */ const use_async_list = (useAsyncList);
 
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-warn-on-change/index.js
 /**
  * Internal dependencies
  */
- // Disable reason: Object and object are distinctly different types in TypeScript and we mean the lowercase object in thise case
+
+
+// Disable reason: Object and object are distinctly different types in TypeScript and we mean the lowercase object in thise case
 // but eslint wants to force us to use `Object`. See https://stackoverflow.com/questions/49464634/difference-between-object-and-object-in-typescript
-
 /* eslint-disable jsdoc/check-types */
-
 /**
  * Hook that performs a shallow comparison between the preview value of an object
  * and the new one, if there's a difference, it prints it to the console.
@@ -4087,30 +5315,20 @@
  * @param {object} object Object which changes to compare.
  * @param {string} prefix Just a prefix to show when console logging.
  */
-
-function useWarnOnChange(object) {
-  let prefix = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'Change detection';
+function useWarnOnChange(object, prefix = 'Change detection') {
   const previousValues = usePrevious(object);
-  Object.entries(previousValues !== null && previousValues !== void 0 ? previousValues : []).forEach(_ref => {
-    let [key, value] = _ref;
-
-    if (value !== object[
-    /** @type {keyof typeof object} */
-    key]) {
+  Object.entries(previousValues !== null && previousValues !== void 0 ? previousValues : []).forEach(([key, value]) => {
+    if (value !== object[( /** @type {keyof typeof object} */key)]) {
       // eslint-disable-next-line no-console
-      console.warn(`${prefix}: ${key} key changed:`, value, object[
-      /** @type {keyof typeof object} */
-      key]
-      /* eslint-enable jsdoc/check-types */
-      );
+      console.warn(`${prefix}: ${key} key changed:`, value, object[( /** @type {keyof typeof object} */key)]
+      /* eslint-enable jsdoc/check-types */);
     }
   });
 }
-
-/* harmony default export */ var use_warn_on_change = (useWarnOnChange);
-
-// EXTERNAL MODULE: external "React"
-var external_React_ = __webpack_require__(9196);
+/* harmony default export */ const use_warn_on_change = (useWarnOnChange);
+
+;// CONCATENATED MODULE: external "React"
+const external_React_namespaceObject = window["React"];
 ;// CONCATENATED MODULE: ./node_modules/use-memo-one/dist/use-memo-one.esm.js
 
 
@@ -4129,20 +5347,20 @@
 }
 
 function useMemoOne(getResult, inputs) {
-  var initial = (0,external_React_.useState)(function () {
+  var initial = (0,external_React_namespaceObject.useState)(function () {
     return {
       inputs: inputs,
       result: getResult()
     };
   })[0];
-  var isFirstRun = (0,external_React_.useRef)(true);
-  var committed = (0,external_React_.useRef)(initial);
+  var isFirstRun = (0,external_React_namespaceObject.useRef)(true);
+  var committed = (0,external_React_namespaceObject.useRef)(initial);
   var useCache = isFirstRun.current || Boolean(inputs && committed.current.inputs && areInputsEqual(inputs, committed.current.inputs));
   var cache = useCache ? committed.current : {
     inputs: inputs,
     result: getResult()
   };
-  (0,external_React_.useEffect)(function () {
+  (0,external_React_namespaceObject.useEffect)(function () {
     isFirstRun.current = false;
     committed.current = cache;
   }, [cache]);
@@ -4169,31 +5387,59 @@
  */
 
 
-/* eslint-disable jsdoc/valid-types */
+/**
+ * Internal dependencies
+ */
+
 
 /**
- * Debounces a function with Lodash's `debounce`. A new debounced function will
+ * Debounces a function similar to Lodash's `debounce`. A new debounced function will
  * be returned and any scheduled calls cancelled if any of the arguments change,
  * including the function to debounce, so please wrap functions created on
  * render in components in `useCallback`.
  *
- * @see https://docs-lodash.com/v4/debounce/
+ * @see https://lodash.com/docs/4#debounce
  *
  * @template {(...args: any[]) => void} TFunc
  *
- * @param {TFunc}                             fn        The function to debounce.
- * @param {number}                            [wait]    The number of milliseconds to delay.
- * @param {import('lodash').DebounceSettings} [options] The options object.
- * @return {import('lodash').DebouncedFunc<TFunc>} Debounced function.
+ * @param {TFunc}                                          fn        The function to debounce.
+ * @param {number}                                         [wait]    The number of milliseconds to delay.
+ * @param {import('../../utils/debounce').DebounceOptions} [options] The options object.
+ * @return {import('../../utils/debounce').DebouncedFunc<TFunc>} Debounced function.
  */
-
 function useDebounce(fn, wait, options) {
-  /* eslint-enable jsdoc/valid-types */
-  const debounced = useMemoOne(() => (0,external_lodash_namespaceObject.debounce)(fn, wait, options), [fn, wait, options]);
+  const debounced = useMemoOne(() => debounce(fn, wait !== null && wait !== void 0 ? wait : 0, options), [fn, wait, options]);
   (0,external_wp_element_namespaceObject.useEffect)(() => () => debounced.cancel(), [debounced]);
   return debounced;
 }
 
+;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-debounced-input/index.js
+/**
+ * WordPress dependencies
+ */
+
+
+/**
+ * Internal dependencies
+ */
+
+
+/**
+ * Helper hook for input fields that need to debounce the value before using it.
+ *
+ * @param defaultValue The default value to use.
+ * @return The input value, the setter and the debounced input value.
+ */
+function useDebouncedInput(defaultValue = '') {
+  const [input, setInput] = (0,external_wp_element_namespaceObject.useState)(defaultValue);
+  const [debouncedInput, setDebouncedState] = (0,external_wp_element_namespaceObject.useState)(defaultValue);
+  const setDebouncedInput = useDebounce(setDebouncedState, 250);
+  (0,external_wp_element_namespaceObject.useEffect)(() => {
+    setDebouncedInput(input);
+  }, [input, setDebouncedInput]);
+  return [input, setInput, debouncedInput];
+}
+
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-throttle/index.js
 /**
  * External dependencies
@@ -4206,23 +5452,27 @@
 
 
 /**
- * Throttles a function with Lodash's `throttle`. A new throttled function will
+ * Internal dependencies
+ */
+
+
+/**
+ * Throttles a function similar to Lodash's `throttle`. A new throttled function will
  * be returned and any scheduled calls cancelled if any of the arguments change,
  * including the function to throttle, so please wrap functions created on
  * render in components in `useCallback`.
  *
- * @see https://docs-lodash.com/v4/throttle/
+ * @see https://lodash.com/docs/4#throttle
  *
  * @template {(...args: any[]) => void} TFunc
  *
- * @param {TFunc}                             fn        The function to throttle.
- * @param {number}                            [wait]    The number of milliseconds to throttle invocations to.
- * @param {import('lodash').ThrottleSettings} [options] The options object. See linked documentation for details.
- * @return {import('lodash').DebouncedFunc<TFunc>} Throttled function.
+ * @param {TFunc}                                          fn        The function to throttle.
+ * @param {number}                                         [wait]    The number of milliseconds to throttle invocations to.
+ * @param {import('../../utils/throttle').ThrottleOptions} [options] The options object. See linked documentation for details.
+ * @return {import('../../utils/debounce').DebouncedFunc<TFunc>} Throttled function.
  */
-
 function useThrottle(fn, wait, options) {
-  const throttled = useMemoOne(() => (0,external_lodash_namespaceObject.throttle)(fn, wait, options), [fn, wait, options]);
+  const throttled = useMemoOne(() => throttle(fn, wait !== null && wait !== void 0 ? wait : 0, options), [fn, wait, options]);
   (0,external_wp_element_namespaceObject.useEffect)(() => () => throttled.cancel(), [throttled]);
   return throttled;
 }
@@ -4232,26 +5482,22 @@
  * WordPress dependencies
  */
 
+
 /**
  * Internal dependencies
  */
 
 
 /* eslint-disable jsdoc/valid-types */
-
 /**
  * @template T
  * @param {T} value
  * @return {import('react').MutableRefObject<T|null>} A ref with the value.
  */
-
 function useFreshRef(value) {
   /* eslint-enable jsdoc/valid-types */
-
   /* eslint-disable jsdoc/no-undefined-types */
-
   /** @type {import('react').MutableRefObject<T>} */
-
   /* eslint-enable jsdoc/no-undefined-types */
   // Disable reason: We're doing something pretty JavaScript-y here where the
   // ref will always have a current value that is not null or undefined but it
@@ -4263,47 +5509,52 @@
   ref.current = value;
   return ref;
 }
+
 /**
  * A hook to facilitate drag and drop handling.
  *
- * @param {Object}                  props             Named parameters.
- * @param {boolean}                 props.isDisabled  Whether or not to disable the drop zone.
- * @param {(e: DragEvent) => void}  props.onDragStart Called when dragging has started.
- * @param {(e: DragEvent) => void}  props.onDragEnter Called when the zone is entered.
- * @param {(e: DragEvent) => void}  props.onDragOver  Called when the zone is moved within.
- * @param {(e: DragEvent) => void}  props.onDragLeave Called when the zone is left.
- * @param {(e: MouseEvent) => void} props.onDragEnd   Called when dragging has ended.
- * @param {(e: DragEvent) => void}  props.onDrop      Called when dropping in the zone.
+ * @param {Object}                  props                   Named parameters.
+ * @param {?HTMLElement}            [props.dropZoneElement] Optional element to be used as the drop zone.
+ * @param {boolean}                 [props.isDisabled]      Whether or not to disable the drop zone.
+ * @param {(e: DragEvent) => void}  [props.onDragStart]     Called when dragging has started.
+ * @param {(e: DragEvent) => void}  [props.onDragEnter]     Called when the zone is entered.
+ * @param {(e: DragEvent) => void}  [props.onDragOver]      Called when the zone is moved within.
+ * @param {(e: DragEvent) => void}  [props.onDragLeave]     Called when the zone is left.
+ * @param {(e: MouseEvent) => void} [props.onDragEnd]       Called when dragging has ended.
+ * @param {(e: DragEvent) => void}  [props.onDrop]          Called when dropping in the zone.
  *
  * @return {import('react').RefCallback<HTMLElement>} Ref callback to be passed to the drop zone element.
  */
-
-
-function useDropZone(_ref) {
-  let {
-    isDisabled,
-    onDrop: _onDrop,
-    onDragStart: _onDragStart,
-    onDragEnter: _onDragEnter,
-    onDragLeave: _onDragLeave,
-    onDragEnd: _onDragEnd,
-    onDragOver: _onDragOver
-  } = _ref;
+function useDropZone({
+  dropZoneElement,
+  isDisabled,
+  onDrop: _onDrop,
+  onDragStart: _onDragStart,
+  onDragEnter: _onDragEnter,
+  onDragLeave: _onDragLeave,
+  onDragEnd: _onDragEnd,
+  onDragOver: _onDragOver
+}) {
   const onDropRef = useFreshRef(_onDrop);
   const onDragStartRef = useFreshRef(_onDragStart);
   const onDragEnterRef = useFreshRef(_onDragEnter);
   const onDragLeaveRef = useFreshRef(_onDragLeave);
   const onDragEndRef = useFreshRef(_onDragEnd);
   const onDragOverRef = useFreshRef(_onDragOver);
-  return useRefEffect(element => {
+  return useRefEffect(elem => {
     if (isDisabled) {
       return;
     }
 
+    // If a custom dropZoneRef is passed, use that instead of the element.
+    // This allows the dropzone to cover an expanded area, rather than
+    // be restricted to the area of the ref returned by this hook.
+    const element = dropZoneElement !== null && dropZoneElement !== void 0 ? dropZoneElement : elem;
     let isDragging = false;
     const {
       ownerDocument
     } = element;
+
     /**
      * Checks if an element is in the drop zone.
      *
@@ -4311,155 +5562,118 @@
      *
      * @return {boolean} True if in drop zone, false if not.
      */
-
     function isElementInZone(targetToCheck) {
       const {
         defaultView
       } = ownerDocument;
-
       if (!targetToCheck || !defaultView || !(targetToCheck instanceof defaultView.HTMLElement) || !element.contains(targetToCheck)) {
         return false;
       }
+
       /** @type {HTMLElement|null} */
-
-
       let elementToCheck = targetToCheck;
-
       do {
         if (elementToCheck.dataset.isDropZone) {
           return elementToCheck === element;
         }
       } while (elementToCheck = elementToCheck.parentElement);
-
       return false;
     }
-
-    function maybeDragStart(
-    /** @type {DragEvent} */
-    event) {
+    function maybeDragStart( /** @type {DragEvent} */event) {
       if (isDragging) {
         return;
       }
-
       isDragging = true;
-      ownerDocument.removeEventListener('dragenter', maybeDragStart); // Note that `dragend` doesn't fire consistently for file and
+
+      // Note that `dragend` doesn't fire consistently for file and
       // HTML drag events where the drag origin is outside the browser
       // window. In Firefox it may also not fire if the originating
       // node is removed.
-
       ownerDocument.addEventListener('dragend', maybeDragEnd);
       ownerDocument.addEventListener('mousemove', maybeDragEnd);
-
       if (onDragStartRef.current) {
         onDragStartRef.current(event);
       }
     }
-
-    function onDragEnter(
-    /** @type {DragEvent} */
-    event) {
-      event.preventDefault(); // The `dragenter` event will also fire when entering child
+    function onDragEnter( /** @type {DragEvent} */event) {
+      event.preventDefault();
+
+      // The `dragenter` event will also fire when entering child
       // elements, but we only want to call `onDragEnter` when
       // entering the drop zone, which means the `relatedTarget`
       // (element that has been left) should be outside the drop zone.
-
-      if (element.contains(
-      /** @type {Node} */
-      event.relatedTarget)) {
+      if (element.contains( /** @type {Node} */event.relatedTarget)) {
         return;
       }
-
       if (onDragEnterRef.current) {
         onDragEnterRef.current(event);
       }
     }
-
-    function onDragOver(
-    /** @type {DragEvent} */
-    event) {
+    function onDragOver( /** @type {DragEvent} */event) {
       // Only call onDragOver for the innermost hovered drop zones.
       if (!event.defaultPrevented && onDragOverRef.current) {
         onDragOverRef.current(event);
-      } // Prevent the browser default while also signalling to parent
+      }
+
+      // Prevent the browser default while also signalling to parent
       // drop zones that `onDragOver` is already handled.
-
-
       event.preventDefault();
     }
-
-    function onDragLeave(
-    /** @type {DragEvent} */
-    event) {
+    function onDragLeave( /** @type {DragEvent} */event) {
       // The `dragleave` event will also fire when leaving child
       // elements, but we only want to call `onDragLeave` when
       // leaving the drop zone, which means the `relatedTarget`
       // (element that has been entered) should be outside the drop
       // zone.
+      // Note: This is not entirely reliable in Safari due to this bug
+      // https://bugs.webkit.org/show_bug.cgi?id=66547
       if (isElementInZone(event.relatedTarget)) {
         return;
       }
-
       if (onDragLeaveRef.current) {
         onDragLeaveRef.current(event);
       }
     }
-
-    function onDrop(
-    /** @type {DragEvent} */
-    event) {
+    function onDrop( /** @type {DragEvent} */event) {
       // Don't handle drop if an inner drop zone already handled it.
       if (event.defaultPrevented) {
         return;
-      } // Prevent the browser default while also signalling to parent
+      }
+
+      // Prevent the browser default while also signalling to parent
       // drop zones that `onDrop` is already handled.
-
-
-      event.preventDefault(); // This seemingly useless line has been shown to resolve a
+      event.preventDefault();
+
+      // This seemingly useless line has been shown to resolve a
       // Safari issue where files dragged directly from the dock are
       // not recognized.
       // eslint-disable-next-line no-unused-expressions
-
       event.dataTransfer && event.dataTransfer.files.length;
-
       if (onDropRef.current) {
         onDropRef.current(event);
       }
-
       maybeDragEnd(event);
     }
-
-    function maybeDragEnd(
-    /** @type {MouseEvent} */
-    event) {
+    function maybeDragEnd( /** @type {MouseEvent} */event) {
       if (!isDragging) {
         return;
       }
-
       isDragging = false;
-      ownerDocument.addEventListener('dragenter', maybeDragStart);
       ownerDocument.removeEventListener('dragend', maybeDragEnd);
       ownerDocument.removeEventListener('mousemove', maybeDragEnd);
-
       if (onDragEndRef.current) {
         onDragEndRef.current(event);
       }
     }
-
     element.dataset.isDropZone = 'true';
     element.addEventListener('drop', onDrop);
     element.addEventListener('dragenter', onDragEnter);
     element.addEventListener('dragover', onDragOver);
-    element.addEventListener('dragleave', onDragLeave); // The `dragstart` event doesn't fire if the drag started outside
+    element.addEventListener('dragleave', onDragLeave);
+    // The `dragstart` event doesn't fire if the drag started outside
     // the document.
-
     ownerDocument.addEventListener('dragenter', maybeDragStart);
     return () => {
-      onDropRef.current = null;
-      onDragStartRef.current = null;
-      onDragEnterRef.current = null;
-      onDragLeaveRef.current = null;
-      onDragEndRef.current = null;
-      onDragOverRef.current = null;
       delete element.dataset.isDropZone;
       element.removeEventListener('drop', onDrop);
       element.removeEventListener('dragenter', onDragEnter);
@@ -4467,45 +5681,52 @@
       element.removeEventListener('dragleave', onDragLeave);
       ownerDocument.removeEventListener('dragend', maybeDragEnd);
       ownerDocument.removeEventListener('mousemove', maybeDragEnd);
-      ownerDocument.addEventListener('dragenter', maybeDragStart);
+      ownerDocument.removeEventListener('dragenter', maybeDragStart);
     };
-  }, [isDisabled]);
+  }, [isDisabled, dropZoneElement] // Refresh when the passed in dropZoneElement changes.
+  );
 }
 
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-focusable-iframe/index.js
 /**
+ * External dependencies
+ */
+
+/**
  * Internal dependencies
  */
 
+
 /**
  * Dispatches a bubbling focus event when the iframe receives focus. Use
  * `onFocus` as usual on the iframe or a parent element.
  *
- * @return {Object} Ref to pass to the iframe.
+ * @return Ref to pass to the iframe.
  */
-
 function useFocusableIframe() {
   return useRefEffect(element => {
     const {
       ownerDocument
     } = element;
-    if (!ownerDocument) return;
+    if (!ownerDocument) {
+      return;
+    }
     const {
       defaultView
     } = ownerDocument;
-    if (!defaultView) return;
+    if (!defaultView) {
+      return;
+    }
+
     /**
      * Checks whether the iframe is the activeElement, inferring that it has
      * then received focus, and dispatches a focus event.
      */
-
     function checkFocus() {
       if (ownerDocument && ownerDocument.activeElement === element) {
-        /** @type {HTMLElement} */
         element.focus();
       }
     }
-
     defaultView.addEventListener('blur', checkFocus);
     return () => {
       defaultView.removeEventListener('blur', checkFocus);
@@ -4515,17 +5736,18 @@
 
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-fixed-window-list/index.js
 /**
- * External dependencies
- */
-
-/**
  * WordPress dependencies
  */
 
 
 
 
+/**
+ * Internal dependencies
+ */
+
 const DEFAULT_INIT_WINDOW_SIZE = 30;
+
 /**
  * @typedef {Object} WPFixedWindowList
  *
@@ -4541,6 +5763,7 @@
  * @property {number}  [windowOverscan] Renders windowOverscan number of items before and after the calculated visible window.
  * @property {boolean} [useWindowing]   When false avoids calculating the window size
  * @property {number}  [initWindowSize] Initial window size to use on first render before we can calculate the window size.
+ * @property {any}     [expandedState]  Used to recalculate the window size when the expanded state of a list changes.
  */
 
 /**
@@ -4551,43 +5774,31 @@
  * @param { WPFixedWindowListOptions }             [options]  Options object
  * @return {[ WPFixedWindowList, setFixedListWindow:(nextWindow:WPFixedWindowList)=>void]} Array with the fixed window list and setter
  */
-
 function useFixedWindowList(elementRef, itemHeight, totalItems, options) {
   var _options$initWindowSi, _options$useWindowing;
-
-  const initWindowSize = (_options$initWindowSi = options === null || options === void 0 ? void 0 : options.initWindowSize) !== null && _options$initWindowSi !== void 0 ? _options$initWindowSi : DEFAULT_INIT_WINDOW_SIZE;
-  const useWindowing = (_options$useWindowing = options === null || options === void 0 ? void 0 : options.useWindowing) !== null && _options$useWindowing !== void 0 ? _options$useWindowing : true;
+  const initWindowSize = (_options$initWindowSi = options?.initWindowSize) !== null && _options$initWindowSi !== void 0 ? _options$initWindowSi : DEFAULT_INIT_WINDOW_SIZE;
+  const useWindowing = (_options$useWindowing = options?.useWindowing) !== null && _options$useWindowing !== void 0 ? _options$useWindowing : true;
   const [fixedListWindow, setFixedListWindow] = (0,external_wp_element_namespaceObject.useState)({
     visibleItems: initWindowSize,
     start: 0,
     end: initWindowSize,
-    itemInView: (
-    /** @type {number} */
-    index) => {
+    itemInView: ( /** @type {number} */index) => {
       return index >= 0 && index <= initWindowSize;
     }
   });
   (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
-    var _scrollContainer$owne, _scrollContainer$owne2, _scrollContainer$owne3, _scrollContainer$owne4;
-
     if (!useWindowing) {
       return;
     }
-
     const scrollContainer = (0,external_wp_dom_namespaceObject.getScrollContainer)(elementRef.current);
-
-    const measureWindow = (
-    /** @type {boolean | undefined} */
-    initRender) => {
+    const measureWindow = ( /** @type {boolean | undefined} */initRender) => {
       var _options$windowOversc;
-
       if (!scrollContainer) {
         return;
       }
-
-      const visibleItems = Math.ceil(scrollContainer.clientHeight / itemHeight); // Aim to keep opening list view fast, afterward we can optimize for scrolling.
-
-      const windowOverscan = initRender ? visibleItems : (_options$windowOversc = options === null || options === void 0 ? void 0 : options.windowOverscan) !== null && _options$windowOversc !== void 0 ? _options$windowOversc : visibleItems;
+      const visibleItems = Math.ceil(scrollContainer.clientHeight / itemHeight);
+      // Aim to keep opening list view fast, afterward we can optimize for scrolling.
+      const windowOverscan = initRender ? visibleItems : (_options$windowOversc = options?.windowOverscan) !== null && _options$windowOversc !== void 0 ? _options$windowOversc : visibleItems;
       const firstViewableIndex = Math.floor(scrollContainer.scrollTop / itemHeight);
       const start = Math.max(0, firstViewableIndex - windowOverscan);
       const end = Math.min(totalItems - 1, firstViewableIndex + visibleItems + windowOverscan);
@@ -4596,129 +5807,151 @@
           visibleItems,
           start,
           end,
-          itemInView: (
-          /** @type {number} */
-          index) => {
+          itemInView: ( /** @type {number} */index) => {
             return start <= index && index <= end;
           }
         };
-
         if (lastWindow.start !== nextWindow.start || lastWindow.end !== nextWindow.end || lastWindow.visibleItems !== nextWindow.visibleItems) {
           return nextWindow;
         }
-
         return lastWindow;
       });
     };
-
     measureWindow(true);
-    const debounceMeasureList = (0,external_lodash_namespaceObject.debounce)(() => {
+    const debounceMeasureList = debounce(() => {
       measureWindow();
     }, 16);
-    scrollContainer === null || scrollContainer === void 0 ? void 0 : scrollContainer.addEventListener('scroll', debounceMeasureList);
-    scrollContainer === null || scrollContainer === void 0 ? void 0 : (_scrollContainer$owne = scrollContainer.ownerDocument) === null || _scrollContainer$owne === void 0 ? void 0 : (_scrollContainer$owne2 = _scrollContainer$owne.defaultView) === null || _scrollContainer$owne2 === void 0 ? void 0 : _scrollContainer$owne2.addEventListener('resize', debounceMeasureList);
-    scrollContainer === null || scrollContainer === void 0 ? void 0 : (_scrollContainer$owne3 = scrollContainer.ownerDocument) === null || _scrollContainer$owne3 === void 0 ? void 0 : (_scrollContainer$owne4 = _scrollContainer$owne3.defaultView) === null || _scrollContainer$owne4 === void 0 ? void 0 : _scrollContainer$owne4.addEventListener('resize', debounceMeasureList);
+    scrollContainer?.addEventListener('scroll', debounceMeasureList);
+    scrollContainer?.ownerDocument?.defaultView?.addEventListener('resize', debounceMeasureList);
+    scrollContainer?.ownerDocument?.defaultView?.addEventListener('resize', debounceMeasureList);
     return () => {
-      var _scrollContainer$owne5, _scrollContainer$owne6;
-
-      scrollContainer === null || scrollContainer === void 0 ? void 0 : scrollContainer.removeEventListener('scroll', debounceMeasureList);
-      scrollContainer === null || scrollContainer === void 0 ? void 0 : (_scrollContainer$owne5 = scrollContainer.ownerDocument) === null || _scrollContainer$owne5 === void 0 ? void 0 : (_scrollContainer$owne6 = _scrollContainer$owne5.defaultView) === null || _scrollContainer$owne6 === void 0 ? void 0 : _scrollContainer$owne6.removeEventListener('resize', debounceMeasureList);
+      scrollContainer?.removeEventListener('scroll', debounceMeasureList);
+      scrollContainer?.ownerDocument?.defaultView?.removeEventListener('resize', debounceMeasureList);
     };
-  }, [itemHeight, elementRef, totalItems]);
+  }, [itemHeight, elementRef, totalItems, options?.expandedState, options?.windowOverscan, useWindowing]);
   (0,external_wp_element_namespaceObject.useLayoutEffect)(() => {
-    var _scrollContainer$owne7, _scrollContainer$owne8;
-
     if (!useWindowing) {
       return;
     }
-
     const scrollContainer = (0,external_wp_dom_namespaceObject.getScrollContainer)(elementRef.current);
-
-    const handleKeyDown = (
-    /** @type {KeyboardEvent} */
-    event) => {
+    const handleKeyDown = ( /** @type {KeyboardEvent} */event) => {
       switch (event.keyCode) {
         case external_wp_keycodes_namespaceObject.HOME:
           {
-            return scrollContainer === null || scrollContainer === void 0 ? void 0 : scrollContainer.scrollTo({
+            return scrollContainer?.scrollTo({
               top: 0
             });
           }
-
         case external_wp_keycodes_namespaceObject.END:
           {
-            return scrollContainer === null || scrollContainer === void 0 ? void 0 : scrollContainer.scrollTo({
+            return scrollContainer?.scrollTo({
               top: totalItems * itemHeight
             });
           }
-
         case external_wp_keycodes_namespaceObject.PAGEUP:
           {
-            return scrollContainer === null || scrollContainer === void 0 ? void 0 : scrollContainer.scrollTo({
+            return scrollContainer?.scrollTo({
               top: scrollContainer.scrollTop - fixedListWindow.visibleItems * itemHeight
             });
           }
-
         case external_wp_keycodes_namespaceObject.PAGEDOWN:
           {
-            return scrollContainer === null || scrollContainer === void 0 ? void 0 : scrollContainer.scrollTo({
+            return scrollContainer?.scrollTo({
               top: scrollContainer.scrollTop + fixedListWindow.visibleItems * itemHeight
             });
           }
       }
     };
-
-    scrollContainer === null || scrollContainer === void 0 ? void 0 : (_scrollContainer$owne7 = scrollContainer.ownerDocument) === null || _scrollContainer$owne7 === void 0 ? void 0 : (_scrollContainer$owne8 = _scrollContainer$owne7.defaultView) === null || _scrollContainer$owne8 === void 0 ? void 0 : _scrollContainer$owne8.addEventListener('keydown', handleKeyDown);
+    scrollContainer?.ownerDocument?.defaultView?.addEventListener('keydown', handleKeyDown);
     return () => {
-      var _scrollContainer$owne9, _scrollContainer$owne10;
-
-      scrollContainer === null || scrollContainer === void 0 ? void 0 : (_scrollContainer$owne9 = scrollContainer.ownerDocument) === null || _scrollContainer$owne9 === void 0 ? void 0 : (_scrollContainer$owne10 = _scrollContainer$owne9.defaultView) === null || _scrollContainer$owne10 === void 0 ? void 0 : _scrollContainer$owne10.removeEventListener('keydown', handleKeyDown);
+      scrollContainer?.ownerDocument?.defaultView?.removeEventListener('keydown', handleKeyDown);
     };
-  }, [totalItems, itemHeight, elementRef, fixedListWindow.visibleItems]);
+  }, [totalItems, itemHeight, elementRef, fixedListWindow.visibleItems, useWindowing, options?.expandedState]);
   return [fixedListWindow, setFixedListWindow];
 }
 
+;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/hooks/use-observable-value/index.js
+/**
+ * WordPress dependencies
+ */
+
+
+/**
+ * Internal dependencies
+ */
+
+/**
+ * React hook that lets you observe an entry in an `ObservableMap`. The hook returns the
+ * current value corresponding to the key, or `undefined` when there is no value stored.
+ * It also observes changes to the value and triggers an update of the calling component
+ * in case the value changes.
+ *
+ * @template K    The type of the keys in the map.
+ * @template V    The type of the values in the map.
+ * @param    map  The `ObservableMap` to observe.
+ * @param    name The map key to observe.
+ * @return   The value corresponding to the map key requested.
+ */
+function useObservableValue(map, name) {
+  const [subscribe, getValue] = (0,external_wp_element_namespaceObject.useMemo)(() => [listener => map.subscribe(name, listener), () => map.get(name)], [map, name]);
+  return (0,external_wp_element_namespaceObject.useSyncExternalStore)(subscribe, getValue, getValue);
+}
+
 ;// CONCATENATED MODULE: ./node_modules/@wordpress/compose/build-module/index.js
-// Utils.
- // Compose helper (aliased flowRight from Lodash)
-
- // Higher-order components.
-
-
-
-
-
-
- // Hooks.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-}();
+// The `createHigherOrderComponent` helper and helper types.
+
+// The `debounce` helper and its types.
+
+// The `throttle` helper and its types.
+
+// The `ObservableMap` data structure
+
+
+// The `compose` and `pipe` helpers (inspired by `flowRight` and `flow` from Lodash).
+
+
+
+// Higher-order components.
+
+
+
+
+
+
+
+// Hooks.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+})();
+
 (window.wp = window.wp || {}).compose = __webpack_exports__;
 /******/ })()
 ;
\ No newline at end of file