You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

DropdownToggle.js 1.6 KiB

пре 3 година
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. import PropTypes from 'prop-types';
  2. import { useContext } from 'react';
  3. import DropdownContext from './DropdownContext';
  4. /**
  5. * Wires up Dropdown toggle functinality, returning a set a props to attach
  6. * to the element that functions as the dropdown toggle (generally a button).
  7. */
  8. export function useDropdownToggle() {
  9. var _useContext = useContext(DropdownContext),
  10. show = _useContext.show,
  11. toggle = _useContext.toggle,
  12. setToggle = _useContext.setToggle;
  13. return [{
  14. ref: setToggle,
  15. 'aria-haspopup': true,
  16. 'aria-expanded': !!show
  17. }, {
  18. show: show,
  19. toggle: toggle
  20. }];
  21. }
  22. var propTypes = {
  23. /**
  24. * A render prop that returns a Toggle element. The `props`
  25. * argument should spread through to **a component that can accept a ref**. Use
  26. * the `onToggle` argument to toggle the menu open or closed
  27. *
  28. * @type {Function ({
  29. * show: boolean,
  30. * toggle: (show: boolean) => void,
  31. * props: {
  32. * ref: (?HTMLElement) => void,
  33. * aria-haspopup: true
  34. * aria-expanded: boolean
  35. * },
  36. * }) => React.Element}
  37. */
  38. children: PropTypes.func.isRequired
  39. };
  40. function DropdownToggle(_ref) {
  41. var children = _ref.children;
  42. var _useDropdownToggle = useDropdownToggle(),
  43. props = _useDropdownToggle[0],
  44. _useDropdownToggle$ = _useDropdownToggle[1],
  45. show = _useDropdownToggle$.show,
  46. toggle = _useDropdownToggle$.toggle;
  47. return children({
  48. show: show,
  49. toggle: toggle,
  50. props: props
  51. });
  52. }
  53. DropdownToggle.displayName = 'ReactOverlaysDropdownToggle';
  54. DropdownToggle.propTypes = propTypes;
  55. /** @component */
  56. export default DropdownToggle;