How to use the keycode.codes function in keycode

To help you get started, we’ve selected a few keycode examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github instructure / instructure-ui / packages / ui-menu / src / Menu / MenuItem / index.js View on Github external
handleKeyDown = e => {
    const spaceKey = e.keyCode === keycode.codes.space
    const enterKey = e.keyCode === keycode.codes.enter

    if (spaceKey || enterKey) {
      e.preventDefault()
      e.stopPropagation()

      if (enterKey) {
        // handle space key on keyUp for FF
        findDOMNode(this._node).click() // eslint-disable-line react/no-find-dom-node
      }
    }
  }
github instructure / instructure-ui / packages / ui-number-input / src / NumberInput / index.js View on Github external
handleKeyDown = (event) => {
    this.props.onKeyDown(event)

    if (event.keyCode === keycode.codes.down) {
      event.preventDefault()
      this.props.onDecrement(event)
    } else if (event.keyCode === keycode.codes.up) {
      event.preventDefault()
      this.props.onIncrement(event)
    }
  }
github Talend / ui / packages / forms / src / UIForm / fields / Code / Code.component.js View on Github external
onKeyDown(event) {
		if (event.keyCode === keyCode.codes.esc) {
			const now = Date.now();
			if (this.lastEsc && this.lastEsc - now < 1000) {
				this.lastEsc = null;
				this.ref.focus();
				this.editor.textInput.getElement().setAttribute('tabindex', -1);
			} else {
				this.lastEsc = now;
			}
		} else {
			this.lastEsc = null;
		}
	}
github Talend / ui / packages / components / src / DateTimePickers / hooks / useInputPickerHandlers.js View on Github external
function onKeyDown(event, inputRef) {
		switch (event.keyCode) {
			case keycode.codes.esc:
				inputRef.focus();
				closePicker();
				break;
			case keycode.codes.down:
				if (event.target !== inputRef) {
					return;
				}

				if (showPicker) {
					if (handleKeyDown) {
						handleKeyDown();
					}
				} else {
					openPicker();
				}
				break;
github affinipay / react-bootstrap-autosuggest / src / Autosuggest.js View on Github external
_handleKeyDown(event: SyntheticKeyboardEvent) {
    if (this.props.disabled) return

    switch (event.keyCode || event.which) {
    case keycode.codes.down:
    case keycode.codes['page down']:
      if (this.state.open) {
        this.refs.suggestions.focusFirst()
      } else if (this._canOpen()) {
        this._open('keydown', this.props)
      }
      event.preventDefault()
      break
    case keycode.codes.left:
    case keycode.codes.backspace:
      if (this.refs.choices && this.refs.input &&
          this._getCursorPosition(this.refs.input) === 0) {
        this.refs.choices.focusLast()
        event.preventDefault()
      }
      break
    case keycode.codes.right:
github instructure / instructure-ui / packages / ui-core / src / components / TabList / index.js View on Github external
handleEnter = (tabIndex, e) => {
    if (e.keyCode !== keycode.codes.enter && e.keyCode !== keycode.codes.return) {
      return
    }

    const tab = this.getTab(tabIndex)

    if (!tab.props.disabled) {
      this.setSelected(tabIndex)
    }
  }
github instructure / instructure-ui / packages / ui-a11y / src / KeyboardFocusRegion.js View on Github external
handleKeyDown = event => {
    if (event.keyCode === keycode.codes.tab) {
      scopeTab(this._contextElement, event)
    }
  }
github Talend / ui / packages / components / src / TreeView / TreeViewItem / TreeViewItem.component.js View on Github external
onKeyDown(event) {
		switch (event.keyCode) {
			case keycode.codes.enter:
			case keycode.codes.space:
				this.onSelect(event);
				break;
			case keycode.codes.left:
				if (this.hasChildren() && this.props.item.toggled) {
					this.onToggle(event);
				} else if (!this.hasChildren() || !this.props.item.toggled) {
					focusOn(event, this.getParentItem());
				}
				break;
			case keycode.codes.right:
				if (this.hasChildren() && !this.props.item.toggled) {
					this.onToggle(event);
				} else if (this.hasChildren() && this.props.item.toggled) {
					focusOn(event, this.getFirstChildItem());
				}
				break;
			case keycode.codes.down:
				focusOn(event, this.getNextItem());
				break;
			case keycode.codes.up:
				focusOn(event, this.getPreviousItem());
				break;
			case keycode.codes.home:
				focusOn(event, this.getFirstItem());
				break;
			case keycode.codes.end:
github Talend / component-runtime / component-starter-server / src / main / frontend / src / App / components / FacetSelector / FacetSelector.js View on Github external
onKeyDown(event, { focusedItemIndex, newFocusedItemIndex }) {
		switch (event.which) {
			case keycode.codes.enter:
				event.preventDefault();
				if (Number.isInteger(focusedItemIndex)) {
					this.onAddTag(event, { itemIndex: focusedItemIndex });
				}
				break;
			case keycode.codes.down:
			case keycode.codes.up:
				event.preventDefault();
				this.setState({ focusedItemIndex: newFocusedItemIndex });
				break;
			case keycode.codes.backspace:
				if (!this.state.value && this.props.selected.length > 0) {
					this.onRemoveTag(this.props.selected.length - 1);
				}
				break;
			default:
github instructure / instructure-ui / packages / ui-tree-browser / src / components / TreeBrowser / index.js View on Github external
handleLeftOrRightArrow (keyCode, node) {
    const ltr = !(this._root.parentElement.dir === 'rtl' || document.dir === 'rtl')
    if ((ltr && keyCode === keycode.codes.left) || (!ltr && keyCode == keycode.codes.right)) {
      this.handleCloseOrPrevious(node)
    } else {
      this.handleOpenOrNext(node)
    }
  }

keycode

Convert between keyboard keycodes and keynames and vice versa.

MIT
Latest version published 2 years ago

Package Health Score

68 / 100
Full package analysis