import { Dropdown } from 'antd'; 
 | 
import type { DropDownProps } from 'antd/es/dropdown'; 
 | 
import React from 'react'; 
 | 
import { createStyles } from 'antd-style'; 
 | 
import classNames from 'classnames'; 
 | 
  
 | 
const useStyles = createStyles(({ token }) => { 
 | 
  return { 
 | 
    dropdown: { 
 | 
      [`@media screen and (max-width: ${token.screenXS}px)`]: { 
 | 
        width: '100%', 
 | 
      }, 
 | 
    }, 
 | 
  }; 
 | 
}); 
 | 
  
 | 
export type HeaderDropdownProps = { 
 | 
  overlayClassName?: string; 
 | 
  placement?: 'bottomLeft' | 'bottomRight' | 'topLeft' | 'topCenter' | 'topRight' | 'bottomCenter'; 
 | 
} & Omit<DropDownProps, 'overlay'>; 
 | 
  
 | 
const HeaderDropdown: React.FC<HeaderDropdownProps> = ({ overlayClassName: cls, ...restProps }) => { 
 | 
  const { styles } = useStyles(); 
 | 
  return <Dropdown overlayClassName={classNames(styles.dropdown, cls)} {...restProps} />; 
 | 
}; 
 | 
  
 | 
export default HeaderDropdown; 
 |