@orca-fe/hooks/es/useCombineKeyListener.js

React Hooks Collections

// deprecated
import { useEventListener } from 'ahooks';
import { detect } from 'detect-browser';
import { useMemo } from 'react';
/** * 是否为mac系统（包含iphone手机） * */
export function isMac() {
  var info = detect();
  return (info === null || info === void 0 ? void 0 : info.os) === 'Mac OS' || (info === null || info === void 0 ? void 0 : info.os) === 'darwin';
}
export function toHotkeyStr(event) {
  var metaKey = event.metaKey,
    ctrlKey = event.ctrlKey,
    altKey = event.altKey,
    shiftKey = event.shiftKey,
    key = event.key;
  if (key === 'Command' || key === 'Control' || key === 'Meta' || key === 'Shift' || key === 'Alt') return '';
  var keyArr = [];
  if (isMac()) {
    if (metaKey) {
      keyArr.push('Command');
    }
    if (ctrlKey) {
      keyArr.push('Ctrl');
    }
    if (shiftKey) {
      keyArr.push('Shift');
    }
    if (altKey) {
      keyArr.push('Alt');
    }
    if (key.length === 1) {
      keyArr.push(key.toUpperCase());
    } else {
      keyArr.push(key);
    }
  } else {
    if (ctrlKey) {
      keyArr.push('Ctrl');
    }
    if (shiftKey) {
      keyArr.push('Shift');
    }
    if (altKey) {
      keyArr.push('Alt');
    }
    if (metaKey) {
      keyArr.push('Meta');
    }
    if (key.length === 1) {
      keyArr.push(key.toUpperCase());
    } else {
      keyArr.push(key);
    }
  }
  return keyArr.join('+');
}

// 功能键权重
var fnKeyOrder = {
  Command: -10,
  Ctrl: -8,
  Shift: -6,
  Alt: -4,
  Meta: -2
};

// 将 hotkey 标准化
export function normalizeHotkeyStr(hotkeyStr) {
  var keyArr = hotkeyStr.trim().split('+');
  return keyArr.map(key => key.trim())
  // 按功能键权重排序
  .sort((key1, key2) => (fnKeyOrder[key1] || 0) - (fnKeyOrder[key2] || 0)).join('+');
}
export function divOnlyFilter(e) {
  var _e$target;
  if (((_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target['tagName']) === 'DIV') {
    return true;
  }
  return false;
}
export default function useCombineKeyListener(combineKey, callback, options = {}) {
  var _options$stopPropagat = options.stopPropagation,
    stopPropagation = _options$stopPropagat === void 0 ? false : _options$stopPropagat,
    _options$preventDefau = options.preventDefault,
    preventDefault = _options$preventDefau === void 0 ? false : _options$preventDefau,
    filter = options.filter,
    _options$allElement = options.allElement,
    allElement = _options$allElement === void 0 ? false : _options$allElement;

  // 支持逗号分隔
  var hotkeyStrArr = useMemo(() => combineKey.split(',').map(normalizeHotkeyStr), [combineKey]);
  useEventListener('keydown', e => {
    var hotkeyStr = toHotkeyStr(e);
    if (!hotkeyStr) return;
    // 判断是否匹配 hotkey
    if (!hotkeyStrArr.includes(hotkeyStr)) {
      return;
    }
    // 过滤
    if (typeof filter === 'function') {
      if (filter(e) === false) {
        return;
      }
    } else if (!allElement) {
      // 没有设置 filter，自动判断，排除不监听的内容
      if (['INPUT', 'TEXTAREA', 'BUTTON'].includes(e.target.tagName)) {
        return;
      }
    }
    if (stopPropagation) {
      e.stopPropagation();
    }
    if (preventDefault) {
      e.preventDefault();
    }
    callback(e);
  }, {
    target: options.target
  });
}