Repository: plotly/dash
File: components/dash-core-components/src/components/Input.react.js (JavaScript)

Code before:
        let {className} = this.props;
        className = 'dash-input' + (className ? ` ${className}` : '');
        return (
            <input
                data-dash-is-loading={
                    (loading_state && loading_state.is_loading) || undefined
                }
                className={className}
                ref={this.input}
                onBlur={this.onBlur}
                onChange={this.onChange}
                onKeyPress={this.onKeyPress}
                {...valprops}
                {...omit(
                    [
                        'className',
                        'debounce',
                        'value',
                        'n_blur',
                        'n_blur_timestamp',
                        'n_submit',
                        'n_submit_timestamp',
                        'selectionDirection',
                        'selectionEnd',
                        'selectionStart',
                        'setProps',
                        'loading_state',
                    ],
                    this.props
                )}
            />
        );
    }

    setInputValue(base, value) {
        const __value = value;
        base = this.input.current.checkValidity() ? convert(base) : NaN;
        value = convert(value);

        if (!isEquivalent(base, value)) {
            this.input.current.value = isNumeric(value) ? value : __value;
        }
    }

    setPropValue(base, value) {
        base = convert(base);
        value = this.input.current.checkValidity() ? convert(value) : NaN;

        if (!isEquivalent(base, value)) {
            this.props.setProps({value});
        }

Review comment (suggestion):
FYI we use this a lot but I'd love to get rid of this `...omit` pattern pretty much wherever we use it. It causes various problems, like I bet we're currently improperly forwarding `persistence`/`persistence_type`/`persisted_props` here, and some other places we still forward `loading_state` so the DOM ends up with `loading_state="[object Object]". Instead we should figure out which props we DO want and [pick](https://ramdajs.com/docs/#pick) them, or just individually forward them. I thought I had made an issue for this but not seeing it now 🤔 

Code after:
    UNSAFE_componentWillMount() {
        if (this.props.type !== 'number') {
            this.setState({value: this.props.value});
        }
    }

    render() {
        const valprops =
            this.props.type === 'number' ? {} : {value: this.state.value};
        const {loading_state} = this.props;
        let {className} = this.props;
        className = 'dash-input' + (className ? ` ${className}` : '');
        return (
            <input
                data-dash-is-loading={
                    (loading_state && loading_state.is_loading) || undefined
                }
                className={className}
                ref={this.input}
                onBlur={this.onBlur}
                onChange={this.onChange}
                onKeyPress={this.onKeyPress}
                {...valprops}
                {...omit(
                    [
                        'className',
                        'debounce',
                        'value',
                        'n_blur',
                        'n_blur_timestamp',
                        'n_submit',
                        'n_submit_timestamp',
                        'selectionDirection',
                        'selectionEnd',
                        'selectionStart',
                        'setProps',
                        'loading_state',
                    ],
                    this.props
                )}
            />
        );
    }

    setInputValue(base, value) {
        const __value = value;
        base = this.input.current.checkValidity() ? convert(base) : NaN;
        value = convert(value);

        if (!isEquivalent(base, value)) {
            this.input.current.value = isNumeric(value) ? value : __value;