fix: DatePicker PurePanel placement (#41901)

* fix: DatePicker PurePanel placement

* chore: fix type

components/_util/PurePanel.tsx

@@ -11,9 +11,12 @@ export interface BaseProps {
 export default function genPurePanel<ComponentProps extends BaseProps>(
   Component: any,
   defaultPrefixCls?: string,
-  getDropdownCls?: (prefixCls: string) => string,
+  getDropdownCls?: null | ((prefixCls: string) => string),
+  postProps?: (props: ComponentProps) => ComponentProps,
 ) {
-  return function PurePanel(props: Omit<ComponentProps, 'open' | 'visible'> & { open?: boolean }) {
+  type WrapProps = Omit<ComponentProps, 'open' | 'visible'> & { open?: boolean };
+
+  return function PurePanel(props: WrapProps) {
     const { prefixCls: customizePrefixCls, style } = props;
 
     const holderRef = React.useRef<HTMLDivElement>(null);
@@ -56,6 +59,21 @@ export default function genPurePanel<ComponentProps extends BaseProps>(
       }
     }, []);
 
+    let mergedProps: WrapProps = {
+      ...props,
+      style: {
+        ...style,
+        margin: 0,
+      },
+      open,
+      visible: open,
+      getPopupContainer: () => holderRef.current!,
+    };
+
+    if (postProps) {
+      mergedProps = postProps(mergedProps as ComponentProps);
+    }
+
     return (
       <ConfigProvider
         theme={{
@@ -75,16 +93,7 @@ export default function genPurePanel<ComponentProps extends BaseProps>(
             minWidth: popupWidth,
           }}
         >
-          <Component
-            {...props}
-            style={{
-              ...style,
-              margin: 0,
-            }}
-            open={open}
-            visible={open}
-            getPopupContainer={() => holderRef.current!}
-          />
+          <Component {...mergedProps} />
         </div>
       </ConfigProvider>
     );

components/date-picker/index.ts

@@ -2,11 +2,12 @@ import type { Dayjs } from 'dayjs';
 import dayjsGenerateConfig from 'rc-picker/lib/generate/dayjs';
 import genPurePanel from '../_util/PurePanel';
 import type {
+  RangePickerProps as BaseRangePickerProps,
   PickerDateProps,
   PickerProps,
-  RangePickerProps as BaseRangePickerProps,
 } from './generatePicker';
 import generatePicker from './generatePicker';
+import { transPlacement2DropdownAlign } from './util';
 
 export type DatePickerProps = PickerProps<Dayjs>;
 export type MonthPickerProps = Omit<PickerDateProps<Dayjs>, 'picker'>;
@@ -15,11 +16,23 @@ export type RangePickerProps = BaseRangePickerProps<Dayjs>;
 
 const DatePicker = generatePicker<Dayjs>(dayjsGenerateConfig);
 
+function postPureProps(props: DatePickerProps) {
+  const dropdownAlign = transPlacement2DropdownAlign(props.direction, props.placement);
+
+  dropdownAlign.overflow!.adjustY = false;
+  dropdownAlign.overflow!.adjustX = false;
+
+  return {
+    ...props,
+    dropdownAlign,
+  };
+}
+
 // We don't care debug panel
 /* istanbul ignore next */
-const PurePanel = genPurePanel(DatePicker, 'picker');
+const PurePanel = genPurePanel(DatePicker, 'picker', null, postPureProps);
 (DatePicker as any)._InternalPanelDoNotUseOrYouWillBeFired = PurePanel;
-const PureRangePanel = genPurePanel(DatePicker.RangePicker, 'picker');
+const PureRangePanel = genPurePanel(DatePicker.RangePicker, 'picker', null, postPureProps);
 (DatePicker as any)._InternalRangePanelDoNotUseOrYouWillBeFired = PureRangePanel;
 
 export default DatePicker as typeof DatePicker & {

components/date-picker/util.ts

@@ -1,6 +1,7 @@
+import type { AlignType } from '@rc-component/trigger';
 import type { PickerMode } from 'rc-picker/lib/interface';
-import type { DirectionType } from '../config-provider';
 import type { SelectCommonPlacement } from '../_util/motion';
+import type { DirectionType } from '../config-provider';
 import type { PickerLocale } from './generatePicker';
 
 export function getPlaceholder(
@@ -60,7 +61,7 @@ export function getRangePlaceholder(
 export function transPlacement2DropdownAlign(
   direction: DirectionType,
   placement?: SelectCommonPlacement,
-) {
+): AlignType {
   const overflow = {
     adjustX: 1,
     adjustY: 1,