@@ -45,7 +45,7 @@ export interface DropdownTheme {
4545
4646export  interface  DropdownProps 
4747  extends  Pick < FloatingProps ,  "placement"  |  "trigger" > , 
48-     Omit < ButtonProps ,  keyof  ThemingProps < DropdownTheme > > , 
48+     Omit < ButtonProps ,  keyof  ThemingProps < DropdownTheme >   |   "onToggle" > , 
4949    ThemingProps < DropdownTheme >  { 
5050  arrowIcon ?: boolean ; 
5151  dismissOnClick ?: boolean ; 
@@ -54,6 +54,7 @@ export interface DropdownProps
5454  label ?: ReactNode ; 
5555  enableTypeAhead ?: boolean ; 
5656  renderTrigger ?: ( theme : DropdownTheme )  =>  ReactElement ; 
57+   onToggle ?: ( open : boolean )  =>  void ; 
5758  "data-testid" ?: string ; 
5859} 
5960
@@ -130,6 +131,7 @@ export function Dropdown(props: DropdownProps) {
130131    dismissOnClick =  true , 
131132    enableTypeAhead =  true , 
132133    renderTrigger, 
134+     onToggle, 
133135    ...restProps 
134136  }  =  resolveProps ( props ,  provider . props ?. dropdown ) ; 
135137
@@ -143,10 +145,21 @@ export function Dropdown(props: DropdownProps) {
143145  }  =  restProps ; 
144146  const  dataTestId  =  restProps [ "data-testid" ]  ||  "flowbite-dropdown-target" ; 
145147
146-   const  handleSelect  =  useCallback ( ( index : number  |  null )  =>  { 
147-     setSelectedIndex ( index ) ; 
148-     setOpen ( false ) ; 
149-   } ,  [ ] ) ; 
148+   const  handleOpenChange  =  useCallback ( 
149+     ( newOpen : boolean )  =>  { 
150+       setOpen ( newOpen ) ; 
151+       onToggle ?.( newOpen ) ; 
152+     } , 
153+     [ onToggle ] , 
154+   ) ; 
155+ 
156+   const  handleSelect  =  useCallback ( 
157+     ( index : number  |  null )  =>  { 
158+       setSelectedIndex ( index ) ; 
159+       handleOpenChange ( false ) ; 
160+     } , 
161+     [ handleOpenChange ] , 
162+   ) ; 
150163
151164  const  handleTypeaheadMatch  =  useCallback ( 
152165    ( index : number  |  null )  =>  { 
@@ -161,7 +174,10 @@ export function Dropdown(props: DropdownProps) {
161174
162175  const  {  context,  floatingStyles,  refs }  =  useBaseFLoating < HTMLButtonElement > ( { 
163176    open, 
164-     setOpen, 
177+     setOpen : ( value )  =>  { 
178+       const  newOpen  =  typeof  value  ===  "function"  ? value ( open )  : value ; 
179+       handleOpenChange ( newOpen ) ; 
180+     } , 
165181    placement, 
166182  } ) ; 
167183
0 commit comments