@oceanbase/ui/es/Highlight/useKeyDownCopyEvent.js

The UI library based on OceanBase Design

function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
import React, { useEffect } from 'react';

/**
 * 为 Highlight 添加 focus 时可以按键全选的能力
 * @param codeRef: React.RefObject<HTMLPreElement>
 */

export var useKeyDownCopyEvent = function useKeyDownCopyEvent(codeRef) {
  // focus能力支持
  var _focus = React.useRef();
  function bindEvent(events, dom) {
    Object.keys(events).forEach(function (key) {
      if (_typeof(events[key]) === 'object' && events[key].handle) {
        dom.addEventListener(key, events[key].handle, events[key].options);
      } else {
        dom.addEventListener(key, events[key]);
      }
    });
    return function () {
      Object.keys(events).forEach(function (key) {
        if (_typeof(events[key]) === 'object' && events[key].handle) {
          dom.removeEventListener(key, events[key].handle, events[key].options);
        } else {
          dom.removeEventListener(key, events[key]);
        }
      });
    };
  }
  useEffect(function () {
    if (codeRef.current) {
      return bindEvent({
        keydown: function keydown(ev) {
          var selection = window.getSelection();
          // 拦截ctrl + a 并判断是否 focus
          if ((ev.ctrlKey || ev.metaKey) && ev.code === 'KeyA' && _focus.current && codeRef.current) {
            var range = document.createRange();
            range.selectNodeContents(codeRef.current);
            selection.removeAllRanges();
            selection.addRange(range);
            ev.preventDefault();
          }
        },
        focus: function focus() {
          _focus.current = true;
        },
        blur: function blur() {
          _focus.current = false;
        }
      }, codeRef.current);
    }
  }, [codeRef.current, codeRef]);
  return null;
};