botframework-webchat-component
Version:
React component of botframework-webchat
59 lines (55 loc) • 8.62 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = navigableEvent;
// Navigable event means the end-user is focusing on an inputtable element, but it is okay to capture the arrow keys.
// For example, if the end-user is on <button>, we can capture the arrow keys.
// We can also capture arrow keys when the user is on a <textarea> without contents.
// eslint-disable-next-line complexity
function navigableEvent(event) {
var altKey = event.altKey,
target = event.target,
tagName = event.target.tagName;
var autocompleteAttribute = target.getAttribute('autocomplete');
var autocomplete = autocompleteAttribute && autocompleteAttribute !== 'off';
// Generally, we allow up/down arrow keys on all elements captured here, except those handled by the user agent.
// For example, if it is on <select>, we will ignore up/down arrow keys. Also true for textbox with autocomplete.
// For some elements, user agent doesn't handle arrow keys when ALT key is held, so we can still handle ALT + UP/DOWN keys.
// For example, user agent ignores ALT + UP/DOWN on <input type="text"> with content.
// Counter-example: user agent continues to handle ALT + UP/DOWN on <input type="number">.
if (tagName === 'INPUT') {
var list = target.list,
type = target.type,
value = target.value;
// These are buttons, up/down arrow keys are not handled by the user agent.
if (type === 'button' || type === 'checkbox' || type === 'file' || type === 'image' || type === 'radio' || type === 'reset' || type === 'submit') {
return true;
} else if (type === 'email' || type === 'password' || type === 'search' || type === 'tel' || type === 'text' || type === 'url') {
if (autocomplete || list) {
// "autocomplete" and "list" are comboboxes. Up/down arrow keys may be handled by the user agent.
return true;
} else if (altKey || !value) {
// If the input has content, user agent will handle up/down arrow and it work similar to HOME/END keys.
// "altKey" can be used; user agent ignores ALT + UP/DOWN.
return true;
}
}
} else if (tagName === 'SELECT') {
// User agent handles up/down arrow keys for dropdown list.
return false;
} else if (tagName === 'TEXTAREA') {
if (!autocomplete && (altKey || !target.value)) {
// User agent handles up/down arrow keys for multiline text box if it has content or is auto-complete.
return true;
}
} else if (target.getAttribute('contenteditable') === 'true') {
if (altKey || !target.innerHTML) {
// "contenteditable" element works like <textarea> minus "autocomplete".
return true;
}
} else {
return true;
}
}
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJuYW1lcyI6WyJuYXZpZ2FibGVFdmVudCIsImV2ZW50IiwiYWx0S2V5IiwidGFyZ2V0IiwidGFnTmFtZSIsImF1dG9jb21wbGV0ZUF0dHJpYnV0ZSIsImdldEF0dHJpYnV0ZSIsImF1dG9jb21wbGV0ZSIsImxpc3QiLCJ0eXBlIiwidmFsdWUiLCJpbm5lckhUTUwiXSwic291cmNlUm9vdCI6ImNvbXBvbmVudDovLy8iLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9VdGlscy9UeXBlRm9jdXNTaW5rL25hdmlnYWJsZUV2ZW50LmpzIl0sInNvdXJjZXNDb250ZW50IjpbIi8vIE5hdmlnYWJsZSBldmVudCBtZWFucyB0aGUgZW5kLXVzZXIgaXMgZm9jdXNpbmcgb24gYW4gaW5wdXR0YWJsZSBlbGVtZW50LCBidXQgaXQgaXMgb2theSB0byBjYXB0dXJlIHRoZSBhcnJvdyBrZXlzLlxuLy8gRm9yIGV4YW1wbGUsIGlmIHRoZSBlbmQtdXNlciBpcyBvbiA8YnV0dG9uPiwgd2UgY2FuIGNhcHR1cmUgdGhlIGFycm93IGtleXMuXG4vLyBXZSBjYW4gYWxzbyBjYXB0dXJlIGFycm93IGtleXMgd2hlbiB0aGUgdXNlciBpcyBvbiBhIDx0ZXh0YXJlYT4gd2l0aG91dCBjb250ZW50cy5cbi8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBjb21wbGV4aXR5XG5leHBvcnQgZGVmYXVsdCBmdW5jdGlvbiBuYXZpZ2FibGVFdmVudChldmVudCkge1xuICBjb25zdCB7XG4gICAgYWx0S2V5LFxuICAgIHRhcmdldCxcbiAgICB0YXJnZXQ6IHsgdGFnTmFtZSB9XG4gIH0gPSBldmVudDtcblxuICBjb25zdCBhdXRvY29tcGxldGVBdHRyaWJ1dGUgPSB0YXJnZXQuZ2V0QXR0cmlidXRlKCdhdXRvY29tcGxldGUnKTtcbiAgY29uc3QgYXV0b2NvbXBsZXRlID0gYXV0b2NvbXBsZXRlQXR0cmlidXRlICYmIGF1dG9jb21wbGV0ZUF0dHJpYnV0ZSAhPT0gJ29mZic7XG5cbiAgLy8gR2VuZXJhbGx5LCB3ZSBhbGxvdyB1cC9kb3duIGFycm93IGtleXMgb24gYWxsIGVsZW1lbnRzIGNhcHR1cmVkIGhlcmUsIGV4Y2VwdCB0aG9zZSBoYW5kbGVkIGJ5IHRoZSB1c2VyIGFnZW50LlxuICAvLyBGb3IgZXhhbXBsZSwgaWYgaXQgaXMgb24gPHNlbGVjdD4sIHdlIHdpbGwgaWdub3JlIHVwL2Rvd24gYXJyb3cga2V5cy4gQWxzbyB0cnVlIGZvciB0ZXh0Ym94IHdpdGggYXV0b2NvbXBsZXRlLlxuXG4gIC8vIEZvciBzb21lIGVsZW1lbnRzLCB1c2VyIGFnZW50IGRvZXNuJ3QgaGFuZGxlIGFycm93IGtleXMgd2hlbiBBTFQga2V5IGlzIGhlbGQsIHNvIHdlIGNhbiBzdGlsbCBoYW5kbGUgQUxUICsgVVAvRE9XTiBrZXlzLlxuICAvLyBGb3IgZXhhbXBsZSwgdXNlciBhZ2VudCBpZ25vcmVzIEFMVCArIFVQL0RPV04gb24gPGlucHV0IHR5cGU9XCJ0ZXh0XCI+IHdpdGggY29udGVudC5cbiAgLy8gQ291bnRlci1leGFtcGxlOiB1c2VyIGFnZW50IGNvbnRpbnVlcyB0byBoYW5kbGUgQUxUICsgVVAvRE9XTiBvbiA8aW5wdXQgdHlwZT1cIm51bWJlclwiPi5cbiAgaWYgKHRhZ05hbWUgPT09ICdJTlBVVCcpIHtcbiAgICBjb25zdCB7IGxpc3QsIHR5cGUsIHZhbHVlIH0gPSB0YXJnZXQ7XG5cbiAgICAvLyBUaGVzZSBhcmUgYnV0dG9ucywgdXAvZG93biBhcnJvdyBrZXlzIGFyZSBub3QgaGFuZGxlZCBieSB0aGUgdXNlciBhZ2VudC5cbiAgICBpZiAoXG4gICAgICB0eXBlID09PSAnYnV0dG9uJyB8fFxuICAgICAgdHlwZSA9PT0gJ2NoZWNrYm94JyB8fFxuICAgICAgdHlwZSA9PT0gJ2ZpbGUnIHx8XG4gICAgICB0eXBlID09PSAnaW1hZ2UnIHx8XG4gICAgICB0eXBlID09PSAncmFkaW8nIHx8XG4gICAgICB0eXBlID09PSAncmVzZXQnIHx8XG4gICAgICB0eXBlID09PSAnc3VibWl0J1xuICAgICkge1xuICAgICAgcmV0dXJuIHRydWU7XG4gICAgfSBlbHNlIGlmIChcbiAgICAgIHR5cGUgPT09ICdlbWFpbCcgfHxcbiAgICAgIHR5cGUgPT09ICdwYXNzd29yZCcgfHxcbiAgICAgIHR5cGUgPT09ICdzZWFyY2gnIHx8XG4gICAgICB0eXBlID09PSAndGVsJyB8fFxuICAgICAgdHlwZSA9PT0gJ3RleHQnIHx8XG4gICAgICB0eXBlID09PSAndXJsJ1xuICAgICkge1xuICAgICAgaWYgKGF1dG9jb21wbGV0ZSB8fCBsaXN0KSB7XG4gICAgICAgIC8vIFwiYXV0b2NvbXBsZXRlXCIgYW5kIFwibGlzdFwiIGFyZSBjb21ib2JveGVzLiBVcC9kb3duIGFycm93IGtleXMgbWF5IGJlIGhhbmRsZWQgYnkgdGhlIHVzZXIgYWdlbnQuXG4gICAgICAgIHJldHVybiB0cnVlO1xuICAgICAgfSBlbHNlIGlmIChhbHRLZXkgfHwgIXZhbHVlKSB7XG4gICAgICAgIC8vIElmIHRoZSBpbnB1dCBoYXMgY29udGVudCwgdXNlciBhZ2VudCB3aWxsIGhhbmRsZSB1cC9kb3duIGFycm93IGFuZCBpdCB3b3JrIHNpbWlsYXIgdG8gSE9NRS9FTkQga2V5cy5cbiAgICAgICAgLy8gXCJhbHRLZXlcIiBjYW4gYmUgdXNlZDsgdXNlciBhZ2VudCBpZ25vcmVzIEFMVCArIFVQL0RPV04uXG4gICAgICAgIHJldHVybiB0cnVlO1xuICAgICAgfVxuICAgIH1cbiAgfSBlbHNlIGlmICh0YWdOYW1lID09PSAnU0VMRUNUJykge1xuICAgIC8vIFVzZXIgYWdlbnQgaGFuZGxlcyB1cC9kb3duIGFycm93IGtleXMgZm9yIGRyb3Bkb3duIGxpc3QuXG4gICAgcmV0dXJuIGZhbHNlO1xuICB9IGVsc2UgaWYgKHRhZ05hbWUgPT09ICdURVhUQVJFQScpIHtcbiAgICBpZiAoIWF1dG9jb21wbGV0ZSAmJiAoYWx0S2V5IHx8ICF0YXJnZXQudmFsdWUpKSB7XG4gICAgICAvLyBVc2VyIGFnZW50IGhhbmRsZXMgdXAvZG93biBhcnJvdyBrZXlzIGZvciBtdWx0aWxpbmUgdGV4dCBib3ggaWYgaXQgaGFzIGNvbnRlbnQgb3IgaXMgYXV0by1jb21wbGV0ZS5cbiAgICAgIHJldHVybiB0cnVlO1xuICAgIH1cbiAgfSBlbHNlIGlmICh0YXJnZXQuZ2V0QXR0cmlidXRlKCdjb250ZW50ZWRpdGFibGUnKSA9PT0gJ3RydWUnKSB7XG4gICAgaWYgKGFsdEtleSB8fCAhdGFyZ2V0LmlubmVySFRNTCkge1xuICAgICAgLy8gXCJjb250ZW50ZWRpdGFibGVcIiBlbGVtZW50IHdvcmtzIGxpa2UgPHRleHRhcmVhPiBtaW51cyBcImF1dG9jb21wbGV0ZVwiLlxuICAgICAgcmV0dXJuIHRydWU7XG4gICAgfVxuICB9IGVsc2Uge1xuICAgIHJldHVybiB0cnVlO1xuICB9XG59XG4iXSwibWFwcGluZ3MiOiI7Ozs7OztBQUFBO0FBQ0E7QUFDQTtBQUNBO0FBQ2UsU0FBU0EsY0FBY0EsQ0FBQ0MsS0FBSyxFQUFFO0VBQzVDLElBQ0VDLE1BQU0sR0FHSkQsS0FBSyxDQUhQQyxNQUFNO0lBQ05DLE1BQU0sR0FFSkYsS0FBSyxDQUZQRSxNQUFNO0lBQ0lDLE9BQU8sR0FDZkgsS0FBSyxDQURQRSxNQUFNLENBQUlDLE9BQU87RUFHbkIsSUFBTUMscUJBQXFCLEdBQUdGLE1BQU0sQ0FBQ0csWUFBWSxDQUFDLGNBQWMsQ0FBQztFQUNqRSxJQUFNQyxZQUFZLEdBQUdGLHFCQUFxQixJQUFJQSxxQkFBcUIsS0FBSyxLQUFLOztFQUU3RTtFQUNBOztFQUVBO0VBQ0E7RUFDQTtFQUNBLElBQUlELE9BQU8sS0FBSyxPQUFPLEVBQUU7SUFDdkIsSUFBUUksSUFBSSxHQUFrQkwsTUFBTSxDQUE1QkssSUFBSTtNQUFFQyxJQUFJLEdBQVlOLE1BQU0sQ0FBdEJNLElBQUk7TUFBRUMsS0FBSyxHQUFLUCxNQUFNLENBQWhCTyxLQUFLOztJQUV6QjtJQUNBLElBQ0VELElBQUksS0FBSyxRQUFRLElBQ2pCQSxJQUFJLEtBQUssVUFBVSxJQUNuQkEsSUFBSSxLQUFLLE1BQU0sSUFDZkEsSUFBSSxLQUFLLE9BQU8sSUFDaEJBLElBQUksS0FBSyxPQUFPLElBQ2hCQSxJQUFJLEtBQUssT0FBTyxJQUNoQkEsSUFBSSxLQUFLLFFBQVEsRUFDakI7TUFDQSxPQUFPLElBQUk7SUFDYixDQUFDLE1BQU0sSUFDTEEsSUFBSSxLQUFLLE9BQU8sSUFDaEJBLElBQUksS0FBSyxVQUFVLElBQ25CQSxJQUFJLEtBQUssUUFBUSxJQUNqQkEsSUFBSSxLQUFLLEtBQUssSUFDZEEsSUFBSSxLQUFLLE1BQU0sSUFDZkEsSUFBSSxLQUFLLEtBQUssRUFDZDtNQUNBLElBQUlGLFlBQVksSUFBSUMsSUFBSSxFQUFFO1FBQ3hCO1FBQ0EsT0FBTyxJQUFJO01BQ2IsQ0FBQyxNQUFNLElBQUlOLE1BQU0sSUFBSSxDQUFDUSxLQUFLLEVBQUU7UUFDM0I7UUFDQTtRQUNBLE9BQU8sSUFBSTtNQUNiO0lBQ0Y7RUFDRixDQUFDLE1BQU0sSUFBSU4sT0FBTyxLQUFLLFFBQVEsRUFBRTtJQUMvQjtJQUNBLE9BQU8sS0FBSztFQUNkLENBQUMsTUFBTSxJQUFJQSxPQUFPLEtBQUssVUFBVSxFQUFFO0lBQ2pDLElBQUksQ0FBQ0csWUFBWSxLQUFLTCxNQUFNLElBQUksQ0FBQ0MsTUFBTSxDQUFDTyxLQUFLLENBQUMsRUFBRTtNQUM5QztNQUNBLE9BQU8sSUFBSTtJQUNiO0VBQ0YsQ0FBQyxNQUFNLElBQUlQLE1BQU0sQ0FBQ0csWUFBWSxDQUFDLGlCQUFpQixDQUFDLEtBQUssTUFBTSxFQUFFO0lBQzVELElBQUlKLE1BQU0sSUFBSSxDQUFDQyxNQUFNLENBQUNRLFNBQVMsRUFBRTtNQUMvQjtNQUNBLE9BQU8sSUFBSTtJQUNiO0VBQ0YsQ0FBQyxNQUFNO0lBQ0wsT0FBTyxJQUFJO0VBQ2I7QUFDRiJ9