title: how to fix Datetime picker with masked input gives blank screen in safari?
body: <p>In redux-form i want to use datetime picker with manual date entry enabled. I have used maskediinput for proper format. It is working fine with all the browsers for normal page.  </p>
  
  <p>When clicking on the input it gives blank screen in modal specific for safari. I can't find what is the issue with safari-modal-datepicker-maskedinput !</p>
  
  <pre><code>renderDateTimePicker = ({ input: { onChange, value }, showTime, id, meta, isRequired, readOnly,inputReadOnly }) =&gt; {
  
      return (&lt;div&gt; &lt;DateTimePicker
          inputProps={{
              component: props =&gt; &lt;MaskedInput {...props}  readOnly={readOnly || inputReadOnly} type="text"
                       mask={[ /\d/, /\d/, /\d/, /\d/,".",/\d/, /\d/, ".", /\d/, /\d/ ]} /&gt;
          }}
          onChange={onChange}
          format="YYYY.MM.DD"
          time={showTime}
          id={id}
          name="completion_date"
          className="date_click"
          placeholder={isRequired === true ? id + " *" : id}
          value={!value ? null : new Date(value)}
      /&gt;{this.renderError(meta)}
      &lt;/div&gt;
      );
  }
  </code></pre>
  
  <p>Here is my package.json file :</p>
  
  <pre><code>{
      "name": "reduxapi",
      "version": "0.1.0",
      "private": true,
      "dependencies": {
          "@devexpress/dx-grid-core": "^1.10.1",
          "@devexpress/dx-react-core": "^1.10.1",
          "@devexpress/dx-react-grid": "^1.10.1",
          "@devexpress/dx-react-grid-material-ui": "^1.10.1",
          "@material-ui/core": "^3.9.2",
          "@material-ui/icons": "^3.0.2",
          "@types/bootstrap.v3.datetimepicker": "^4.17.46",
          "ag-grid": "^18.1.2",
          "ag-grid-community": "^20.0.0",
          "ag-grid-react": "^20.0.0",
          "axios": "^0.18.0",
          "bootstrap": "^3.4.0",
          "bootstrap-datepicker": "^1.8.0",
          "cryptr": "^4.0.2",
          "datatables.net": "^1.10.19",
          "eslint-config-react-app": "^4.0.1",
          "faker": "^4.1.0",
          "font-awesome": "^4.7.0",
          "jquery": "^1.11.2",
          "jspdf": "^1.5.3",
          "jspdf-autotable": "^3.1.1",
          "jwt-simple": "^0.5.5",
          "moment": "^2.24.0",
          "prop-types": "^15.6.2",
          "query-string": "^6.2.0",
          "react": "^16.7.0",
          "react-autocomplete": "^1.8.1",
          "react-autocomplete-input": "^1.0.10",
          "react-autosuggest": "^9.4.3",
          "react-awesome-modal": "^2.0.5",
          "react-bootstrap": "^1.0.0-beta.5",
          "react-confirm-alert": "^2.4.1",
          "react-csv": "^1.1.1",
          "react-data-grid": "^5.0.5",
          "react-data-grid-addons": "^5.0.5",
          "react-datepicker": "^2.1.0",
          "react-dom": "^16.7.0",
          "react-encrypt": "^1.0.1",
          "react-grid-layout": "^0.16.6",
          "react-helmet": "^5.2.1",
          "react-moment": "^0.8.4",
          "react-redux": "^6.0.0",
          "react-router-dom": "^4.3.1",
          "react-scripts": "2.1.3",
          "react-select": "^2.4.1",
          "react-text-mask": "^5.4.3",
          "react-to-print-advanced": "^2.1.2",
          "react-widgets": "^4.4.10",
          "react-widgets-moment": "^4.0.27",
          "react-widgets-moment-localizer": "^1.0.2",
          "redux": "^4.0.1",
          "redux-form": "^8.1.0",
          "redux-multilanguage": "^0.1.2",
          "redux-thunk": "^2.3.0",
          "select2": "^4.0.6-rc.1"
      },
      "scripts": {
          "start": "react-scripts start",
          "build": "react-scripts build",
          "test": "react-scripts test",
          "eject": "react-scripts eject"
      },
      "eslintConfig": {
          "extends": "react-app"
      },
      "browserslist": [
          "&gt;0.2%",
          "not dead",
          "not ie &lt;= 11",
          "not op_mini all"
      ]
  }
  </code></pre>