fix(DatePicker): fixed oneTap to work in month view (#2342)

docs/pages/components/date-picker/fragments/one-tap.md

@@ -1,7 +1,13 @@
 <!--start-code-->
 
 ```js
-const instance = <DatePicker oneTap style={{ width: 200 }} />;
+const instance = (
+  <div>
+    <DatePicker oneTap style={{ width: 200 }} />
+    <hr />
+    <DatePicker oneTap format="yyyy-MM" style={{ width: 200 }} />
+  </div>
+);
 ReactDOM.render(instance);
 ```
 

src/DatePicker/DatePicker.tsx

@@ -223,18 +223,6 @@ const DatePicker: RsRefForwardingComponent<'div', DatePickerProps> = React.forwa
       [onChangeCalendarDate, onSelect]
     );
 
-    /**
-     *  A callback triggered when the date on the calendar changes.
-     */
-    const handleChangePageDate = useCallback(
-      (nextPageDate: Date) => {
-        setCalendarDate(nextPageDate);
-        reset();
-        handleDateChange(nextPageDate);
-      },
-      [handleDateChange, reset, setCalendarDate]
-    );
-
     /**
      *  A callback triggered when the time on the calendar changes.
      */
@@ -374,6 +362,25 @@ const DatePicker: RsRefForwardingComponent<'div', DatePickerProps> = React.forwa
       [formatStr, handleDateChange, oneTap, calendarDate, setCalendarDate, updateValue]
     );
 
+    /**
+     *  A callback triggered when the date on the calendar changes.
+     */
+    const handleChangePageDate = useCallback(
+      (nextPageDate: Date, event: React.MouseEvent) => {
+        setCalendarDate(nextPageDate);
+        reset();
+        handleDateChange(nextPageDate);
+
+        // Show only the calendar month panel. formatStr = 'yyyy-MM'
+        const onlyShowMonth = DateUtils.shouldMonth(formatStr) && !DateUtils.shouldDate(formatStr);
+
+        if (oneTap && onlyShowMonth) {
+          updateValue(event, nextPageDate);
+        }
+      },
+      [formatStr, handleDateChange, oneTap, reset, setCalendarDate, updateValue]
+    );
+
     const disabledDate = useCallback(
       (date: Date): boolean => disabledDateProp?.(date) ?? false,
       [disabledDateProp]

src/DatePicker/test/DatePickerSpec.js

@@ -449,7 +449,7 @@ describe('DatePicker', () => {
     assert.ok(instance.className.match(/\bcustom-prefix\b/));
   });
 
-  it('Should call onChange after setting oneTap', () => {
+  it('Should call onChange after setting oneTap and clicking date', () => {
     const onChangeSpy = sinon.spy();
 
     const instance = getInstance(<DatePicker onChange={onChangeSpy} oneTap defaultOpen />);
@@ -462,6 +462,20 @@ describe('DatePicker', () => {
     assert.isTrue(isSameDay(onChangeSpy.firstCall.firstArg, new Date()));
   });
 
+  it('Should call onChange after setting oneTap and clicking month', () => {
+    const onChangeSpy = sinon.spy();
+    const instance = getInstance(
+      <DatePicker onChange={onChangeSpy} format="yyyy-MM" oneTap defaultOpen />
+    );
+
+    const activeMonth = instance.overlay.querySelector(
+      '.rs-calendar-month-dropdown-cell-active .rs-calendar-month-dropdown-cell-content'
+    );
+
+    ReactTestUtils.Simulate.click(activeMonth);
+    assert.isTrue(isSameDay(onChangeSpy.firstCall.firstArg, new Date()));
+  });
+
   it('Should be show meridian', () => {
     const instance = getInstance(
       <DatePicker