botframework-webchat-component
Version:
React component of botframework-webchat
57 lines (53 loc) • 8.69 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,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9VdGlscy9UeXBlRm9jdXNTaW5rL25hdmlnYWJsZUV2ZW50LmpzIl0sIm5hbWVzIjpbIm5hdmlnYWJsZUV2ZW50IiwiZXZlbnQiLCJhbHRLZXkiLCJ0YXJnZXQiLCJ0YWdOYW1lIiwiYXV0b2NvbXBsZXRlQXR0cmlidXRlIiwiZ2V0QXR0cmlidXRlIiwiYXV0b2NvbXBsZXRlIiwibGlzdCIsInR5cGUiLCJ2YWx1ZSIsImlubmVySFRNTCJdLCJtYXBwaW5ncyI6Ijs7Ozs7OztBQUFBO0FBQ0E7QUFDQTtBQUNBO0FBQ2UsU0FBU0EsY0FBVCxDQUF3QkMsS0FBeEIsRUFBK0I7QUFBQSxNQUUxQ0MsTUFGMEMsR0FLeENELEtBTHdDLENBRTFDQyxNQUYwQztBQUFBLE1BRzFDQyxNQUgwQyxHQUt4Q0YsS0FMd0MsQ0FHMUNFLE1BSDBDO0FBQUEsTUFJaENDLE9BSmdDLEdBS3hDSCxLQUx3QyxDQUkxQ0UsTUFKMEMsQ0FJaENDLE9BSmdDO0FBTzVDLE1BQU1DLHFCQUFxQixHQUFHRixNQUFNLENBQUNHLFlBQVAsQ0FBb0IsY0FBcEIsQ0FBOUI7QUFDQSxNQUFNQyxZQUFZLEdBQUdGLHFCQUFxQixJQUFJQSxxQkFBcUIsS0FBSyxLQUF4RSxDQVI0QyxDQVU1QztBQUNBO0FBRUE7QUFDQTtBQUNBOztBQUNBLE1BQUlELE9BQU8sS0FBSyxPQUFoQixFQUF5QjtBQUFBLFFBQ2ZJLElBRGUsR0FDT0wsTUFEUCxDQUNmSyxJQURlO0FBQUEsUUFDVEMsSUFEUyxHQUNPTixNQURQLENBQ1RNLElBRFM7QUFBQSxRQUNIQyxLQURHLEdBQ09QLE1BRFAsQ0FDSE8sS0FERyxFQUd2Qjs7QUFDQSxRQUNFRCxJQUFJLEtBQUssUUFBVCxJQUNBQSxJQUFJLEtBQUssVUFEVCxJQUVBQSxJQUFJLEtBQUssTUFGVCxJQUdBQSxJQUFJLEtBQUssT0FIVCxJQUlBQSxJQUFJLEtBQUssT0FKVCxJQUtBQSxJQUFJLEtBQUssT0FMVCxJQU1BQSxJQUFJLEtBQUssUUFQWCxFQVFFO0FBQ0EsYUFBTyxJQUFQO0FBQ0QsS0FWRCxNQVVPLElBQ0xBLElBQUksS0FBSyxPQUFULElBQ0FBLElBQUksS0FBSyxVQURULElBRUFBLElBQUksS0FBSyxRQUZULElBR0FBLElBQUksS0FBSyxLQUhULElBSUFBLElBQUksS0FBSyxNQUpULElBS0FBLElBQUksS0FBSyxLQU5KLEVBT0w7QUFDQSxVQUFJRixZQUFZLElBQUlDLElBQXBCLEVBQTBCO0FBQ3hCO0FBQ0EsZUFBTyxJQUFQO0FBQ0QsT0FIRCxNQUdPLElBQUlOLE1BQU0sSUFBSSxDQUFDUSxLQUFmLEVBQXNCO0FBQzNCO0FBQ0E7QUFDQSxlQUFPLElBQVA7QUFDRDtBQUNGO0FBQ0YsR0EvQkQsTUErQk8sSUFBSU4sT0FBTyxLQUFLLFFBQWhCLEVBQTBCO0FBQy9CO0FBQ0EsV0FBTyxLQUFQO0FBQ0QsR0FITSxNQUdBLElBQUlBLE9BQU8sS0FBSyxVQUFoQixFQUE0QjtBQUNqQyxRQUFJLENBQUNHLFlBQUQsS0FBa0JMLE1BQU0sSUFBSSxDQUFDQyxNQUFNLENBQUNPLEtBQXBDLENBQUosRUFBZ0Q7QUFDOUM7QUFDQSxhQUFPLElBQVA7QUFDRDtBQUNGLEdBTE0sTUFLQSxJQUFJUCxNQUFNLENBQUNHLFlBQVAsQ0FBb0IsaUJBQXBCLE1BQTJDLE1BQS9DLEVBQXVEO0FBQzVELFFBQUlKLE1BQU0sSUFBSSxDQUFDQyxNQUFNLENBQUNRLFNBQXRCLEVBQWlDO0FBQy9CO0FBQ0EsYUFBTyxJQUFQO0FBQ0Q7QUFDRixHQUxNLE1BS0E7QUFDTCxXQUFPLElBQVA7QUFDRDtBQUNGIiwic291cmNlUm9vdCI6ImNvbXBvbmVudDovLy8iLCJzb3VyY2VzQ29udGVudCI6WyIvLyBOYXZpZ2FibGUgZXZlbnQgbWVhbnMgdGhlIGVuZC11c2VyIGlzIGZvY3VzaW5nIG9uIGFuIGlucHV0dGFibGUgZWxlbWVudCwgYnV0IGl0IGlzIG9rYXkgdG8gY2FwdHVyZSB0aGUgYXJyb3cga2V5cy5cbi8vIEZvciBleGFtcGxlLCBpZiB0aGUgZW5kLXVzZXIgaXMgb24gPGJ1dHRvbj4sIHdlIGNhbiBjYXB0dXJlIHRoZSBhcnJvdyBrZXlzLlxuLy8gV2UgY2FuIGFsc28gY2FwdHVyZSBhcnJvdyBrZXlzIHdoZW4gdGhlIHVzZXIgaXMgb24gYSA8dGV4dGFyZWE+IHdpdGhvdXQgY29udGVudHMuXG4vLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgY29tcGxleGl0eVxuZXhwb3J0IGRlZmF1bHQgZnVuY3Rpb24gbmF2aWdhYmxlRXZlbnQoZXZlbnQpIHtcbiAgY29uc3Qge1xuICAgIGFsdEtleSxcbiAgICB0YXJnZXQsXG4gICAgdGFyZ2V0OiB7IHRhZ05hbWUgfVxuICB9ID0gZXZlbnQ7XG5cbiAgY29uc3QgYXV0b2NvbXBsZXRlQXR0cmlidXRlID0gdGFyZ2V0LmdldEF0dHJpYnV0ZSgnYXV0b2NvbXBsZXRlJyk7XG4gIGNvbnN0IGF1dG9jb21wbGV0ZSA9IGF1dG9jb21wbGV0ZUF0dHJpYnV0ZSAmJiBhdXRvY29tcGxldGVBdHRyaWJ1dGUgIT09ICdvZmYnO1xuXG4gIC8vIEdlbmVyYWxseSwgd2UgYWxsb3cgdXAvZG93biBhcnJvdyBrZXlzIG9uIGFsbCBlbGVtZW50cyBjYXB0dXJlZCBoZXJlLCBleGNlcHQgdGhvc2UgaGFuZGxlZCBieSB0aGUgdXNlciBhZ2VudC5cbiAgLy8gRm9yIGV4YW1wbGUsIGlmIGl0IGlzIG9uIDxzZWxlY3Q+LCB3ZSB3aWxsIGlnbm9yZSB1cC9kb3duIGFycm93IGtleXMuIEFsc28gdHJ1ZSBmb3IgdGV4dGJveCB3aXRoIGF1dG9jb21wbGV0ZS5cblxuICAvLyBGb3Igc29tZSBlbGVtZW50cywgdXNlciBhZ2VudCBkb2Vzbid0IGhhbmRsZSBhcnJvdyBrZXlzIHdoZW4gQUxUIGtleSBpcyBoZWxkLCBzbyB3ZSBjYW4gc3RpbGwgaGFuZGxlIEFMVCArIFVQL0RPV04ga2V5cy5cbiAgLy8gRm9yIGV4YW1wbGUsIHVzZXIgYWdlbnQgaWdub3JlcyBBTFQgKyBVUC9ET1dOIG9uIDxpbnB1dCB0eXBlPVwidGV4dFwiPiB3aXRoIGNvbnRlbnQuXG4gIC8vIENvdW50ZXItZXhhbXBsZTogdXNlciBhZ2VudCBjb250aW51ZXMgdG8gaGFuZGxlIEFMVCArIFVQL0RPV04gb24gPGlucHV0IHR5cGU9XCJudW1iZXJcIj4uXG4gIGlmICh0YWdOYW1lID09PSAnSU5QVVQnKSB7XG4gICAgY29uc3QgeyBsaXN0LCB0eXBlLCB2YWx1ZSB9ID0gdGFyZ2V0O1xuXG4gICAgLy8gVGhlc2UgYXJlIGJ1dHRvbnMsIHVwL2Rvd24gYXJyb3cga2V5cyBhcmUgbm90IGhhbmRsZWQgYnkgdGhlIHVzZXIgYWdlbnQuXG4gICAgaWYgKFxuICAgICAgdHlwZSA9PT0gJ2J1dHRvbicgfHxcbiAgICAgIHR5cGUgPT09ICdjaGVja2JveCcgfHxcbiAgICAgIHR5cGUgPT09ICdmaWxlJyB8fFxuICAgICAgdHlwZSA9PT0gJ2ltYWdlJyB8fFxuICAgICAgdHlwZSA9PT0gJ3JhZGlvJyB8fFxuICAgICAgdHlwZSA9PT0gJ3Jlc2V0JyB8fFxuICAgICAgdHlwZSA9PT0gJ3N1Ym1pdCdcbiAgICApIHtcbiAgICAgIHJldHVybiB0cnVlO1xuICAgIH0gZWxzZSBpZiAoXG4gICAgICB0eXBlID09PSAnZW1haWwnIHx8XG4gICAgICB0eXBlID09PSAncGFzc3dvcmQnIHx8XG4gICAgICB0eXBlID09PSAnc2VhcmNoJyB8fFxuICAgICAgdHlwZSA9PT0gJ3RlbCcgfHxcbiAgICAgIHR5cGUgPT09ICd0ZXh0JyB8fFxuICAgICAgdHlwZSA9PT0gJ3VybCdcbiAgICApIHtcbiAgICAgIGlmIChhdXRvY29tcGxldGUgfHwgbGlzdCkge1xuICAgICAgICAvLyBcImF1dG9jb21wbGV0ZVwiIGFuZCBcImxpc3RcIiBhcmUgY29tYm9ib3hlcy4gVXAvZG93biBhcnJvdyBrZXlzIG1heSBiZSBoYW5kbGVkIGJ5IHRoZSB1c2VyIGFnZW50LlxuICAgICAgICByZXR1cm4gdHJ1ZTtcbiAgICAgIH0gZWxzZSBpZiAoYWx0S2V5IHx8ICF2YWx1ZSkge1xuICAgICAgICAvLyBJZiB0aGUgaW5wdXQgaGFzIGNvbnRlbnQsIHVzZXIgYWdlbnQgd2lsbCBoYW5kbGUgdXAvZG93biBhcnJvdyBhbmQgaXQgd29yayBzaW1pbGFyIHRvIEhPTUUvRU5EIGtleXMuXG4gICAgICAgIC8vIFwiYWx0S2V5XCIgY2FuIGJlIHVzZWQ7IHVzZXIgYWdlbnQgaWdub3JlcyBBTFQgKyBVUC9ET1dOLlxuICAgICAgICByZXR1cm4gdHJ1ZTtcbiAgICAgIH1cbiAgICB9XG4gIH0gZWxzZSBpZiAodGFnTmFtZSA9PT0gJ1NFTEVDVCcpIHtcbiAgICAvLyBVc2VyIGFnZW50IGhhbmRsZXMgdXAvZG93biBhcnJvdyBrZXlzIGZvciBkcm9wZG93biBsaXN0LlxuICAgIHJldHVybiBmYWxzZTtcbiAgfSBlbHNlIGlmICh0YWdOYW1lID09PSAnVEVYVEFSRUEnKSB7XG4gICAgaWYgKCFhdXRvY29tcGxldGUgJiYgKGFsdEtleSB8fCAhdGFyZ2V0LnZhbHVlKSkge1xuICAgICAgLy8gVXNlciBhZ2VudCBoYW5kbGVzIHVwL2Rvd24gYXJyb3cga2V5cyBmb3IgbXVsdGlsaW5lIHRleHQgYm94IGlmIGl0IGhhcyBjb250ZW50IG9yIGlzIGF1dG8tY29tcGxldGUuXG4gICAgICByZXR1cm4gdHJ1ZTtcbiAgICB9XG4gIH0gZWxzZSBpZiAodGFyZ2V0LmdldEF0dHJpYnV0ZSgnY29udGVudGVkaXRhYmxlJykgPT09ICd0cnVlJykge1xuICAgIGlmIChhbHRLZXkgfHwgIXRhcmdldC5pbm5lckhUTUwpIHtcbiAgICAgIC8vIFwiY29udGVudGVkaXRhYmxlXCIgZWxlbWVudCB3b3JrcyBsaWtlIDx0ZXh0YXJlYT4gbWludXMgXCJhdXRvY29tcGxldGVcIi5cbiAgICAgIHJldHVybiB0cnVlO1xuICAgIH1cbiAgfSBlbHNlIHtcbiAgICByZXR1cm4gdHJ1ZTtcbiAgfVxufVxuIl19