diff --git a/packages/core/src/common/keys.ts b/packages/core/src/common/keys.ts
index 5e17ce2b4f..041bdb0606 100644
--- a/packages/core/src/common/keys.ts
+++ b/packages/core/src/common/keys.ts
@@ -15,3 +15,8 @@ export const ARROW_UP = 38;
 export const ARROW_RIGHT = 39;
 export const ARROW_DOWN = 40;
 export const DELETE = 46;
+
+/** Returns whether the key code is `enter` or `space`, the two keys that can click a button. */
+export function isKeyboardClick(keyCode: number) {
+    return keyCode === ENTER || keyCode === SPACE;
+}
diff --git a/packages/core/src/components/button/abstractButton.tsx b/packages/core/src/components/button/abstractButton.tsx
index 088353d02f..e86561c0d3 100644
--- a/packages/core/src/components/button/abstractButton.tsx
+++ b/packages/core/src/components/button/abstractButton.tsx
@@ -125,7 +125,7 @@ export abstract class AbstractButton<H extends React.HTMLAttributes<any>> extend
     // argument because it is not a supertype of candidate
     // 'KeyboardEvent<HTMLElement>'."
     protected handleKeyDown = (e: React.KeyboardEvent<any>) => {
-        if (isKeyboardClick(e.which)) {
+        if (Keys.isKeyboardClick(e.which)) {
             e.preventDefault();
             if (e.which !== this.currentKeyDown) {
                 this.setState({ isActive: true });
@@ -136,7 +136,7 @@ export abstract class AbstractButton<H extends React.HTMLAttributes<any>> extend
     };
 
     protected handleKeyUp = (e: React.KeyboardEvent<any>) => {
-        if (isKeyboardClick(e.which)) {
+        if (Keys.isKeyboardClick(e.which)) {
             this.setState({ isActive: false });
             this.buttonRef.click();
         }
@@ -159,7 +159,3 @@ export abstract class AbstractButton<H extends React.HTMLAttributes<any>> extend
         ];
     }
 }
-
-function isKeyboardClick(keyCode: number) {
-    return keyCode === Keys.ENTER || keyCode === Keys.SPACE;
-}
diff --git a/packages/core/src/components/forms/numericInput.tsx b/packages/core/src/components/forms/numericInput.tsx
index e1a487416e..f9bab4c3d6 100644
--- a/packages/core/src/components/forms/numericInput.tsx
+++ b/packages/core/src/components/forms/numericInput.tsx
@@ -25,7 +25,16 @@ import * as Errors from "../../common/errors";
 
 import { ButtonGroup } from "../button/buttonGroup";
 import { Button } from "../button/buttons";
+import { ControlGroup } from "./controlGroup";
 import { InputGroup } from "./inputGroup";
+import {
+    clampValue,
+    getValueOrEmptyValue,
+    isFloatingPointNumericCharacter,
+    isValidNumericKeyboardEvent,
+    isValueNumeric,
+    toMaxPrecision,
+} from "./numericInputUtils";
 
 export interface INumericInputProps extends IIntentProps, IProps {
     /**
@@ -128,11 +137,9 @@ export interface INumericInputProps extends IIntentProps, IProps {
 }
 
 export interface INumericInputState {
-    isInputGroupFocused?: boolean;
-    isButtonGroupFocused?: boolean;
-    shouldSelectAfterUpdate?: boolean;
-    stepMaxPrecision?: number;
-    value?: string;
+    shouldSelectAfterUpdate: boolean;
+    stepMaxPrecision: number;
+    value: string;
 }
 
 enum IncrementDirection {
@@ -140,6 +147,23 @@ enum IncrementDirection {
     UP = +1,
 }
 
+const NON_HTML_PROPS = [
+    "allowNumericCharactersOnly",
+    "buttonPosition",
+    "clampValueOnBlur",
+    "className",
+    "large",
+    "majorStepSize",
+    "minorStepSize",
+    "onButtonClick",
+    "onValueChange",
+    "selectAllOnFocus",
+    "selectAllOnIncrement",
+    "stepSize",
+];
+
+type ButtonEventHandlers = Required<Pick<React.HTMLAttributes<Element>, "onKeyDown" | "onMouseDown">>;
+
 export class NumericInput extends AbstractPureComponent<HTMLInputProps & INumericInputProps, INumericInputState> {
     public static displayName = `${DISPLAYNAME_PREFIX}.NumericInput`;
 
@@ -159,48 +183,28 @@ export class NumericInput extends AbstractPureComponent<HTMLInputProps & INumeri
         value: NumericInput.VALUE_EMPTY,
     };
 
-    private static DECREMENT_KEY = "decrement";
-    private static INCREMENT_KEY = "increment";
-
-    private static DECREMENT_ICON_NAME: IconName = "chevron-down";
-    private static INCREMENT_ICON_NAME: IconName = "chevron-up";
-
-    /**
-     * A regex that matches a string of length 1 (i.e. a standalone character)
-     * if and only if it is a floating-point number character as defined by W3C:
-     * https://www.w3.org/TR/2012/WD-html-markup-20120329/datatypes.html#common.data.float
-     *
-     * Floating-point number characters are the only characters that can be
-     * printed within a default input[type="number"]. This component should
-     * behave the same way when this.props.allowNumericCharactersOnly = true.
-     * See here for the input[type="number"].value spec:
-     * https://www.w3.org/TR/2012/WD-html-markup-20120329/input.number.html#input.number.attrs.value
-     */
-    private static FLOATING_POINT_NUMBER_CHARACTER_REGEX = /^[Ee0-9\+\-\.]$/;
-
     private static CONTINUOUS_CHANGE_DELAY = 300;
     private static CONTINUOUS_CHANGE_INTERVAL = 100;
 
-    private inputElement: HTMLInputElement;
+    public state: INumericInputState = {
+        shouldSelectAfterUpdate: false,
+        stepMaxPrecision: this.getStepMaxPrecision(this.props),
+        value: getValueOrEmptyValue(this.props.value),
+    };
 
     // updating these flags need not trigger re-renders, so don't include them in this.state.
     private didPasteEventJustOccur = false;
-    private shouldSelectAfterUpdate = false;
     private delta = 0;
+    private inputElement: HTMLInputElement | null = null;
     private intervalId: number | null = null;
 
-    public constructor(props?: HTMLInputProps & INumericInputProps, context?: any) {
-        super(props, context);
-        this.state = {
-            stepMaxPrecision: this.getStepMaxPrecision(props),
-            value: this.getValueOrEmptyValue(props.value),
-        };
-    }
+    private incrementButtonHandlers = this.getButtonEventHandlers(IncrementDirection.UP);
+    private decrementButtonHandlers = this.getButtonEventHandlers(IncrementDirection.DOWN);
 
     public componentWillReceiveProps(nextProps: HTMLInputProps & INumericInputProps) {
         super.componentWillReceiveProps(nextProps);
 
-        const value = this.getValueOrEmptyValue(nextProps.value);
+        const value = getValueOrEmptyValue(nextProps.value);
 
         const didMinChange = nextProps.min !== this.props.min;
         const didMaxChange = nextProps.max !== this.props.max;
@@ -225,94 +229,19 @@ export class NumericInput extends AbstractPureComponent<HTMLInputProps & INumeri
 
     public render() {
         const { buttonPosition, className, fill, large } = this.props;
-
-        const inputGroupHtmlProps = removeNonHTMLProps(
-            this.props,
-            [
-                "allowNumericCharactersOnly",
-                "buttonPosition",
-                "clampValueOnBlur",
-                "className",
-                "large",
-                "majorStepSize",
-                "minorStepSize",
-                "onButtonClick",
-                "onValueChange",
-                "selectAllOnFocus",
-                "selectAllOnIncrement",
-                "stepSize",
-            ],
-            true,
-        );
-
-        const inputGroup = (
-            <InputGroup
-                autoComplete="off"
-                {...inputGroupHtmlProps}
-                intent={this.props.intent}
-                inputRef={this.inputRef}
-                key="input-group"
-                large={large}
-                leftIcon={this.props.leftIcon}
-                onFocus={this.handleInputFocus}
-                onBlur={this.handleInputBlur}
-                onChange={this.handleInputChange}
-                onKeyDown={this.handleInputKeyDown}
-                onKeyPress={this.handleInputKeyPress}
-                onPaste={this.handleInputPaste}
-                value={this.state.value}
-            />
+        const containerClasses = classNames(Classes.NUMERIC_INPUT, { [Classes.LARGE]: large }, className);
+        const buttons = this.renderButtons();
+        return (
+            <ControlGroup className={containerClasses} fill={fill}>
+                {buttonPosition === Position.LEFT && buttons}
+                {this.renderInput()}
+                {buttonPosition === Position.RIGHT && buttons}
+            </ControlGroup>
         );
-
-        // the strict null check here is intentional; an undefined value should
-        // fall back to the default button position on the right side.
-        if (buttonPosition === "none" || buttonPosition === null) {
-            // If there are no buttons, then the control group will render the
-            // text field with squared border-radii on the left side, causing it
-            // to look weird. This problem goes away if we simply don't nest within
-            // a control group.
-            return <div className={className}>{inputGroup}</div>;
-        } else {
-            const incrementButton = this.renderButton(
-                NumericInput.INCREMENT_KEY,
-                NumericInput.INCREMENT_ICON_NAME,
-                this.handleIncrementButtonMouseDown,
-                this.handleIncrementButtonKeyDown,
-                this.handleIncrementButtonKeyUp,
-            );
-            const decrementButton = this.renderButton(
-                NumericInput.DECREMENT_KEY,
-                NumericInput.DECREMENT_ICON_NAME,
-                this.handleDecrementButtonMouseDown,
-                this.handleDecrementButtonKeyDown,
-                this.handleDecrementButtonKeyUp,
-            );
-
-            const buttonGroup = (
-                <ButtonGroup className={Classes.FIXED} key="button-group" vertical={true}>
-                    {incrementButton}
-                    {decrementButton}
-                </ButtonGroup>
-            );
-
-            const inputElems = buttonPosition === Position.LEFT ? [buttonGroup, inputGroup] : [inputGroup, buttonGroup];
-
-            const classes = classNames(
-                Classes.NUMERIC_INPUT,
-                Classes.CONTROL_GROUP,
-                {
-                    [Classes.FILL]: fill,
-                    [Classes.LARGE]: large,
-                },
-                className,
-            );
-
-            return <div className={classes}>{inputElems}</div>;
-        }
     }
 
     public componentDidUpdate() {
-        if (this.shouldSelectAfterUpdate) {
+        if (this.state.shouldSelectAfterUpdate) {
             this.inputElement.setSelectionRange(0, this.state.value.length);
         }
     }
@@ -345,29 +274,39 @@ export class NumericInput extends AbstractPureComponent<HTMLInputProps & INumeri
     // Render Helpers
     // ==============
 
-    private renderButton(
-        key: string,
-        iconName: IconName,
-        onMouseDown: React.MouseEventHandler<HTMLElement>,
-        onKeyDown: React.KeyboardEventHandler<HTMLElement>,
-        onKeyUp: React.KeyboardEventHandler<HTMLElement>,
-    ) {
+    private renderButtons() {
+        const { intent } = this.props;
+        const disabled = this.props.disabled || this.props.readOnly;
+        return (
+            <ButtonGroup className={Classes.FIXED} key="button-group" vertical={true}>
+                <Button disabled={disabled} icon="chevron-up" intent={intent} {...this.incrementButtonHandlers} />
+                <Button disabled={disabled} icon="chevron-down" intent={intent} {...this.decrementButtonHandlers} />
+            </ButtonGroup>
+        );
+    }
+
+    private renderInput() {
+        const inputGroupHtmlProps = removeNonHTMLProps(this.props, NON_HTML_PROPS, true);
         return (
-            <Button
-                disabled={this.props.disabled || this.props.readOnly}
-                icon={iconName}
+            <InputGroup
+                autoComplete="off"
+                {...inputGroupHtmlProps}
                 intent={this.props.intent}
-                key={key}
-                onBlur={this.handleButtonBlur}
-                onMouseDown={onMouseDown}
-                onFocus={this.handleButtonFocus}
-                onKeyDown={onKeyDown}
-                onKeyUp={onKeyUp}
+                inputRef={this.inputRef}
+                large={this.props.large}
+                leftIcon={this.props.leftIcon}
+                onFocus={this.handleInputFocus}
+                onBlur={this.handleInputBlur}
+                onChange={this.handleInputChange}
+                onKeyDown={this.handleInputKeyDown}
+                onKeyPress={this.handleInputKeyPress}
+                onPaste={this.handleInputPaste}
+                value={this.state.value}
             />
         );
     }
 
-    private inputRef = (input: HTMLInputElement) => {
+    private inputRef = (input: HTMLInputElement | null) => {
         this.inputElement = input;
         Utils.safeInvoke(this.props.inputRef, input);
     };
@@ -375,80 +314,27 @@ export class NumericInput extends AbstractPureComponent<HTMLInputProps & INumeri
     // Callbacks - Buttons
     // ===================
 
-    private handleDecrementButtonClick = (e: React.MouseEvent<HTMLInputElement>) => {
-        this.handleButtonClick(e, IncrementDirection.DOWN);
-    };
-
-    private handleDecrementButtonMouseDown = (e: React.MouseEvent<HTMLInputElement>) => {
-        this.handleButtonClick(e, IncrementDirection.DOWN);
-        this.startContinuousChange();
-    };
-
-    private handleDecrementButtonKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
-        this.updateDelta(IncrementDirection.DOWN, e);
-    };
-
-    private handleDecrementButtonKeyUp = (e: React.KeyboardEvent<HTMLInputElement>) => {
-        this.handleButtonKeyUp(e, IncrementDirection.DOWN, this.handleDecrementButtonClick);
-    };
-
-    private handleIncrementButtonClick = (e: React.MouseEvent<HTMLInputElement>) => {
-        this.handleButtonClick(e, IncrementDirection.UP);
-    };
-
-    private handleIncrementButtonMouseDown = (e: React.MouseEvent<HTMLInputElement>) => {
-        this.handleButtonClick(e, IncrementDirection.UP);
-        this.startContinuousChange();
-    };
-
-    private handleIncrementButtonKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
-        this.updateDelta(IncrementDirection.UP, e);
-    };
-
-    private handleIncrementButtonKeyUp = (e: React.KeyboardEvent<HTMLInputElement>) => {
-        this.handleButtonKeyUp(e, IncrementDirection.UP, this.handleIncrementButtonClick);
-    };
+    private getButtonEventHandlers(direction: IncrementDirection): ButtonEventHandlers {
+        return {
+            // keydown is fired repeatedly when held so it's implicitly continuous
+            onKeyDown: evt => {
+                if (Keys.isKeyboardClick(evt.keyCode)) {
+                    this.handleButtonClick(evt, direction);
+                }
+            },
+            onMouseDown: evt => {
+                this.handleButtonClick(evt, direction);
+                this.startContinuousChange();
+            },
+        };
+    }
 
-    private handleButtonClick = (e: React.MouseEvent<HTMLInputElement>, direction: IncrementDirection) => {
+    private handleButtonClick = (e: React.MouseEvent | React.KeyboardEvent, direction: IncrementDirection) => {
         const delta = this.updateDelta(direction, e);
         const nextValue = this.incrementValue(delta);
         this.invokeValueCallback(nextValue, this.props.onButtonClick);
     };
 
-    private handleButtonFocus = () => {
-        this.setState({ isButtonGroupFocused: true });
-    };
-
-    private handleButtonBlur = () => {
-        this.setState({ isButtonGroupFocused: false });
-    };
-
-    private handleButtonKeyUp = (
-        e: React.KeyboardEvent<HTMLInputElement>,
-        direction: IncrementDirection,
-        onClick: React.MouseEventHandler<HTMLInputElement>,
-    ) => {
-        this.updateDelta(direction, e);
-        // respond explicitly on key *up*, because onKeyDown triggers multiple
-        // times and doesn't always receive modifier-key flags, leading to an
-        // unintuitive/out-of-control incrementing experience.
-        if (e.keyCode === Keys.SPACE || e.keyCode === Keys.ENTER) {
-            // prevent the page from scrolling (this is the default browser
-            // behavior for shift + space or alt + space).
-            e.preventDefault();
-
-            // trigger a click event to update the input value appropriately,
-            // based on the active modifier keys.
-            const fakeClickEvent = {
-                altKey: e.altKey,
-                currentTarget: e.currentTarget,
-                shiftKey: e.shiftKey,
-                target: e.target,
-            };
-            onClick(fakeClickEvent as React.MouseEvent<HTMLInputElement>);
-        }
-    };
-
     private startContinuousChange() {
         // The button's onMouseUp event handler doesn't fire if the user
         // releases outside of the button, so we need to watch all the way
@@ -477,33 +363,29 @@ export class NumericInput extends AbstractPureComponent<HTMLInputProps & INumeri
     // Callbacks - Input
     // =================
 
-    private handleInputFocus = (e: React.FocusEvent<HTMLInputElement>) => {
-        this.shouldSelectAfterUpdate = this.props.selectAllOnFocus;
-        this.setState({ isInputGroupFocused: true });
+    private handleInputFocus = (e: React.FocusEvent) => {
+        // update this state flag to trigger update for input selection (see componentDidUpdate)
+        this.setState({ shouldSelectAfterUpdate: this.props.selectAllOnFocus });
         Utils.safeInvoke(this.props.onFocus, e);
     };
 
     private handleInputBlur = (e: React.FocusEvent<HTMLInputElement>) => {
-        // explicitly set `shouldSelectAfterUpdate` to `false` to prevent focus
-        // hoarding on IE11 (#704)
-        this.shouldSelectAfterUpdate = false;
+        // always disable this flag on blur so it's ready for next time.
+        this.setState({ shouldSelectAfterUpdate: false });
 
-        const baseStateChange: INumericInputState = { isInputGroupFocused: false };
         if (this.props.clampValueOnBlur) {
-            const value = (e.target as HTMLInputElement).value;
+            const { value } = e.target as HTMLInputElement;
             const sanitizedValue = this.getSanitizedValue(value);
-            this.setState({ ...baseStateChange, value: sanitizedValue });
+            this.setState({ value: sanitizedValue });
             if (value !== sanitizedValue) {
                 this.invokeValueCallback(sanitizedValue, this.props.onValueChange);
             }
-        } else {
-            this.setState(baseStateChange);
         }
 
         Utils.safeInvoke(this.props.onBlur, e);
     };
 
-    private handleInputKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
+    private handleInputKeyDown = (e: React.KeyboardEvent) => {
         if (this.props.disabled || this.props.readOnly) {
             return;
         }
@@ -533,38 +415,34 @@ export class NumericInput extends AbstractPureComponent<HTMLInputProps & INumeri
         Utils.safeInvoke(this.props.onKeyDown, e);
     };
 
-    private handleInputKeyPress = (e: React.KeyboardEvent<HTMLInputElement>) => {
+    private handleInputKeyPress = (e: React.KeyboardEvent) => {
         // we prohibit keystrokes in onKeyPress instead of onKeyDown, because
         // e.key is not trustworthy in onKeyDown in all browsers.
-        if (this.props.allowNumericCharactersOnly && this.isKeyboardEventDisabledForBasicNumericEntry(e)) {
+        if (this.props.allowNumericCharactersOnly && !isValidNumericKeyboardEvent(e)) {
             e.preventDefault();
         }
 
         Utils.safeInvoke(this.props.onKeyPress, e);
     };
 
-    private handleInputPaste = (e: React.ClipboardEvent<HTMLInputElement>) => {
+    private handleInputPaste = (e: React.ClipboardEvent) => {
         this.didPasteEventJustOccur = true;
         Utils.safeInvoke(this.props.onPaste, e);
     };
 
-    private handleInputChange = (e: React.FormEvent<HTMLInputElement>) => {
-        const value = (e.target as HTMLInputElement).value;
-
-        let nextValue: string;
+    private handleInputChange = (e: React.FormEvent) => {
+        const { value } = e.target as HTMLInputElement;
 
+        let nextValue = value;
         if (this.props.allowNumericCharactersOnly && this.didPasteEventJustOccur) {
             this.didPasteEventJustOccur = false;
             const valueChars = value.split("");
-            const sanitizedValueChars = valueChars.filter(this.isFloatingPointNumericCharacter);
+            const sanitizedValueChars = valueChars.filter(isFloatingPointNumericCharacter);
             const sanitizedValue = sanitizedValueChars.join("");
             nextValue = sanitizedValue;
-        } else {
-            nextValue = value;
         }
 
-        this.shouldSelectAfterUpdate = false;
-        this.setState({ value: nextValue });
+        this.setState({ shouldSelectAfterUpdate: false, value: nextValue });
         this.invokeValueCallback(nextValue, this.props.onValueChange);
     };
 
@@ -580,8 +458,7 @@ export class NumericInput extends AbstractPureComponent<HTMLInputProps & INumeri
         const currValue = this.state.value || NumericInput.VALUE_ZERO;
         const nextValue = this.getSanitizedValue(currValue, delta);
 
-        this.shouldSelectAfterUpdate = this.props.selectAllOnIncrement;
-        this.setState({ value: nextValue });
+        this.setState({ shouldSelectAfterUpdate: this.props.selectAllOnIncrement, value: nextValue });
         this.invokeValueCallback(nextValue, this.props.onValueChange);
 
         return nextValue;
@@ -600,64 +477,11 @@ export class NumericInput extends AbstractPureComponent<HTMLInputProps & INumeri
     }
 
     private getSanitizedValue(value: string, delta = 0, min = this.props.min, max = this.props.max) {
-        if (!this.isValueNumeric(value)) {
+        if (!isValueNumeric(value)) {
             return NumericInput.VALUE_EMPTY;
         }
-
-        let nextValue = this.toMaxPrecision(parseFloat(value) + delta);
-
-        // defaultProps won't work if the user passes in null, so just default
-        // to +/- infinity here instead, as a catch-all.
-        const adjustedMin = min != null ? min : -Infinity;
-        const adjustedMax = max != null ? max : Infinity;
-        nextValue = Utils.clamp(nextValue, adjustedMin, adjustedMax);
-
-        return nextValue.toString();
-    }
-
-    private getValueOrEmptyValue(value: number | string) {
-        return value != null ? value.toString() : NumericInput.VALUE_EMPTY;
-    }
-
-    private isValueNumeric(value: string) {
-        // checking if a string is numeric in Typescript is a big pain, because
-        // we can't simply toss a string parameter to isFinite. below is the
-        // essential approach that jQuery uses, which involves subtracting a
-        // parsed numeric value from the string representation of the value. we
-        // need to cast the value to the `any` type to allow this operation
-        // between dissimilar types.
-        return value != null && (value as any) - parseFloat(value) + 1 >= 0;
-    }
-
-    private isKeyboardEventDisabledForBasicNumericEntry(e: React.KeyboardEvent<HTMLInputElement>) {
-        // unit tests may not include e.key. don't bother disabling those events.
-        if (e.key == null) {
-            return false;
-        }
-
-        // allow modified key strokes that may involve letters and other
-        // non-numeric/invalid characters (Cmd + A, Cmd + C, Cmd + V, Cmd + X).
-        if (e.ctrlKey || e.altKey || e.metaKey) {
-            return false;
-        }
-
-        // keys that print a single character when pressed have a `key` name of
-        // length 1. every other key has a longer `key` name (e.g. "Backspace",
-        // "ArrowUp", "Shift"). since none of those keys can print a character
-        // to the field--and since they may have important native behaviors
-        // beyond printing a character--we don't want to disable their effects.
-        const isSingleCharKey = e.key.length === 1;
-        if (!isSingleCharKey) {
-            return false;
-        }
-
-        // now we can simply check that the single character that wants to be printed
-        // is a floating-point number character that we're allowed to print.
-        return !this.isFloatingPointNumericCharacter(e.key);
-    }
-
-    private isFloatingPointNumericCharacter(character: string) {
-        return NumericInput.FLOATING_POINT_NUMBER_CHARACTER_REGEX.test(character);
+        const nextValue = toMaxPrecision(parseFloat(value) + delta, this.state.stepMaxPrecision);
+        return clampValue(nextValue, min, max).toString();
     }
 
     private getStepMaxPrecision(props: HTMLInputProps & INumericInputProps) {
@@ -668,18 +492,7 @@ export class NumericInput extends AbstractPureComponent<HTMLInputProps & INumeri
         }
     }
 
-    private toMaxPrecision(value: number) {
-        // round the value to have the specified maximum precision (toFixed is the wrong choice,
-        // because it would show trailing zeros in the decimal part out to the specified precision)
-        // source: http://stackoverflow.com/a/18358056/5199574
-        const scaleFactor = Math.pow(10, this.state.stepMaxPrecision);
-        return Math.round(value * scaleFactor) / scaleFactor;
-    }
-
-    private updateDelta(
-        direction: IncrementDirection,
-        e: React.MouseEvent<HTMLInputElement> | React.KeyboardEvent<HTMLInputElement>,
-    ) {
+    private updateDelta(direction: IncrementDirection, e: React.MouseEvent | React.KeyboardEvent) {
         this.delta = this.getIncrementDelta(direction, e.shiftKey, e.altKey);
         return this.delta;
     }
diff --git a/packages/core/src/components/forms/numericInputUtils.ts b/packages/core/src/components/forms/numericInputUtils.ts
new file mode 100644
index 0000000000..82520888d7
--- /dev/null
+++ b/packages/core/src/components/forms/numericInputUtils.ts
@@ -0,0 +1,87 @@
+/*
+ * Copyright 2018 Palantir Technologies, Inc. All rights reserved.
+ *
+ * Licensed under the terms of the LICENSE file distributed with this project.
+ */
+
+import { clamp } from "../../common/utils";
+
+export function clampValue(value: number, min?: number, max?: number) {
+    // defaultProps won't work if the user passes in null, so just default
+    // to +/- infinity here instead, as a catch-all.
+    const adjustedMin = min != null ? min : -Infinity;
+    const adjustedMax = max != null ? max : Infinity;
+    return clamp(value, adjustedMin, adjustedMax);
+}
+
+export function getValueOrEmptyValue(value: number | string = "") {
+    return value.toString();
+}
+
+/** Returns `true` if the string represents a valid numeric value, like "1e6". */
+export function isValueNumeric(value: string) {
+    // checking if a string is numeric in Typescript is a big pain, because
+    // we can't simply toss a string parameter to isFinite. below is the
+    // essential approach that jQuery uses, which involves subtracting a
+    // parsed numeric value from the string representation of the value. we
+    // need to cast the value to the `any` type to allow this operation
+    // between dissimilar types.
+    return value != null && (value as any) - parseFloat(value) + 1 >= 0;
+}
+
+export function isValidNumericKeyboardEvent(e: React.KeyboardEvent) {
+    // unit tests may not include e.key. don't bother disabling those events.
+    if (e.key == null) {
+        return true;
+    }
+
+    // allow modified key strokes that may involve letters and other
+    // non-numeric/invalid characters (Cmd + A, Cmd + C, Cmd + V, Cmd + X).
+    if (e.ctrlKey || e.altKey || e.metaKey) {
+        return true;
+    }
+
+    // keys that print a single character when pressed have a `key` name of
+    // length 1. every other key has a longer `key` name (e.g. "Backspace",
+    // "ArrowUp", "Shift"). since none of those keys can print a character
+    // to the field--and since they may have important native behaviors
+    // beyond printing a character--we don't want to disable their effects.
+    const isSingleCharKey = e.key.length === 1;
+    if (!isSingleCharKey) {
+        return true;
+    }
+
+    // now we can simply check that the single character that wants to be printed
+    // is a floating-point number character that we're allowed to print.
+    return isFloatingPointNumericCharacter(e.key);
+}
+
+/**
+ * A regex that matches a string of length 1 (i.e. a standalone character)
+ * if and only if it is a floating-point number character as defined by W3C:
+ * https://www.w3.org/TR/2012/WD-html-markup-20120329/datatypes.html#common.data.float
+ *
+ * Floating-point number characters are the only characters that can be
+ * printed within a default input[type="number"]. This component should
+ * behave the same way when this.props.allowNumericCharactersOnly = true.
+ * See here for the input[type="number"].value spec:
+ * https://www.w3.org/TR/2012/WD-html-markup-20120329/input.number.html#input.number.attrs.value
+ */
+const FLOATING_POINT_NUMBER_CHARACTER_REGEX = /^[Ee0-9\+\-\.]$/;
+export function isFloatingPointNumericCharacter(character: string) {
+    return FLOATING_POINT_NUMBER_CHARACTER_REGEX.test(character);
+}
+
+/**
+ * Round the value to have _up to_ the specified maximum precision.
+ *
+ * This differs from `toFixed(5)` in that trailing zeroes are not added on
+ * more precise values, resulting in shorter strings.
+ */
+export function toMaxPrecision(value: number, maxPrecision: number) {
+    // round the value to have the specified maximum precision (toFixed is the wrong choice,
+    // because it would show trailing zeros in the decimal part out to the specified precision)
+    // source: http://stackoverflow.com/a/18358056/5199574
+    const scaleFactor = Math.pow(10, maxPrecision);
+    return Math.round(value * scaleFactor) / scaleFactor;
+}
diff --git a/packages/core/src/components/tabs/tabs.tsx b/packages/core/src/components/tabs/tabs.tsx
index 40bff2d438..74d6439cc6 100644
--- a/packages/core/src/components/tabs/tabs.tsx
+++ b/packages/core/src/components/tabs/tabs.tsx
@@ -236,7 +236,7 @@ export class Tabs extends AbstractPureComponent<ITabsProps, ITabsState> {
 
     private handleKeyPress = (e: React.KeyboardEvent<HTMLDivElement>) => {
         const targetTabElement = (e.target as HTMLElement).closest(TAB_SELECTOR) as HTMLElement;
-        if (targetTabElement != null && isEventKeyCode(e, Keys.SPACE, Keys.ENTER)) {
+        if (targetTabElement != null && Keys.isKeyboardClick(e.which)) {
             e.preventDefault();
             targetTabElement.click();
         }
diff --git a/packages/core/test/controls/numericInputTests.tsx b/packages/core/test/controls/numericInputTests.tsx
index 770626e42e..2739320106 100644
--- a/packages/core/test/controls/numericInputTests.tsx
+++ b/packages/core/test/controls/numericInputTests.tsx
@@ -4,7 +4,7 @@
  */
 
 import { expect } from "chai";
-import { mount, ReactWrapper } from "enzyme";
+import { mount, ReactWrapper, shallow } from "enzyme";
 import * as React from "react";
 import { spy } from "sinon";
 
@@ -14,7 +14,7 @@ import * as Errors from "../../src/common/errors";
 import {
     Button,
     ButtonGroup,
-    Classes,
+    ControlGroup,
     HTMLInputProps,
     Icon,
     InputGroup,
@@ -27,11 +27,11 @@ import {
 describe("<NumericInput>", () => {
     describe("Defaults", () => {
         it("renders the buttons on the right by default", () => {
-            const component = mount(<NumericInput />).children();
-            const leftGroup = component.childAt(0);
-            const rightGroup = component.childAt(1);
-            expect(leftGroup.is(InputGroup)).to.be.true;
-            expect(rightGroup.key()).to.equal("button-group");
+            // this ordering is trivial to test with shallow renderer
+            // (no DOM elements getting in the way)
+            const component = shallow(<NumericInput />);
+            const rightGroup = component.children().last();
+            expect(rightGroup.is(ButtonGroup)).to.be.true;
         });
 
         it("has a stepSize of 1 by default", () => {
@@ -71,47 +71,36 @@ describe("<NumericInput>", () => {
 
     describe("Button position", () => {
         it("renders the buttons on the right when buttonPosition == Position.RIGHT", () => {
-            const component = mount(<NumericInput buttonPosition={Position.RIGHT} />);
-            const buttonGroup = component.children().childAt(1);
-            expect(buttonGroup.is(ButtonGroup)).to.be.true;
+            const buttons = shallow(<NumericInput buttonPosition={Position.RIGHT} />)
+                .children()
+                .last();
+            expect(buttons.is(ButtonGroup)).to.be.true;
         });
 
         it("renders the buttons on the left when buttonPosition == Position.LEFT", () => {
-            const component = mount(<NumericInput buttonPosition={Position.LEFT} />);
-            const buttonGroup = component.children().childAt(0);
-            expect(buttonGroup.is(ButtonGroup)).to.be.true;
+            const buttons = shallow(<NumericInput buttonPosition={Position.LEFT} />)
+                .children()
+                .first();
+            expect(buttons.is(ButtonGroup)).to.be.true;
         });
 
         it('does not render the buttons when buttonPosition == "none"', () => {
-            const component = mount(<NumericInput buttonPosition="none" />);
+            const component = shallow(<NumericInput buttonPosition="none" />);
             expect(component.find(ButtonGroup).exists()).to.be.false;
         });
 
         it("does not render the buttons when buttonPosition is null", () => {
-            const component = mount(<NumericInput buttonPosition={null} />);
+            const component = shallow(<NumericInput buttonPosition={null} />);
             expect(component.find(ButtonGroup).exists()).to.be.false;
         });
 
-        it(`renders the children in a ${Classes.CONTROL_GROUP} when buttons are visible`, () => {
-            // if the input is put into a control group by itself, it'll have squared border radii
-            // on the left, which we don't want.
-            const component = mount(<NumericInput />);
-
-            const index = component.html().indexOf(Classes.CONTROL_GROUP);
-            const isClassPresent = index >= 0;
-
-            expect(isClassPresent).to.be.true;
-        });
-
-        it(`does not render the children in a ${Classes.CONTROL_GROUP} when buttons are hidden`, () => {
+        it(`always renders the children in a ControlGroup`, () => {
             // if the input is put into a control group by itself, it'll have squared border radii
             // on the left, which we don't want.
-            const component = mount(<NumericInput buttonPosition={null} />);
-
-            const index = component.html().indexOf(Classes.CONTROL_GROUP);
-            const isClassPresent = index >= 0;
-
-            expect(isClassPresent).to.be.false;
+            const component = shallow<INumericInputProps>(<NumericInput />);
+            expect(component.find(ControlGroup).exists()).to.be.true;
+            component.setProps({ buttonPosition: null });
+            expect(component.find(ControlGroup).exists()).to.be.true;
         });
     });
 
@@ -119,8 +108,7 @@ describe("<NumericInput>", () => {
         it("works like a text input", () => {
             const component = mount(<NumericInput />);
 
-            const inputField = component.find("input");
-            inputField.simulate("change", { target: { value: "11" } });
+            component.find("input").simulate("change", { target: { value: "11" } });
 
             const value = component.state().value;
             const expectedValue = "11";
@@ -130,8 +118,7 @@ describe("<NumericInput>", () => {
         it("allows entry of non-numeric characters", () => {
             const component = mount(<NumericInput />);
 
-            const inputField = component.find("input");
-            inputField.simulate("change", { target: { value: "3 + a" } });
+            component.find("input").simulate("change", { target: { value: "3 + a" } });
 
             const value = component.state().value;
             const expectedValue = "3 + a";
@@ -227,13 +214,11 @@ describe("<NumericInput>", () => {
 
             it("if true, selects all text on focus", () => {
                 const attachTo = document.createElement("div");
-                const component = mount(<NumericInput value={VALUE} selectAllOnFocus={true} />, { attachTo });
-
-                component.find("input").simulate("focus");
-
-                const input = attachTo.querySelector("input") as HTMLInputElement;
-                expect(input.selectionStart).to.equal(0);
-                expect(input.selectionEnd).to.equal(VALUE.length);
+                const input = mount(<NumericInput value={VALUE} selectAllOnFocus={true} />, { attachTo }).find("input");
+                input.simulate("focus");
+                const { selectionStart, selectionEnd } = input.getDOMNode() as HTMLInputElement;
+                expect(selectionStart).to.equal(0);
+                expect(selectionEnd).to.equal(VALUE.length);
             });
         });
 
@@ -435,21 +420,13 @@ describe("<NumericInput>", () => {
 
     describe("Keyboard interactions in input field", () => {
         const simulateIncrement = (component: ReactWrapper<any, {}>, mockEvent?: IMockEvent) => {
-            const mergedMockEvent = mockEvent || {};
-            mergedMockEvent.keyCode = Keys.ARROW_UP;
-            mergedMockEvent.which = Keys.ARROW_UP;
-
             const inputField = component.find(InputGroup).find("input");
-            inputField.simulate("keyDown", mergedMockEvent);
+            inputField.simulate("keydown", addKeyCode(mockEvent, Keys.ARROW_UP));
         };
 
         const simulateDecrement = (component: ReactWrapper<any, {}>, mockEvent?: IMockEvent) => {
-            const mergedMockEvent = mockEvent || {};
-            mergedMockEvent.keyCode = Keys.ARROW_DOWN;
-            mergedMockEvent.which = Keys.ARROW_DOWN;
-
             const inputField = component.find(InputGroup).find("input");
-            inputField.simulate("keyDown", mergedMockEvent);
+            inputField.simulate("keydown", addKeyCode(mockEvent, Keys.ARROW_DOWN));
         };
 
         runInteractionSuite("Press '↑'", "Press '↓'", simulateIncrement, simulateDecrement);
@@ -457,45 +434,28 @@ describe("<NumericInput>", () => {
 
     // Enable these tests once we have a solution for testing Button onKeyUp callbacks (see PR #561)
     describe("Keyboard interactions on buttons (with Space key)", () => {
-        const simulateIncrement = (component: ReactWrapper<any, {}>, mockEvent?: IMockEvent) => {
-            const mergedMockEvent = mockEvent || {};
-            mergedMockEvent.keyCode = Keys.SPACE;
-            mergedMockEvent.which = Keys.SPACE;
-
+        const simulateIncrement = (component: ReactWrapper<any, {}>, mockEvent: IMockEvent = {}) => {
             const incrementButton = component.find(Button).first();
-            incrementButton.simulate("keyUp", mergedMockEvent);
+            incrementButton.simulate("keydown", addKeyCode(mockEvent, Keys.SPACE));
         };
 
-        const simulateDecrement = (component: ReactWrapper<any, {}>, mockEvent?: IMockEvent) => {
-            const mergedMockEvent = mockEvent || {};
-            mergedMockEvent.keyCode = Keys.SPACE;
-            mergedMockEvent.which = Keys.SPACE;
-
+        const simulateDecrement = (component: ReactWrapper<any, {}>, mockEvent: IMockEvent = {}) => {
             const decrementButton = component.find(Button).last();
-            decrementButton.simulate("keyUp", mergedMockEvent);
+            decrementButton.simulate("keydown", addKeyCode(mockEvent, Keys.SPACE));
         };
 
         runInteractionSuite("Press 'SPACE'", "Press 'SPACE'", simulateIncrement, simulateDecrement);
     });
 
-    // Enable these tests once we have a solution for testing Button onKeyUp callbacks (see PR #561)
     describe("Keyboard interactions on buttons (with Enter key)", () => {
         const simulateIncrement = (component: ReactWrapper<any, {}>, mockEvent?: IMockEvent) => {
-            const mergedMockEvent = mockEvent || {};
-            mergedMockEvent.keyCode = Keys.ENTER;
-            mergedMockEvent.which = Keys.ENTER;
-
             const incrementButton = component.find(Button).first();
-            incrementButton.simulate("keyUp", mergedMockEvent);
+            incrementButton.simulate("keydown", addKeyCode(mockEvent, Keys.ENTER));
         };
 
         const simulateDecrement = (component: ReactWrapper<any, {}>, mockEvent?: IMockEvent) => {
-            const mergedMockEvent = mockEvent || {};
-            mergedMockEvent.keyCode = Keys.ENTER;
-            mergedMockEvent.which = Keys.ENTER;
-
             const decrementButton = component.find(Button).last();
-            decrementButton.simulate("keyUp", mergedMockEvent);
+            decrementButton.simulate("keydown", addKeyCode(mockEvent, Keys.ENTER));
         };
 
         runInteractionSuite("Press 'ENTER'", "Press 'ENTER'", simulateIncrement, simulateDecrement);
@@ -1100,6 +1060,10 @@ describe("<NumericInput>", () => {
         });
     }
 
+    function addKeyCode(mockEvent: IMockEvent = {}, keyCode: number) {
+        return { ...mockEvent, keyCode };
+    }
+
     function stringToCharArray(str: string) {
         return str == null ? [] : str.split("");
     }