@wordpress/block-editor/build-module/components/observe-typing/index.js

Generic block editor.

// packages/block-editor/src/components/observe-typing/index.js
import { useRefEffect, useMergeRefs } from "@wordpress/compose";
import { useSelect, useDispatch } from "@wordpress/data";
import { isTextField } from "@wordpress/dom";
import {
  UP,
  RIGHT,
  DOWN,
  LEFT,
  ENTER,
  BACKSPACE,
  ESCAPE,
  TAB
} from "@wordpress/keycodes";
import { store as blockEditorStore } from "../../store";
import { jsx } from "react/jsx-runtime";
var KEY_DOWN_ELIGIBLE_KEY_CODES = /* @__PURE__ */ new Set([
  UP,
  RIGHT,
  DOWN,
  LEFT,
  ENTER,
  BACKSPACE
]);
function isKeyDownEligibleForStartTyping(event) {
  const { keyCode, shiftKey } = event;
  return !shiftKey && KEY_DOWN_ELIGIBLE_KEY_CODES.has(keyCode);
}
function useMouseMoveTypingReset() {
  const isTyping = useSelect(
    (select) => select(blockEditorStore).isTyping(),
    []
  );
  const { stopTyping } = useDispatch(blockEditorStore);
  return useRefEffect(
    (node) => {
      if (!isTyping) {
        return;
      }
      const { ownerDocument } = node;
      let lastClientX;
      let lastClientY;
      function stopTypingOnMouseMove(event) {
        const { clientX, clientY } = event;
        if (lastClientX && lastClientY && (lastClientX !== clientX || lastClientY !== clientY)) {
          stopTyping();
        }
        lastClientX = clientX;
        lastClientY = clientY;
      }
      ownerDocument.addEventListener(
        "mousemove",
        stopTypingOnMouseMove
      );
      return () => {
        ownerDocument.removeEventListener(
          "mousemove",
          stopTypingOnMouseMove
        );
      };
    },
    [isTyping, stopTyping]
  );
}
function useTypingObserver() {
  const { isTyping } = useSelect((select) => {
    const { isTyping: _isTyping } = select(blockEditorStore);
    return {
      isTyping: _isTyping()
    };
  }, []);
  const { startTyping, stopTyping } = useDispatch(blockEditorStore);
  const ref1 = useMouseMoveTypingReset();
  const ref2 = useRefEffect(
    (node) => {
      const { ownerDocument } = node;
      const { defaultView } = ownerDocument;
      const selection = defaultView.getSelection();
      if (isTyping) {
        let stopTypingOnNonTextField2 = function(event) {
          const { target } = event;
          timerId = defaultView.setTimeout(() => {
            if (!isTextField(target)) {
              stopTyping();
            }
          });
        }, stopTypingOnEscapeKey2 = function(event) {
          const { keyCode } = event;
          if (keyCode === ESCAPE || keyCode === TAB) {
            stopTyping();
          }
        }, stopTypingOnSelectionUncollapse2 = function() {
          if (!selection.isCollapsed) {
            stopTyping();
          }
        };
        var stopTypingOnNonTextField = stopTypingOnNonTextField2, stopTypingOnEscapeKey = stopTypingOnEscapeKey2, stopTypingOnSelectionUncollapse = stopTypingOnSelectionUncollapse2;
        let timerId;
        node.addEventListener("focus", stopTypingOnNonTextField2);
        node.addEventListener("keydown", stopTypingOnEscapeKey2);
        ownerDocument.addEventListener(
          "selectionchange",
          stopTypingOnSelectionUncollapse2
        );
        return () => {
          defaultView.clearTimeout(timerId);
          node.removeEventListener(
            "focus",
            stopTypingOnNonTextField2
          );
          node.removeEventListener(
            "keydown",
            stopTypingOnEscapeKey2
          );
          ownerDocument.removeEventListener(
            "selectionchange",
            stopTypingOnSelectionUncollapse2
          );
        };
      }
      function startTypingInTextField(event) {
        const { type, target } = event;
        if (!isTextField(target) || !node.contains(target)) {
          return;
        }
        if (type === "keydown" && !isKeyDownEligibleForStartTyping(event)) {
          return;
        }
        startTyping();
      }
      node.addEventListener("keypress", startTypingInTextField);
      node.addEventListener("keydown", startTypingInTextField);
      return () => {
        node.removeEventListener("keypress", startTypingInTextField);
        node.removeEventListener("keydown", startTypingInTextField);
      };
    },
    [isTyping, startTyping, stopTyping]
  );
  return useMergeRefs([ref1, ref2]);
}
function ObserveTyping({ children }) {
  return /* @__PURE__ */ jsx("div", { ref: useTypingObserver(), children });
}
var observe_typing_default = ObserveTyping;
export {
  observe_typing_default as default,
  useMouseMoveTypingReset,
  useTypingObserver
};
//# sourceMappingURL=index.js.map