sanniassin / react-input-mask

Input masking component for React. Made with attention to UX.
MIT License
2.22k stars 257 forks source link

Filtered props #158

Open artola opened 5 years ago

artola commented 5 years ago

disabled and readOnly are not passed down.

class MyMask extends React.Component {
  render() {
    return (
      <ReactInputMask {...this.props}>
        {(others) => <InputGroup {...others} />}
      </ReactInputMask>
    );
  }
}

In the code, the controlled props are cloned when necessary expect the above mentioned two.

const controlledProps = ['onChange', 'onPaste', 'onMouseDown', 'onFocus', 'onBlur', 'value', 'disabled', 'readOnly'];

This force us to pass these props directly to the input. Plus: it would be nice pass-down also inputRef when a render-prop function is used.

Is this intended by some reason? Else, it would be nice to pass all these props.

class MyMask extends React.Component {
  render() {
    const {inputRef, ...rest} = this.props;
    const {disabled, readOnly} = this.props;

    return (
      <ReactInputMask {...rest}>
        {(props) => <InputGroup inputRef={inputRef} disabled={disabled} readOnly={readOnly} {...props} />}
      </ReactInputMask>
    );
  }
}