@@ -2054,4 +2054,48 @@ describe('Picker.Range', () => {
2054
2054
'rc-picker-input-active' ,
2055
2055
) ;
2056
2056
} ) ;
2057
+
2058
+ describe ( 'activeBar position' , ( ) => {
2059
+ const TestComponent = ( ) => {
2060
+ const [ placement , setPlacement ] = React . useState ( 'bottomLeft' ) ;
2061
+ return (
2062
+ < >
2063
+ < DayRangePicker className = "#test-container" placement = { placement } />
2064
+ < button
2065
+ data-testid = "toggle-placement"
2066
+ onClick = { ( ) => {
2067
+ setPlacement ( placement === 'bottomLeft' ? 'bottomRight' : 'bottomLeft' ) ;
2068
+ } }
2069
+ >
2070
+ Toggle Placement
2071
+ </ button >
2072
+ </ >
2073
+ ) ;
2074
+ } ;
2075
+
2076
+ it ( 'should position the activeBar correctly when changing placement direction' , ( ) => {
2077
+ const { container, getByTestId } = render ( < TestComponent /> ) ;
2078
+
2079
+ // Test first input (left placement)
2080
+ openPicker ( container , 0 ) ;
2081
+
2082
+ const activeBar = container . querySelector ( '.rc-picker-active-bar' ) ;
2083
+ expect ( activeBar ) . toHaveStyle ( {
2084
+ 'inset-inline-start' : 0 ,
2085
+ 'inset-inline-end' : '' ,
2086
+ } ) ;
2087
+
2088
+ // Change placement using state
2089
+ getByTestId ( 'toggle-placement' ) . click ( ) ;
2090
+
2091
+ openPicker ( container , 1 ) ;
2092
+
2093
+ // Test second input (right placement)
2094
+ expect ( activeBar ) . toHaveStyle ( {
2095
+ // ensure the startProps was removed
2096
+ 'inset-inline-start' : '' ,
2097
+ 'inset-inline-end' : 0 ,
2098
+ } ) ;
2099
+ } ) ;
2100
+ } ) ;
2057
2101
} ) ;
0 commit comments