diff --git a/docs/examples/range.tsx b/docs/examples/range.tsx index 84fad6db1..35dccec54 100644 --- a/docs/examples/range.tsx +++ b/docs/examples/range.tsx @@ -87,6 +87,14 @@ export default () => { test: [moment(), moment().add(1, 'hour')], }} /> + + {...sharedProps} + value={undefined} + locale={zhCN} + allowClear + picker="time" + style={{ width: 280 }} + />
diff --git a/src/RangePicker.tsx b/src/RangePicker.tsx index b32bd7099..40df79fc7 100644 --- a/src/RangePicker.tsx +++ b/src/RangePicker.tsx @@ -239,6 +239,7 @@ function InnerRangePicker(props: RangePickerProps) { const separatorRef = useRef(null); const startInputRef = useRef(null); const endInputRef = useRef(null); + const arrowRef = useRef(null); // ============================ Warning ============================ if (process.env.NODE_ENV !== 'production') { @@ -892,7 +893,11 @@ function InnerRangePicker(props: RangePickerProps) { // Arrow offset arrowLeft = startInputDivRef.current.offsetWidth + separatorRef.current.offsetWidth; - if (panelDivRef.current.offsetWidth && arrowLeft > panelDivRef.current.offsetWidth) { + if ( + panelDivRef.current.offsetWidth && + arrowRef.current.offsetWidth && + arrowLeft > panelDivRef.current.offsetWidth - arrowRef.current.offsetWidth + ) { panelLeft = arrowLeft; } } @@ -1003,7 +1008,7 @@ function InnerRangePicker(props: RangePickerProps) { className={classNames(`${prefixCls}-range-wrapper`, `${prefixCls}-${picker}-range-wrapper`)} style={{ minWidth: popupMinWidth }} > -
+
{renderPanels()}