keys.ts 1.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  1. export const isDarwin = /Mac|iPod|iPhone|iPad/.test(window.navigator.platform);
  2. export const isWindows = /^Win/.test(window.navigator.platform);
  3. export const isAndroid = /\b(android)\b/i.test(navigator.userAgent);
  4. export const CODES = {
  5. EQUAL: "Equal",
  6. MINUS: "Minus",
  7. NUM_ADD: "NumpadAdd",
  8. NUM_SUBTRACT: "NumpadSubtract",
  9. NUM_ZERO: "Numpad0",
  10. BRACKET_RIGHT: "BracketRight",
  11. BRACKET_LEFT: "BracketLeft",
  12. ONE: "Digit1",
  13. TWO: "Digit2",
  14. NINE: "Digit9",
  15. QUOTE: "Quote",
  16. ZERO: "Digit0",
  17. SLASH: "Slash",
  18. C: "KeyC",
  19. D: "KeyD",
  20. H: "KeyH",
  21. V: "KeyV",
  22. Z: "KeyZ",
  23. R: "KeyR",
  24. } as const;
  25. export const KEYS = {
  26. ARROW_DOWN: "ArrowDown",
  27. ARROW_LEFT: "ArrowLeft",
  28. ARROW_RIGHT: "ArrowRight",
  29. ARROW_UP: "ArrowUp",
  30. PAGE_UP: "PageUp",
  31. PAGE_DOWN: "PageDown",
  32. BACKSPACE: "Backspace",
  33. ALT: "Alt",
  34. CTRL_OR_CMD: isDarwin ? "metaKey" : "ctrlKey",
  35. DELETE: "Delete",
  36. ENTER: "Enter",
  37. ESCAPE: "Escape",
  38. QUESTION_MARK: "?",
  39. SPACE: " ",
  40. TAB: "Tab",
  41. CHEVRON_LEFT: "<",
  42. CHEVRON_RIGHT: ">",
  43. PERIOD: ".",
  44. COMMA: ",",
  45. A: "a",
  46. C: "c",
  47. D: "d",
  48. E: "e",
  49. F: "f",
  50. G: "g",
  51. H: "h",
  52. I: "i",
  53. L: "l",
  54. O: "o",
  55. P: "p",
  56. Q: "q",
  57. R: "r",
  58. S: "s",
  59. T: "t",
  60. V: "v",
  61. X: "x",
  62. Y: "y",
  63. Z: "z",
  64. K: "k",
  65. 0: "0",
  66. 1: "1",
  67. 2: "2",
  68. 3: "3",
  69. 4: "4",
  70. 5: "5",
  71. 6: "6",
  72. 7: "7",
  73. 8: "8",
  74. 9: "9",
  75. } as const;
  76. export type Key = keyof typeof KEYS;
  77. export const isArrowKey = (key: string) =>
  78. key === KEYS.ARROW_LEFT ||
  79. key === KEYS.ARROW_RIGHT ||
  80. key === KEYS.ARROW_DOWN ||
  81. key === KEYS.ARROW_UP;
  82. export const shouldResizeFromCenter = (event: MouseEvent | KeyboardEvent) =>
  83. event.altKey;
  84. export const shouldMaintainAspectRatio = (event: MouseEvent | KeyboardEvent) =>
  85. event.shiftKey;
  86. export const shouldRotateWithDiscreteAngle = (
  87. event: MouseEvent | KeyboardEvent | React.PointerEvent<HTMLCanvasElement>,
  88. ) => event.shiftKey;