PluginProbe
Gutenberg / 24.1.0
Gutenberg v24.1.0
24.1.0 24.0.0 23.9.1 23.9.0 23.8.0 23.7.2 23.7.1 23.7.0 23.6.1 23.6.2 23.6.0 23.5.3 23.5.2 23.5.1 23.5.0 23.4.0 23.3.2 23.3.1 23.3.0 23.2.0 23.2.1 23.2.2 23.1.1 23.1.0 23.0.1 All 404 releases
← All changes | build/scripts/compose/index.js +370 -257 23.2.2 → 24.1.0 View file →
@@ -1,4 +1,5 @@
1 +(function() {
1 2 "use strict";
2 3 var wp;
3 4 (wp ||= {}).compose = (() => {
4 5 var __create = Object.create;
@@ -31,8 +32,15 @@
31 32 mod
32 33 ));
33 34 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
34 35
36 + // package-external:@wordpress/private-apis
37 + var require_private_apis = __commonJS({
38 + "package-external:@wordpress/private-apis"(exports, module) {
39 + module.exports = window.wp.privateApis;
40 + }
41 + });
42 +
35 43 // vendor-external:react/jsx-runtime
36 44 var require_jsx_runtime = __commonJS({
37 45 "vendor-external:react/jsx-runtime"(exports, module) {
38 46 module.exports = window.ReactJSXRuntime;
@@ -66,15 +74,8 @@
66 74 module.exports = window.wp.dom;
67 75 }
68 76 });
69 77
70 - // package-external:@wordpress/keycodes
71 - var require_keycodes = __commonJS({
72 - "package-external:@wordpress/keycodes"(exports, module) {
73 - module.exports = window.wp.keycodes;
74 - }
75 - });
76 -
77 78 // node_modules/mousetrap/mousetrap.js
78 79 var require_mousetrap = __commonJS({
79 80 "node_modules/mousetrap/mousetrap.js"(exports, module) {
80 81 (function(window2, document2, undefined2) {
@@ -528,8 +529,15 @@
528 529 })(typeof window !== "undefined" ? window : null, typeof window !== "undefined" ? document : null);
529 530 }
530 531 });
531 532
533 + // package-external:@wordpress/keycodes
534 + var require_keycodes = __commonJS({
535 + "package-external:@wordpress/keycodes"(exports, module) {
536 + module.exports = window.wp.keycodes;
537 + }
538 + });
539 +
532 540 // package-external:@wordpress/undo-manager
533 541 var require_undo_manager = __commonJS({
534 542 "package-external:@wordpress/undo-manager"(exports, module) {
535 543 module.exports = window.wp.undoManager;
@@ -563,8 +571,9 @@
563 571 debounce: () => debounce,
564 572 ifCondition: () => if_condition_default,
565 573 observableMap: () => observableMap,
566 574 pipe: () => pipe_default,
575 + privateApis: () => privateApis,
567 576 pure: () => pure_default,
568 577 throttle: () => throttle,
569 578 useAsyncList: () => use_async_list_default,
570 579 useConstrainedTabbing: () => use_constrained_tabbing_default,
@@ -838,8 +847,98 @@
838 847 }
839 848 };
840 849 }
841 850
851 + // packages/compose/build-module/lock-unlock.mjs
852 + var import_private_apis = __toESM(require_private_apis(), 1);
853 + var { lock, unlock } = (0, import_private_apis.__dangerousOptInToUnstableAPIsOnlyForCoreModules)(
854 + "I acknowledge private features are not for use in themes or plugins and doing so will break in the next version of WordPress.",
855 + "@wordpress/compose"
856 + );
857 +
858 + // packages/compose/build-module/utils/subscribe-delegated-listener/index.mjs
859 + var registries = /* @__PURE__ */ new WeakMap();
860 + function subscribeDelegatedListener(target, eventType, callback, capture = false) {
861 + const ownerDoc = target.ownerDocument;
862 + const root = ownerDoc ?? target;
863 + const isWindow = ownerDoc === void 0;
864 + let perRoot = registries.get(root);
865 + if (!perRoot) {
866 + perRoot = /* @__PURE__ */ new Map();
867 + registries.set(root, perRoot);
868 + }
869 + const key = capture ? `${eventType}:capture` : eventType;
870 + let perEvent = perRoot.get(key);
871 + if (!perEvent) {
872 + perEvent = /* @__PURE__ */ new WeakMap();
873 + perRoot.set(key, perEvent);
874 + const subscribers = perEvent;
875 + root.addEventListener(
876 + eventType,
877 + (event) => {
878 + if (isWindow) {
879 + const set2 = subscribers.get(root);
880 + if (set2) {
881 + for (const cb of set2) {
882 + cb(event);
883 + }
884 + }
885 + return;
886 + }
887 + if (capture) {
888 + const path = [];
889 + let current = event.target;
890 + while (current) {
891 + path.push(current);
892 + if (current === root) {
893 + break;
894 + }
895 + current = current.parentNode;
896 + }
897 + for (let i = path.length - 1; i >= 0; i--) {
898 + const set2 = subscribers.get(path[i]);
899 + if (set2) {
900 + for (const cb of set2) {
901 + cb(event);
902 + }
903 + }
904 + }
905 + } else {
906 + let current = event.target;
907 + while (current) {
908 + const set2 = subscribers.get(current);
909 + if (set2) {
910 + for (const cb of set2) {
911 + cb(event);
912 + }
913 + }
914 + if (current === root) {
915 + break;
916 + }
917 + current = current.parentNode;
918 + }
919 + }
920 + },
921 + capture
922 + );
923 + }
924 + let set = perEvent.get(target);
925 + if (!set) {
926 + set = /* @__PURE__ */ new Set();
927 + perEvent.set(target, set);
928 + }
929 + set.add(callback);
930 + return () => {
931 + set.delete(callback);
932 + };
933 + }
934 +
935 + // packages/compose/build-module/private-apis.mjs
936 + var privateApis = {};
937 + lock(privateApis, {
938 + subscribeDelegatedListener
939 + });
940 +
842 941 // packages/compose/build-module/higher-order/pipe.mjs
843 942 var basePipe = (reverse = false) => (...funcs) => (...args) => {
844 943 const functions = funcs.flat();
845 944 if (reverse) {
@@ -874,10 +973,15 @@
874 973
875 974 // packages/compose/build-module/higher-order/pure/index.mjs
876 975 var import_is_shallow_equal = __toESM(require_is_shallow_equal(), 1);
877 976 var import_element = __toESM(require_element(), 1);
977 + var import_deprecated = __toESM(require_deprecated(), 1);
878 978 var import_jsx_runtime2 = __toESM(require_jsx_runtime(), 1);
879 979 var pure = createHigherOrderComponent(function(WrappedComponent) {
980 + (0, import_deprecated.default)("wp.compose.pure", {
981 + since: "7.1",
982 + alternative: "Use `memo` or `PureComponent` instead"
983 + });
880 984 if (WrappedComponent.prototype instanceof import_element.Component) {
881 985 return class extends WrappedComponent {
882 986 shouldComponentUpdate(nextProps, nextState) {
883 987 return !(0, import_is_shallow_equal.isShallowEqual)(nextProps, this.props) || !(0, import_is_shallow_equal.isShallowEqual)(nextState, this.state);
@@ -896,9 +1000,9 @@
896 1000 var pure_default = pure;
897 1001
898 1002 // packages/compose/build-module/higher-order/with-global-events/index.mjs
899 1003 var import_element2 = __toESM(require_element(), 1);
900 - var import_deprecated = __toESM(require_deprecated(), 1);
1004 + var import_deprecated2 = __toESM(require_deprecated(), 1);
901 1005
902 1006 // packages/compose/build-module/higher-order/with-global-events/listener.mjs
903 1007 var Listener = class {
904 1008 constructor() {
@@ -937,9 +1041,9 @@
937 1041 // packages/compose/build-module/higher-order/with-global-events/index.mjs
938 1042 var import_jsx_runtime3 = __toESM(require_jsx_runtime(), 1);
939 1043 var listener = new listener_default();
940 1044 function withGlobalEvents(eventTypesToHandlers) {
941 - (0, import_deprecated.default)("wp.compose.withGlobalEvents", {
1045 + (0, import_deprecated2.default)("wp.compose.withGlobalEvents", {
942 1046 since: "5.7",
943 1047 alternative: "useEffect"
944 1048 });
945 1049 return createHigherOrderComponent((WrappedComponent) => {
@@ -1053,9 +1157,9 @@
1053 1157 );
1054 1158 }
1055 1159 render() {
1056 1160 return (
1057 - // @ts-ignore
1161 + // @ts-expect-error `LibraryManagedAttributes` cannot see the injected timeout props.
1058 1162 /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
1059 1163 OriginalComponent,
1060 1164 {
1061 1165 ...this.props,
@@ -1072,12 +1176,12 @@
1072 1176 var with_safe_timeout_default = withSafeTimeout;
1073 1177
1074 1178 // packages/compose/build-module/higher-order/with-state/index.mjs
1075 1179 var import_element5 = __toESM(require_element(), 1);
1076 - var import_deprecated2 = __toESM(require_deprecated(), 1);
1180 + var import_deprecated3 = __toESM(require_deprecated(), 1);
1077 1181 var import_jsx_runtime6 = __toESM(require_jsx_runtime(), 1);
1078 1182 function withState(initialState = {}) {
1079 - (0, import_deprecated2.default)("wp.compose.withState", {
1183 + (0, import_deprecated3.default)("wp.compose.withState", {
1080 1184 since: "5.8",
1081 1185 alternative: "wp.element.useState"
1082 1186 });
1083 1187 return createHigherOrderComponent((OriginalComponent) => {
@@ -1125,16 +1229,10 @@
1125 1229 if (key !== "Tab") {
1126 1230 return;
1127 1231 }
1128 1232 const action = shiftKey ? "findPrevious" : "findNext";
1129 - const nextElement = import_dom.focus.tabbable[action](
1130 - /** @type {HTMLElement} */
1131 - target
1132 - ) || null;
1133 - if (
1134 - /** @type {HTMLElement} */
1135 - target.contains(nextElement)
1136 - ) {
1233 + const nextElement = import_dom.focus.tabbable[action](target) || null;
1234 + if (target.contains(nextElement)) {
1137 1235 event.preventDefault();
1138 1236 nextElement?.focus();
1139 1237 return;
1140 1238 }
@@ -1158,9 +1256,9 @@
1158 1256 var use_constrained_tabbing_default = useConstrainedTabbing;
1159 1257
1160 1258 // packages/compose/build-module/hooks/use-copy-on-click/index.mjs
1161 1259 var import_element8 = __toESM(require_element(), 1);
1162 - var import_deprecated3 = __toESM(require_deprecated(), 1);
1260 + var import_deprecated4 = __toESM(require_deprecated(), 1);
1163 1261
1164 1262 // packages/compose/build-module/hooks/use-copy-to-clipboard/index.mjs
1165 1263 var import_element7 = __toESM(require_element(), 1);
1166 1264 async function copyToClipboard(text, trigger) {
@@ -1191,13 +1289,12 @@
1191 1289 } catch {
1192 1290 return false;
1193 1291 }
1194 1292 }
1195 - function clearSelection(trigger) {
1293 + function restoreFocus(trigger) {
1196 1294 if ("focus" in trigger && typeof trigger.focus === "function") {
1197 1295 trigger.focus();
1198 1296 }
1199 - trigger.ownerDocument?.defaultView?.getSelection()?.removeAllRanges();
1200 1297 }
1201 1298 function useUpdatedRef(value) {
1202 1299 const ref = (0, import_element7.useRef)(value);
1203 1300 (0, import_element7.useLayoutEffect)(() => {
@@ -1212,13 +1309,12 @@
1212 1309 let isActive = true;
1213 1310 const handleClick = async () => {
1214 1311 const textToCopy = typeof textRef.current === "function" ? textRef.current() : textRef.current || "";
1215 1312 const success = await copyToClipboard(textToCopy, node);
1216 - if (!isActive) {
1217 - return;
1218 - }
1219 1313 if (success) {
1220 - clearSelection(node);
1314 + if (isActive) {
1315 + restoreFocus(node);
1316 + }
1221 1317 if (onSuccessRef.current) {
1222 1318 onSuccessRef.current();
1223 1319 }
1224 1320 }
@@ -1232,9 +1328,9 @@
1232 1328 }
1233 1329
1234 1330 // packages/compose/build-module/hooks/use-copy-on-click/index.mjs
1235 1331 function useCopyOnClick(ref, text, timeout = 4e3) {
1236 - (0, import_deprecated3.default)("wp.compose.useCopyOnClick", {
1332 + (0, import_deprecated4.default)("wp.compose.useCopyOnClick", {
1237 1333 since: "5.8",
1238 1334 alternative: "wp.compose.useCopyToClipboard"
1239 1335 });
1240 1336 const [hasCopied, setHasCopied] = (0, import_element8.useState)(false);
@@ -1267,9 +1363,9 @@
1267 1363 if (!isActive) {
1268 1364 return;
1269 1365 }
1270 1366 if (success) {
1271 - clearSelection(trigger);
1367 + restoreFocus(trigger);
1272 1368 if (timeout) {
1273 1369 setHasCopied(true);
1274 1370 clearTimeout(timeoutId);
1275 1371 timeoutId = setTimeout(
@@ -1294,9 +1390,8 @@
1294 1390 }
1295 1391
1296 1392 // packages/compose/build-module/hooks/use-dialog/index.mjs
1297 1393 var import_element13 = __toESM(require_element(), 1);
1298 - var import_keycodes = __toESM(require_keycodes(), 1);
1299 1394
1300 1395 // packages/compose/build-module/hooks/use-focus-on-mount/index.mjs
1301 1396 var import_dom2 = __toESM(require_dom(), 1);
1302 1397 var import_element9 = __toESM(require_element(), 1);
@@ -1349,10 +1444,12 @@
1349 1444 var import_element10 = __toESM(require_element(), 1);
1350 1445 var origin = null;
1351 1446 function useFocusReturn(onFocusReturn) {
1352 1447 const ref = (0, import_element10.useRef)(null);
1353 - const focusedBeforeMount = (0, import_element10.useRef)(null);
1354 - const onFocusReturnRef = (0, import_element10.useRef)(onFocusReturn);
1448 + const focusedBeforeMountRef = (0, import_element10.useRef)(null);
1449 + const onFocusReturnRef = (0, import_element10.useRef)(
1450 + onFocusReturn
1451 + );
1355 1452 (0, import_element10.useEffect)(() => {
1356 1453 onFocusReturnRef.current = onFocusReturn;
1357 1454 }, [onFocusReturn]);
1358 1455 return (0, import_element10.useCallback)((node) => {
@@ -1357,25 +1454,26 @@
1357 1454 }, [onFocusReturn]);
1358 1455 return (0, import_element10.useCallback)((node) => {
1359 1456 if (node) {
1360 1457 ref.current = node;
1361 - if (focusedBeforeMount.current) {
1458 + if (focusedBeforeMountRef.current) {
1362 1459 return;
1363 1460 }
1364 1461 const activeDocument = node.ownerDocument.activeElement instanceof window.HTMLIFrameElement ? node.ownerDocument.activeElement.contentDocument : node.ownerDocument;
1365 - focusedBeforeMount.current = activeDocument?.activeElement ?? null;
1366 - } else if (focusedBeforeMount.current) {
1462 + focusedBeforeMountRef.current = activeDocument?.activeElement ?? null;
1463 + } else if (focusedBeforeMountRef.current) {
1367 1464 const isFocused = ref.current?.contains(
1368 - ref.current?.ownerDocument.activeElement
1465 + ref.current?.ownerDocument.activeElement ?? null
1369 1466 );
1370 1467 if (ref.current?.isConnected && !isFocused) {
1371 - origin ??= focusedBeforeMount.current;
1468 + origin ??= focusedBeforeMountRef.current;
1372 1469 return;
1373 1470 }
1374 1471 if (onFocusReturnRef.current) {
1375 1472 onFocusReturnRef.current();
1376 1473 } else {
1377 - (!focusedBeforeMount.current.isConnected ? origin : focusedBeforeMount.current)?.focus();
1474 + const elementToFocus = !focusedBeforeMountRef.current.isConnected ? origin : focusedBeforeMountRef.current;
1475 + elementToFocus?.focus();
1378 1476 }
1379 1477 origin = null;
1380 1478 }
1381 1479 }, []);
@@ -1434,8 +1532,9 @@
1434 1532 );
1435 1533 if (ignoreForRelatedTarget && event.relatedTarget?.closest(ignoreForRelatedTarget)) {
1436 1534 return;
1437 1535 }
1536 + clearTimeout(blurCheckTimeoutIdRef.current);
1438 1537 blurCheckTimeoutIdRef.current = setTimeout(() => {
1439 1538 if (!document.hasFocus()) {
1440 1539 event.preventDefault();
1441 1540 return;
@@ -1458,42 +1557,56 @@
1458 1557 // packages/compose/build-module/hooks/use-merge-refs/index.mjs
1459 1558 var import_element12 = __toESM(require_element(), 1);
1460 1559 function assignRef(ref, value) {
1461 1560 if (typeof ref === "function") {
1462 - ref(value);
1561 + const returned = ref(value);
1562 + return typeof returned === "function" ? returned : void 0;
1463 1563 } else if (ref && ref.hasOwnProperty("current")) {
1464 1564 ref.current = value;
1465 1565 }
1566 + return void 0;
1466 1567 }
1568 + function detachRef(ref, index, cleanups) {
1569 + const cleanup = cleanups[index];
1570 + if (cleanup) {
1571 + cleanups[index] = void 0;
1572 + cleanup();
1573 + } else {
1574 + assignRef(ref, null);
1575 + }
1576 + }
1467 1577 function useMergeRefs(refs) {
1468 - const element = (0, import_element12.useRef)(null);
1469 - const isAttachedRef = (0, import_element12.useRef)(false);
1470 - const didElementChangeRef = (0, import_element12.useRef)(false);
1471 - const previousRefsRef = (0, import_element12.useRef)([]);
1578 + const elementRef = (0, import_element12.useRef)(null);
1579 + const attachedRefsRef = (0, import_element12.useRef)([]);
1472 1580 const currentRefsRef = (0, import_element12.useRef)(refs);
1581 + const cleanupsRef = (0, import_element12.useRef)([]);
1473 1582 currentRefsRef.current = refs;
1474 1583 (0, import_element12.useLayoutEffect)(() => {
1475 - if (didElementChangeRef.current === false && isAttachedRef.current === true) {
1476 - refs.forEach((ref, index) => {
1477 - const previousRef = previousRefsRef.current[index];
1478 - if (ref !== previousRef) {
1479 - assignRef(previousRef, null);
1480 - assignRef(ref, element.current);
1481 - }
1482 - });
1584 + const element = elementRef.current;
1585 + if (element === null) {
1586 + return;
1483 1587 }
1484 - previousRefsRef.current = refs;
1588 + refs.forEach((ref, index) => {
1589 + const attachedRef = attachedRefsRef.current[index];
1590 + if (ref !== attachedRef) {
1591 + detachRef(attachedRef, index, cleanupsRef.current);
1592 + cleanupsRef.current[index] = assignRef(ref, element);
1593 + }
1594 + });
1595 + attachedRefsRef.current = refs;
1485 1596 }, refs);
1486 - (0, import_element12.useLayoutEffect)(() => {
1487 - didElementChangeRef.current = false;
1488 - });
1489 1597 return (0, import_element12.useCallback)((value) => {
1490 - assignRef(element, value);
1491 - didElementChangeRef.current = true;
1492 - isAttachedRef.current = value !== null;
1493 - const refsToAssign = value ? currentRefsRef.current : previousRefsRef.current;
1494 - for (const ref of refsToAssign) {
1495 - assignRef(ref, value);
1598 + elementRef.current = value;
1599 + if (value === null) {
1600 + attachedRefsRef.current.forEach((ref, index) => {
1601 + detachRef(ref, index, cleanupsRef.current);
1602 + });
1603 + attachedRefsRef.current = [];
1604 + } else {
1605 + attachedRefsRef.current = currentRefsRef.current;
1606 + attachedRefsRef.current.forEach((ref, index) => {
1607 + cleanupsRef.current[index] = assignRef(ref, value);
1608 + });
1496 1609 }
1497 1610 }, []);
1498 1611 }
1499 1612
@@ -1513,29 +1626,25 @@
1513 1626 } else if (currentOptions.current?.onClose) {
1514 1627 currentOptions.current.onClose();
1515 1628 }
1516 1629 });
1517 - const closeOnEscapeRef = (0, import_element13.useCallback)((node) => {
1518 - if (!node) {
1519 - return;
1630 + const onKeyDown = (0, import_element13.useCallback)((event) => {
1631 + currentOptions.current?.onKeyDown?.(event);
1632 + if (event.key === "Escape" && !event.defaultPrevented && currentOptions.current?.onClose) {
1633 + event.preventDefault();
1634 + event.stopPropagation();
1635 + currentOptions.current.onClose();
1520 1636 }
1521 - node.addEventListener("keydown", (event) => {
1522 - if (event.keyCode === import_keycodes.ESCAPE && !event.defaultPrevented && currentOptions.current?.onClose) {
1523 - event.preventDefault();
1524 - event.stopPropagation();
1525 - currentOptions.current.onClose();
1526 - }
1527 - });
1528 1637 }, []);
1529 1638 return [
1530 1639 useMergeRefs([
1531 1640 constrainTabbing ? constrainedTabbingRef : null,
1532 1641 options.focusOnMount !== false ? focusReturnRef : null,
1533 - options.focusOnMount !== false ? focusOnMountRef : null,
1534 - closeOnEscapeRef
1642 + options.focusOnMount !== false ? focusOnMountRef : null
1535 1643 ]),
1536 1644 {
1537 1645 ...focusOutsideProps,
1646 + onKeyDown,
1538 1647 tabIndex: -1
1539 1648 }
1540 1649 ];
1541 1650 }
@@ -1613,9 +1722,13 @@
1613 1722 var useIsomorphicLayoutEffect = typeof window !== "undefined" ? import_element15.useLayoutEffect : import_element15.useEffect;
1614 1723 var use_isomorphic_layout_effect_default = useIsomorphicLayoutEffect;
1615 1724
1616 1725 // packages/compose/build-module/hooks/use-dragging/index.mjs
1617 - function useDragging({ onDragStart, onDragMove, onDragEnd }) {
1726 + function useDragging({
1727 + onDragStart,
1728 + onDragMove,
1729 + onDragEnd
1730 + }) {
1618 1731 const [isDragging, setIsDragging] = (0, import_element16.useState)(false);
1619 1732 const eventsRef = (0, import_element16.useRef)({
1620 1733 onDragStart,
1621 1734 onDragMove,
@@ -1625,28 +1738,29 @@
1625 1738 eventsRef.current.onDragStart = onDragStart;
1626 1739 eventsRef.current.onDragMove = onDragMove;
1627 1740 eventsRef.current.onDragEnd = onDragEnd;
1628 1741 }, [onDragStart, onDragMove, onDragEnd]);
1629 - const onMouseMove = (0, import_element16.useCallback)(
1630 - (event) => eventsRef.current.onDragMove && eventsRef.current.onDragMove(event),
1631 - []
1742 + const onMouseMove = (0, import_element16.useCallback)((event) => {
1743 + eventsRef.current.onDragMove?.(event);
1744 + }, []);
1745 + const endDrag = (0, import_element16.useCallback)(
1746 + function endDrag2(event) {
1747 + eventsRef.current.onDragEnd?.(event);
1748 + document.removeEventListener("mousemove", onMouseMove);
1749 + document.removeEventListener("mouseup", endDrag2);
1750 + setIsDragging(false);
1751 + },
1752 + [onMouseMove]
1632 1753 );
1633 - const endDrag = (0, import_element16.useCallback)((event) => {
1634 - if (eventsRef.current.onDragEnd) {
1635 - eventsRef.current.onDragEnd(event);
1636 - }
1637 - document.removeEventListener("mousemove", onMouseMove);
1638 - document.removeEventListener("mouseup", endDrag);
1639 - setIsDragging(false);
1640 - }, []);
1641 - const startDrag = (0, import_element16.useCallback)((event) => {
1642 - if (eventsRef.current.onDragStart) {
1643 - eventsRef.current.onDragStart(event);
1644 - }
1645 - document.addEventListener("mousemove", onMouseMove);
1646 - document.addEventListener("mouseup", endDrag);
1647 - setIsDragging(true);
1648 - }, []);
1754 + const startDrag = (0, import_element16.useCallback)(
1755 + (event) => {
1756 + eventsRef.current.onDragStart?.(event);
1757 + document.addEventListener("mousemove", onMouseMove);
1758 + document.addEventListener("mouseup", endDrag);
1759 + setIsDragging(true);
1760 + },
1761 + [onMouseMove, endDrag]
1762 + );
1649 1763 (0, import_element16.useEffect)(() => {
1650 1764 return () => {
1651 1765 if (isDragging) {
1652 1766 document.removeEventListener("mousemove", onMouseMove);
@@ -1652,9 +1766,9 @@
1652 1766 document.removeEventListener("mousemove", onMouseMove);
1653 1767 document.removeEventListener("mouseup", endDrag);
1654 1768 }
1655 1769 };
1656 - }, [isDragging]);
1770 + }, [isDragging, onMouseMove, endDrag]);
1657 1771 return {
1658 1772 startDrag,
1659 1773 endDrag,
1660 1774 isDragging
@@ -1696,14 +1810,13 @@
1696 1810 })(typeof Mousetrap !== "undefined" ? Mousetrap : void 0);
1697 1811
1698 1812 // packages/compose/build-module/hooks/use-keyboard-shortcut/index.mjs
1699 1813 var import_element17 = __toESM(require_element(), 1);
1700 - var import_keycodes2 = __toESM(require_keycodes(), 1);
1814 + var import_keycodes = __toESM(require_keycodes(), 1);
1701 1815 function useKeyboardShortcut(shortcuts, callback, {
1702 1816 bindGlobal = false,
1703 1817 eventName = "keydown",
1704 1818 isDisabled = false,
1705 - // This is important for performance considerations.
1706 1819 target
1707 1820 } = {}) {
1708 1821 const currentCallbackRef = (0, import_element17.useRef)(callback);
1709 1822 (0, import_element17.useEffect)(() => {
@@ -1717,10 +1830,8 @@
1717 1830 target && target.current ? target.current : (
1718 1831 // We were passing `document` here previously, so to successfully cast it to Element we must cast it first to `unknown`.
1719 1832 // 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
1720 1833 // necessary to maintain the existing behavior.
1721 - /** @type {Element} */
1722 - /** @type {unknown} */
1723 1834 document
1724 1835 )
1725 1836 );
1726 1837 const shortcutsArray = Array.isArray(shortcuts) ? shortcuts : [shortcuts];
@@ -1730,9 +1841,9 @@
1730 1841 keys.filter((value) => value.length > 1)
1731 1842 );
1732 1843 const hasAlt = modifiers.has("alt");
1733 1844 const hasShift = modifiers.has("shift");
1734 - if ((0, import_keycodes2.isAppleOS)() && (modifiers.size === 1 && hasAlt || modifiers.size === 2 && hasAlt && hasShift)) {
1845 + if ((0, import_keycodes.isAppleOS)() && (modifiers.size === 1 && hasAlt || modifiers.size === 2 && hasAlt && hasShift)) {
1735 1846 throw new Error(
1736 1847 `Cannot bind ${shortcut}. Alt and Shift+Alt modifiers are reserved for character input.`
1737 1848 );
1738 1849 }
@@ -1752,49 +1863,55 @@
1752 1863
1753 1864 // packages/compose/build-module/hooks/use-media-query/index.mjs
1754 1865 var import_element18 = __toESM(require_element(), 1);
1755 1866 var perWindowCache = /* @__PURE__ */ new WeakMap();
1756 - function getMediaQueryList(view, query) {
1757 - if (!query) {
1758 - return null;
1867 + var EMPTY_SUBSCRIBER = {
1868 + subscribe: () => () => {
1869 + },
1870 + getValue: () => false
1871 + };
1872 + function getMQLSubscriber(view, query) {
1873 + if (!view || !query || typeof view.matchMedia !== "function") {
1874 + return EMPTY_SUBSCRIBER;
1759 1875 }
1760 - const matchMediaCache = perWindowCache.get(view) ?? /* @__PURE__ */ new Map();
1761 - if (!perWindowCache.has(view)) {
1762 - perWindowCache.set(view, matchMediaCache);
1876 + let queryCache = perWindowCache.get(view);
1877 + if (!queryCache) {
1878 + queryCache = /* @__PURE__ */ new Map();
1879 + perWindowCache.set(view, queryCache);
1763 1880 }
1764 - let match = matchMediaCache.get(query);
1765 - if (match) {
1766 - return match;
1881 + const cached = queryCache.get(query);
1882 + if (cached) {
1883 + return cached;
1767 1884 }
1768 - if (typeof view?.matchMedia === "function") {
1769 - match = view.matchMedia(query);
1770 - matchMediaCache.set(query, match);
1771 - return match;
1772 - }
1773 - return null;
1885 + const mediaQueryList = view.matchMedia(query);
1886 + const listeners = /* @__PURE__ */ new Set();
1887 + const notify = () => {
1888 + for (const listener2 of listeners) {
1889 + listener2();
1890 + }
1891 + };
1892 + const subscriber = {
1893 + subscribe(onStoreChange) {
1894 + if (listeners.size === 0) {
1895 + mediaQueryList.addEventListener?.("change", notify);
1896 + }
1897 + listeners.add(onStoreChange);
1898 + return () => {
1899 + listeners.delete(onStoreChange);
1900 + if (listeners.size === 0) {
1901 + mediaQueryList.removeEventListener?.("change", notify);
1902 + }
1903 + };
1904 + },
1905 + getValue() {
1906 + return mediaQueryList.matches;
1907 + }
1908 + };
1909 + queryCache.set(query, subscriber);
1910 + return subscriber;
1774 1911 }
1775 - function useMediaQuery(query, view = window) {
1776 - const source = (0, import_element18.useMemo)(() => {
1777 - const mediaQueryList = getMediaQueryList(view, query);
1778 - return {
1779 - subscribe(onStoreChange) {
1780 - if (!mediaQueryList) {
1781 - return () => {
1782 - };
1783 - }
1784 - mediaQueryList.addEventListener?.("change", onStoreChange);
1785 - return () => {
1786 - mediaQueryList.removeEventListener?.(
1787 - "change",
1788 - onStoreChange
1789 - );
1790 - };
1791 - },
1792 - getValue() {
1793 - return mediaQueryList?.matches ?? false;
1794 - }
1795 - };
1796 - }, [view, query]);
1912 + function useMediaQuery(query, view = typeof window !== "undefined" ? window : void 0) {
1913 + const source = getMQLSubscriber(view, query);
1797 1914 return (0, import_element18.useSyncExternalStore)(
1798 1915 source.subscribe,
1799 1916 source.getValue,
1800 1917 () => false
@@ -1911,16 +2028,13 @@
1911 2028 var OPERATOR_EVALUATORS = {
1912 2029 ">=": (breakpointValue, width) => width >= breakpointValue,
1913 2030 "<": (breakpointValue, width) => width < breakpointValue
1914 2031 };
1915 - var ViewportMatchWidthContext = (0, import_element21.createContext)(
1916 - /** @type {null | number} */
1917 - null
1918 - );
2032 + var ViewportMatchWidthContext = (0, import_element21.createContext)(null);
1919 2033 ViewportMatchWidthContext.displayName = "ViewportMatchWidthContext";
1920 - var useViewportMatch = (breakpoint, operator = ">=", view = window) => {
2034 + var useViewportMatch = (breakpoint, operator = ">=", view = typeof window !== "undefined" ? window : void 0) => {
1921 2035 const simulatedWidth = (0, import_element21.useContext)(ViewportMatchWidthContext);
1922 - const mediaQuery = !simulatedWidth && `(${CONDITIONS[operator]}: ${BREAKPOINTS[breakpoint]}px)`;
2036 + const mediaQuery = !simulatedWidth && `screen and (${CONDITIONS[operator]}: ${BREAKPOINTS[breakpoint]}px)`;
1923 2037 const mediaQueryResult = useMediaQuery(mediaQuery || void 0, view);
1924 2038 if (simulatedWidth) {
1925 2039 return OPERATOR_EVALUATORS[operator](
1926 2040 BREAKPOINTS[breakpoint],
@@ -1937,8 +2051,17 @@
1937 2051 function useResizeObserver(callback, resizeObserverOptions = {}) {
1938 2052 const callbackEvent = useEvent(callback);
1939 2053 const observedElementRef = (0, import_element22.useRef)(null);
1940 2054 const resizeObserverRef = (0, import_element22.useRef)(void 0);
2055 + (0, import_element22.useEffect)(() => {
2056 + if (observedElementRef.current) {
2057 + resizeObserverRef.current?.observe(
2058 + observedElementRef.current,
2059 + resizeObserverOptions
2060 + );
2061 + }
2062 + return () => resizeObserverRef.current?.disconnect();
2063 + }, []);
1941 2064 return useEvent((element) => {
1942 2065 if (element === observedElementRef.current) {
1943 2066 return;
1944 2067 }
@@ -2063,20 +2186,13 @@
2063 2186 // packages/compose/build-module/hooks/use-warn-on-change/index.mjs
2064 2187 function useWarnOnChange(object, prefix = "Change detection") {
2065 2188 const previousValues = usePrevious(object);
2066 2189 Object.entries(previousValues ?? []).forEach(([key, value]) => {
2067 - if (value !== object[
2068 - /** @type {keyof typeof object} */
2069 - key
2070 - ]) {
2190 + if (value !== object[key]) {
2071 2191 console.warn(
2072 2192 `${prefix}: ${key} key changed:`,
2073 2193 value,
2074 - object[
2075 - /** @type {keyof typeof object} */
2076 - key
2077 - ]
2078 - /* eslint-enable jsdoc/check-types */
2194 + object[key]
2079 2195 );
2080 2196 }
2081 2197 });
2082 2198 }
@@ -2198,12 +2314,9 @@
2198 2314 }
2199 2315 }
2200 2316 function onDragEnter(event) {
2201 2317 event.preventDefault();
2202 - if (element.contains(
2203 - /** @type {Node} */
2204 - event.relatedTarget
2205 - )) {
2318 + if (element.contains(event.relatedTarget)) {
2206 2319 return;
2207 2320 }
2208 2321 if (_onDragEnter) {
2209 2322 onDragEnterEvent(event);
@@ -2295,87 +2408,102 @@
2295 2408
2296 2409 // packages/compose/build-module/hooks/use-fixed-window-list/index.mjs
2297 2410 var import_element28 = __toESM(require_element(), 1);
2298 2411 var import_dom3 = __toESM(require_dom(), 1);
2299 - var import_keycodes3 = __toESM(require_keycodes(), 1);
2412 + var import_keycodes2 = __toESM(require_keycodes(), 1);
2300 2413 var DEFAULT_INIT_WINDOW_SIZE = 30;
2301 2414 function useFixedWindowList(elementRef, itemHeight, totalItems, options) {
2302 - const initWindowSize = options?.initWindowSize ?? DEFAULT_INIT_WINDOW_SIZE;
2303 - const useWindowing = options?.useWindowing ?? true;
2304 - const [fixedListWindow, setFixedListWindow] = (0, import_element28.useState)({
2305 - visibleItems: initWindowSize,
2306 - start: 0,
2307 - end: initWindowSize,
2308 - itemInView: (index) => {
2309 - return index >= 0 && index <= initWindowSize;
2415 + const {
2416 + windowOverscan,
2417 + useWindowing = true,
2418 + initWindowSize = DEFAULT_INIT_WINDOW_SIZE,
2419 + expandedState
2420 + } = options ?? {};
2421 + const [fixedListWindow, setFixedListWindow] = (0, import_element28.useState)(
2422 + {
2423 + visibleItems: initWindowSize,
2424 + start: 0,
2425 + end: initWindowSize,
2426 + itemInView: (index) => {
2427 + return index >= 0 && index <= initWindowSize;
2428 + }
2310 2429 }
2430 + );
2431 + const visibleItemsRef = (0, import_element28.useRef)(initWindowSize);
2432 + const isFirstMeasurementRef = (0, import_element28.useRef)(true);
2433 + const measureWindow = useEvent((initRender) => {
2434 + const scrollContainer = (0, import_dom3.getScrollContainer)(elementRef.current);
2435 + if (!scrollContainer) {
2436 + return;
2437 + }
2438 + const visibleItems = Math.ceil(
2439 + scrollContainer.clientHeight / itemHeight
2440 + );
2441 + visibleItemsRef.current = visibleItems;
2442 + const isFirstMeasurement = isFirstMeasurementRef.current;
2443 + isFirstMeasurementRef.current = false;
2444 + const overscan = initRender ? visibleItems : windowOverscan ?? visibleItems;
2445 + const firstViewableIndex = Math.floor(
2446 + scrollContainer.scrollTop / itemHeight
2447 + );
2448 + const start = Math.max(0, firstViewableIndex - overscan);
2449 + const end = Math.min(
2450 + totalItems - 1,
2451 + firstViewableIndex + visibleItems + overscan
2452 + );
2453 + setFixedListWindow((lastWindow) => {
2454 + if (lastWindow.start <= start && lastWindow.end >= end) {
2455 + return lastWindow;
2456 + }
2457 + if (isFirstMeasurement && lastWindow.start <= firstViewableIndex && lastWindow.end >= firstViewableIndex + visibleItems) {
2458 + return lastWindow;
2459 + }
2460 + return {
2461 + visibleItems,
2462 + start,
2463 + end,
2464 + itemInView: (index) => {
2465 + return start <= index && index <= end;
2466 + }
2467 + };
2468 + });
2311 2469 });
2470 + const handleKeyDown = useEvent(
2471 + (event, scrollContainer) => {
2472 + switch (event.keyCode) {
2473 + case import_keycodes2.HOME: {
2474 + return scrollContainer.scrollTo({ top: 0 });
2475 + }
2476 + case import_keycodes2.END: {
2477 + return scrollContainer.scrollTo({
2478 + top: totalItems * itemHeight
2479 + });
2480 + }
2481 + case import_keycodes2.PAGEUP: {
2482 + return scrollContainer.scrollTo({
2483 + top: scrollContainer.scrollTop - visibleItemsRef.current * itemHeight
2484 + });
2485 + }
2486 + case import_keycodes2.PAGEDOWN: {
2487 + return scrollContainer.scrollTo({
2488 + top: scrollContainer.scrollTop + visibleItemsRef.current * itemHeight
2489 + });
2490 + }
2491 + }
2492 + }
2493 + );
2312 2494 (0, import_element28.useLayoutEffect)(() => {
2313 2495 if (!useWindowing) {
2314 2496 return;
2315 2497 }
2316 - const scrollContainer = (0, import_dom3.getScrollContainer)(elementRef.current);
2317 - const measureWindow = (initRender) => {
2318 - if (!scrollContainer) {
2319 - return;
2320 - }
2321 - const visibleItems = Math.ceil(
2322 - scrollContainer.clientHeight / itemHeight
2323 - );
2324 - const windowOverscan = initRender ? visibleItems : options?.windowOverscan ?? visibleItems;
2325 - const firstViewableIndex = Math.floor(
2326 - scrollContainer.scrollTop / itemHeight
2327 - );
2328 - const start = Math.max(0, firstViewableIndex - windowOverscan);
2329 - const end = Math.min(
2330 - totalItems - 1,
2331 - firstViewableIndex + visibleItems + windowOverscan
2332 - );
2333 - setFixedListWindow((lastWindow) => {
2334 - const nextWindow = {
2335 - visibleItems,
2336 - start,
2337 - end,
2338 - itemInView: (index) => {
2339 - return start <= index && index <= end;
2340 - }
2341 - };
2342 - if (lastWindow.start !== nextWindow.start || lastWindow.end !== nextWindow.end || lastWindow.visibleItems !== nextWindow.visibleItems) {
2343 - return nextWindow;
2344 - }
2345 - return lastWindow;
2346 - });
2347 - };
2348 2498 measureWindow(true);
2349 - const debounceMeasureList = debounce(() => {
2350 - measureWindow();
2351 - }, 16);
2352 - scrollContainer?.addEventListener("scroll", debounceMeasureList);
2353 - scrollContainer?.ownerDocument?.defaultView?.addEventListener(
2354 - "resize",
2355 - debounceMeasureList
2356 - );
2357 - scrollContainer?.ownerDocument?.defaultView?.addEventListener(
2358 - "resize",
2359 - debounceMeasureList
2360 - );
2361 - return () => {
2362 - scrollContainer?.removeEventListener(
2363 - "scroll",
2364 - debounceMeasureList
2365 - );
2366 - scrollContainer?.ownerDocument?.defaultView?.removeEventListener(
2367 - "resize",
2368 - debounceMeasureList
2369 - );
2370 - };
2371 2499 }, [
2500 + useWindowing,
2501 + measureWindow,
2372 2502 itemHeight,
2373 - elementRef,
2374 2503 totalItems,
2375 - options?.expandedState,
2376 - options?.windowOverscan,
2377 - useWindowing
2504 + windowOverscan,
2505 + expandedState
2378 2506 ]);
2379 2507 (0, import_element28.useLayoutEffect)(() => {
2380 2508 if (!useWindowing) {
2381 2509 return;
@@ -2380,47 +2508,30 @@
2380 2508 if (!useWindowing) {
2381 2509 return;
2382 2510 }
2383 2511 const scrollContainer = (0, import_dom3.getScrollContainer)(elementRef.current);
2384 - const handleKeyDown = (event) => {
2385 - switch (event.keyCode) {
2386 - case import_keycodes3.HOME: {
2387 - return scrollContainer?.scrollTo({ top: 0 });
2388 - }
2389 - case import_keycodes3.END: {
2390 - return scrollContainer?.scrollTo({
2391 - top: totalItems * itemHeight
2392 - });
2393 - }
2394 - case import_keycodes3.PAGEUP: {
2395 - return scrollContainer?.scrollTo({
2396 - top: scrollContainer.scrollTop - fixedListWindow.visibleItems * itemHeight
2397 - });
2398 - }
2399 - case import_keycodes3.PAGEDOWN: {
2400 - return scrollContainer?.scrollTo({
2401 - top: scrollContainer.scrollTop + fixedListWindow.visibleItems * itemHeight
2402 - });
2403 - }
2404 - }
2405 - };
2406 - scrollContainer?.ownerDocument?.defaultView?.addEventListener(
2407 - "keydown",
2408 - handleKeyDown
2409 - );
2512 + if (!scrollContainer) {
2513 + return;
2514 + }
2515 + const { defaultView } = scrollContainer.ownerDocument;
2516 + const onMeasure = () => measureWindow();
2517 + const onKeyDown = (event) => handleKeyDown(event, scrollContainer);
2518 + scrollContainer.addEventListener("scroll", onMeasure);
2519 + defaultView?.addEventListener("resize", onMeasure);
2520 + defaultView?.addEventListener("keydown", onKeyDown);
2410 2521 return () => {
2411 - scrollContainer?.ownerDocument?.defaultView?.removeEventListener(
2412 - "keydown",
2413 - handleKeyDown
2414 - );
2522 + scrollContainer.removeEventListener("scroll", onMeasure);
2523 + defaultView?.removeEventListener("resize", onMeasure);
2524 + defaultView?.removeEventListener("keydown", onKeyDown);
2415 2525 };
2416 2526 }, [
2527 + useWindowing,
2528 + elementRef,
2529 + itemHeight,
2417 2530 totalItems,
2418 - itemHeight,
2419 - elementRef,
2420 - fixedListWindow.visibleItems,
2421 - useWindowing,
2422 - options?.expandedState
2531 + expandedState,
2532 + measureWindow,
2533 + handleKeyDown
2423 2534 ]);
2424 2535 return [fixedListWindow, setFixedListWindow];
2425 2536 }
2426 2537
@@ -2436,6 +2547,8 @@
2436 2547 );
2437 2548 return (0, import_element29.useSyncExternalStore)(subscribe, getValue, getValue);
2438 2549 }
2439 2550 return __toCommonJS(index_exports);
2551 +})();
2552 +(window.wp ||= {}).compose = wp.compose;
2440 2553 })();
2441 2554 //# sourceMappingURL=index.js.map