mirror of
https://github.com/Foundry376/Mailspring.git
synced 2024-11-11 18:32:20 +08:00
b4434f6617
Summary:
- Removes controlled focus in the composer!
- No React components ever perfom focus in lifecycle methods. Never again.
- A new `Utils.schedule({action, after, timeout})` helper makes it easy to say "setState or load draft, etc. and then focus"
- The DraftStore issues a focusDraft action after creating a draft, which causes the MessageList to focus and scroll to the desired composer, which itself decides which field to focus.
- The MessageList never focuses anything automatically.
- Refactors ComposerView apart — ComposerHeader handles all top fields, DraftSessionContainer handles draft session initialization and exposes props to ComposerView
- ComposerHeader now uses a KeyCommandRegion (with focusIn and focusOut) to do the expanding and collapsing of the participants fields. May rename that container very soon.
- Removes all CommandRegistry handling of tab and shift-tab. Unless you preventDefault, the browser does it's thing.
- Removes all tabIndexes greater than 1. This is an anti-pattern—assigning everything a tabIndex of 0 tells the browser to move between them based on their order in the DOM, and is almost always what you want.
- Adds "TabGroupRegion" which allows you to create a tab/shift-tabbing group, (so tabbing does not leave the active composer). Can't believe this isn't a browser feature.
Todos:
- Occasionally, clicking out of the composer contenteditable requires two clicks. This is because atomicEdit is restoring selection within the contenteditable and breaking blur.
- Because the ComposerView does not render until it has a draft, we're back to it being white in popout composers for a brief moment. We will fix this another way - all the "return unless draft" statements were untenable.
- Clicking a row in the thread list no longer shifts focus to the message list and focuses the last draft. This will be restored soon.
Test Plan: Broken
Reviewers: juan, evan
Reviewed By: juan, evan
Differential Revision: https://phab.nylas.com/D2814
183 lines
3.9 KiB
Text
183 lines
3.9 KiB
Text
# 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!'
|