| 1 | /** |
| 2 | * Copyright (c) Meta Platforms, Inc. and affiliates. |
| 3 | * |
| 4 | * This source code is licensed under the MIT license found in the |
| 5 | * LICENSE file in the root directory of this source tree. |
| 6 | * |
| 7 | * @flow |
| 8 | */ |
| 9 | |
| 10 | import type {DOMEventName} from './DOMEventNames'; |
| 11 | |
| 12 | import {registerTwoPhaseEvent} from './EventRegistry'; |
| 13 | import { |
| 14 | ANIMATION_END, |
| 15 | ANIMATION_ITERATION, |
| 16 | ANIMATION_START, |
| 17 | TRANSITION_RUN, |
| 18 | TRANSITION_START, |
| 19 | TRANSITION_CANCEL, |
| 20 | TRANSITION_END, |
| 21 | } from './DOMEventNames'; |
| 22 | |
| 23 | import { |
| 24 | enableCreateEventHandleAPI, |
| 25 | enableScrollEndPolyfill, |
| 26 | } from 'shared/ReactFeatureFlags'; |
| 27 | |
| 28 | export const topLevelEventsToReactNames: Map<DOMEventName, string | null> = |
| 29 | new Map(); |
| 30 | |
| 31 | // NOTE: Capitalization is important in this list! |
| 32 | // |
| 33 | // E.g. it needs "pointerDown", not "pointerdown". |
| 34 | // This is because we derive both React name ("onPointerDown") |
| 35 | // and DOM name ("pointerdown") from the same list. |
| 36 | // |
| 37 | // Exceptions that don't match this convention are listed separately. |
| 38 | // |
| 39 | // prettier-ignore |
| 40 | const simpleEventPluginEvents = [ |
| 41 | 'abort', |
| 42 | 'auxClick', |
| 43 | 'beforeToggle', |
| 44 | 'cancel', |
| 45 | 'canPlay', |
| 46 | 'canPlayThrough', |
| 47 | 'click', |
| 48 | 'close', |
| 49 | 'contextMenu', |
| 50 | 'copy', |
| 51 | 'cut', |
| 52 | 'drag', |
| 53 | 'dragEnd', |
| 54 | 'dragEnter', |
| 55 | 'dragExit', |
| 56 | 'dragLeave', |
| 57 | 'dragOver', |
| 58 | 'dragStart', |
| 59 | 'drop', |
| 60 | 'durationChange', |
| 61 | 'emptied', |
| 62 | 'encrypted', |
| 63 | 'ended', |
| 64 | 'error', |
| 65 | 'fullscreenChange', |
| 66 | 'fullscreenError', |
| 67 | 'gotPointerCapture', |
| 68 | 'input', |
| 69 | 'invalid', |
| 70 | 'keyDown', |
| 71 | 'keyPress', |
| 72 | 'keyUp', |
| 73 | 'load', |
| 74 | 'loadedData', |
| 75 | 'loadedMetadata', |
| 76 | 'loadStart', |
| 77 | 'lostPointerCapture', |
| 78 | 'mouseDown', |
| 79 | 'mouseMove', |
| 80 | 'mouseOut', |
| 81 | 'mouseOver', |
| 82 | 'mouseUp', |
| 83 | 'paste', |
| 84 | 'pause', |
| 85 | 'play', |
| 86 | 'playing', |
| 87 | 'pointerCancel', |
| 88 | 'pointerDown', |
| 89 | 'pointerMove', |
| 90 | 'pointerOut', |
| 91 | 'pointerOver', |
| 92 | 'pointerUp', |
| 93 | 'progress', |
| 94 | 'rateChange', |
| 95 | 'reset', |
| 96 | 'resize', |
| 97 | 'seeked', |
| 98 | 'seeking', |
| 99 | 'stalled', |
| 100 | 'submit', |
| 101 | 'suspend', |
| 102 | 'timeUpdate', |
| 103 | 'touchCancel', |
| 104 | 'touchEnd', |
| 105 | 'touchStart', |
| 106 | 'volumeChange', |
| 107 | 'scroll', |
| 108 | 'toggle', |
| 109 | 'touchMove', |
| 110 | 'waiting', |
| 111 | 'wheel', |
| 112 | ]; |
| 113 | |
| 114 | if (!enableScrollEndPolyfill) { |
| 115 | simpleEventPluginEvents.push('scrollEnd'); |
| 116 | } |
| 117 | |
| 118 | if (enableCreateEventHandleAPI) { |
| 119 | // Special case: these two events don't have on* React handler |
| 120 | // and are only accessible via the createEventHandle API. |
| 121 | topLevelEventsToReactNames.set('beforeblur', null); |
| 122 | topLevelEventsToReactNames.set('afterblur', null); |
| 123 | } |
| 124 | |
| 125 | function registerSimpleEvent(domEventName: DOMEventName, reactName: string) { |
| 126 | topLevelEventsToReactNames.set(domEventName, reactName); |
| 127 | registerTwoPhaseEvent(reactName, [domEventName]); |
| 128 | } |
| 129 | |
| 130 | export function registerSimpleEvents() { |
| 131 | for (let i = 0; i < simpleEventPluginEvents.length; i++) { |
| 132 | const eventName = simpleEventPluginEvents[i] as any as string; |
| 133 | const domEventName = eventName.toLowerCase() as any as DOMEventName; |
| 134 | const capitalizedEvent = eventName[0].toUpperCase() + eventName.slice(1); |
| 135 | registerSimpleEvent(domEventName, 'on' + capitalizedEvent); |
| 136 | } |
| 137 | // Special cases where event names don't match. |
| 138 | registerSimpleEvent(ANIMATION_END, 'onAnimationEnd'); |
| 139 | registerSimpleEvent(ANIMATION_ITERATION, 'onAnimationIteration'); |
| 140 | registerSimpleEvent(ANIMATION_START, 'onAnimationStart'); |
| 141 | registerSimpleEvent('dblclick', 'onDoubleClick'); |
| 142 | registerSimpleEvent('focusin', 'onFocus'); |
| 143 | registerSimpleEvent('focusout', 'onBlur'); |
| 144 | |
| 145 | registerSimpleEvent(TRANSITION_RUN, 'onTransitionRun'); |
| 146 | registerSimpleEvent(TRANSITION_START, 'onTransitionStart'); |
| 147 | registerSimpleEvent(TRANSITION_CANCEL, 'onTransitionCancel'); |
| 148 | registerSimpleEvent(TRANSITION_END, 'onTransitionEnd'); |
| 149 | } |