How to use the @paprika/helpers/lib/customPropTypes.AlignTypes.BOTTOM function in @paprika/helpers

import PropTypes from "prop-types";
import { AlignTypes } from "@paprika/helpers/lib/customPropTypes";

const propTypes = {
  /** Where the calendar is positioned relative to the trigger. */
  align: PropTypes.oneOf(AlignTypes.ALL),

  /** Distance, in px, between calendar edge and the input. */
  offset: PropTypes.number,

  /** Number setting the z-index for the calendar */
  zIndex: PropTypes.number,
};

const defaultProps = {
  align: AlignTypes.BOTTOM,
  offset: 8,
  zIndex: 1,
};

// shell component for enhancing development experience
function DatePickerPopover() {
  return null;
}

DatePickerPopover.propTypes = propTypes;
DatePickerPopover.defaultProps = defaultProps;

DatePickerPopover.displayName = "DatePicker.Popover";

export default DatePickerPopover;

import LinkItem from "./components/LinkItem";
import Item from "./components/Item";
import { contentStyles } from "./DropdownMenu.styles";

const propTypes = {
  /** Alignment of the dropdown menu */
  align: PropTypes.oneOf(AlignTypes.ALL),

  /** Children should consist of  */
  children: PropTypes.node.isRequired,

  edge: PropTypes.oneOf([AlignTypes.LEFT, AlignTypes.RIGHT, null]),
};

const defaultProps = {
  align: AlignTypes.BOTTOM,
  edge: AlignTypes.LEFT,
};

const popoverOffset = 4;

function DropdownMenu(props) {
  const { align, children, edge, ...moreProps } = props;
  const [isOpen, setIsOpen] = React.useState(false);
  const [isConfirming, setIsConfirming] = React.useState(false);
  const [renderConfirmation, setRenderConfirmation] = React.useState(null);
  const [currentFocusIndex, setFocusIndex] = React.useState(0);
  const triggerRef = React.useRef(null);
  const menuId = React.useRef(uuid());
  const triggerId = React.useRef(uuid());

  const dropdownListRef = React.useRef(null);