# We need to explicitly ensure all commands sent to inputs are handled as # native events. # # When users type a key in an input, that event bubbles up. (We # intentionally don't `stopPropagation` from inputs to allow for cases # where you do want to catch key events.) # # When that keypress bubbles up to the root level, we may capture it # thinking it's a hot key. While we could attach the special # `.native-key-bindings` class to the input, we can't guarantee that this # will be upheld. Furthermore, in some cases we may want to actually # capture the input. # # Once captured, the event's default will be prevented. # # We give a higher CSS specificity to the inputs, textareas, and # contentedtiables to ensure that the `native!` behavior takes precedent. 'body input, body textarea, body *[contenteditable], body webview': 'up': 'native!' 'left': 'native!' 'down': 'native!' 'right': 'native!' 'cmd-up': 'native!' 'cmd-left': 'native!' 'cmd-down': 'native!' 'cmd-right': 'native!' 'ctrl-up': 'native!' 'ctrl-left': 'native!' 'ctrl-down': 'native!' 'ctrl-right': 'native!' 'shift-up': 'native!' 'shift-left': 'native!' 'shift-down': 'native!' 'shift-right': 'native!' 'escape': 'native!' 'pageup': 'native!' 'pagedown': 'native!' 'shift-pageup': 'native!' 'shift-pagedown': 'native!' 'enter': 'native!' 'cmd-enter': 'native!' 'ctrl-enter': 'native!' 'shift-enter': 'native!' 'backspace': 'native!' 'shift-backspace': 'native!' 'delete': 'native!' 'shift-delete': 'native!' 'cmd-y': 'native!' 'cmd-z': 'native!' 'cmd-Z': 'native!' 'cmd-x': 'native!' 'cmd-X': 'native!' 'cmd-c': 'native!' 'cmd-C': 'native!' 'cmd-v': 'native!' 'cmd-V': 'native!' 'cmd-a': 'native!' 'cmd-A': 'native!' 'cmd-b': 'native!' 'cmd-i': 'native!' 'cmd-u': 'native!' 'ctrl-y': 'native!' 'ctrl-z': 'native!' 'ctrl-Z': 'native!' 'ctrl-x': 'native!' 'ctrl-X': 'native!' 'ctrl-c': 'native!' 'ctrl-C': 'native!' 'ctrl-v': 'native!' 'ctrl-V': 'native!' 'ctrl-a': 'native!' 'ctrl-A': 'native!' 'ctrl-b': 'native!' 'ctrl-i': 'native!' 'ctrl-u': 'native!' 'a': 'native!' 'b': 'native!' 'c': 'native!' 'd': 'native!' 'e': 'native!' 'f': 'native!' 'g': 'native!' 'h': 'native!' 'i': 'native!' 'j': 'native!' 'k': 'native!' 'l': 'native!' 'm': 'native!' 'n': 'native!' 'o': 'native!' 'p': 'native!' 'q': 'native!' 'r': 'native!' 's': 'native!' 't': 'native!' 'u': 'native!' 'v': 'native!' 'w': 'native!' 'x': 'native!' 'y': 'native!' 'z': 'native!' 'A': 'native!' 'B': 'native!' 'C': 'native!' 'D': 'native!' 'E': 'native!' 'F': 'native!' 'G': 'native!' 'H': 'native!' 'I': 'native!' 'J': 'native!' 'K': 'native!' 'L': 'native!' 'M': 'native!' 'N': 'native!' 'O': 'native!' 'P': 'native!' 'Q': 'native!' 'R': 'native!' 'S': 'native!' 'T': 'native!' 'U': 'native!' 'V': 'native!' 'W': 'native!' 'X': 'native!' 'Y': 'native!' 'Z': 'native!' '1': 'native!' '2': 'native!' '3': 'native!' '4': 'native!' '5': 'native!' '6': 'native!' '7': 'native!' '8': 'native!' '9': 'native!' '0': 'native!' '~': 'native!' '`': 'native!' '!': 'native!' '@': 'native!' '#': 'native!' '$': 'native!' '%': 'native!' '^': 'native!' '&': 'native!' '*': 'native!' '(': 'native!' ')': 'native!' '-': 'native!' '_': 'native!' '=': 'native!' '+': 'native!' '[': 'native!' '{': 'native!' ']': 'native!' '}': 'native!' '\\': 'native!' '|': 'native!' ';': 'native!' ':': 'native!' '\'': 'native!' '"': 'native!' '<': 'native!' ',': 'native!' '>': 'native!' '.': 'native!' '?': 'native!' '/': 'native!' 'g i': 'native!' 'g s': 'native!' 'g t': 'native!' 'g d': 'native!' 'g a': 'native!' 'g c': 'native!' 'g k': 'native!' 'g l': 'native!' '* a': 'native!' '* n': 'native!' '* r': 'native!' '* u': 'native!' '* s': 'native!' '* t': 'native!' # Tabs are a bit different because simple elements (like text inputs) we # want to use our custom `core:focus-next`. Other more complex ones, like # `contenteditable`, we want to have a more controlled effect over. 'body input, body textarea': 'tab': 'core:focus-next' 'shift-tab': 'core:focus-previous' # So our contenteditable control can do its own thing 'body webview, body *[contenteditable]': 'tab': 'native!' 'shift-tab': 'native!' # For menus 'body .menu, body .menu, body .menu input': # and by "native!" I actually mean for it to just let React deal with # it. 'tab': 'native!' 'shift-tab': 'native!'