title: Fix date picker inside modal window in react js
body: <p>I have this component:</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>const App = () =&gt; {
    const [isModalVisible, setIsModalVisible] = useState(false);
  
    const showModal = () =&gt; {
      setIsModalVisible(true);
    };
  
    const handleOk = () =&gt; {
      setIsModalVisible(false);
    };
  
    const handleCancel = () =&gt; {
      setIsModalVisible(false);
    };
  
    return (
      &lt;&gt;
        &lt;Button type="primary" onClick={showModal}&gt;
          Open Modal
        &lt;/Button&gt;
        &lt;Modal
          title="Basic Modal"
          visible={isModalVisible}
          onOk={handleOk}
          onCancel={handleCancel}
        &gt;
          &lt;DatePicker
            onChange={test}
            open={true}
            showNow={false}
            dateRender={(current) =&gt; {
              const style = {};
              if (arr.includes(current)) {
                style.border = "1px solid red";
                style.borderRadius = "50%";
              }
              return (
                &lt;div className="ant-picker-cell-inner" style={style}&gt;
                  {current.date()}
                &lt;/div&gt;
              );
            }}
          /&gt;
        &lt;/Modal&gt;
      &lt;/&gt;
    );
  };</code></pre>
  </div>
  </div>
  </p>
  <p>When i open the modal i get the calendar outside it. How to put the calendar inside the modal window, not outside like now?<br>
  demo: <a href="https://codesandbox.io/s/basic-antd494-forked-6lkqg?file=/index.js:269-1303" rel="nofollow noreferrer">https://codesandbox.io/s/basic-antd494-forked-6lkqg?file=/index.js:269-1303</a></p>