import * as React from 'react'; import DownOutlined from '@ant-design/icons/DownOutlined'; import DropDown, { DropDownProps } from '../dropdown/dropdown'; import { ConfigContext } from '../config-provider'; export interface BreadcrumbItemProps { prefixCls?: string; separator?: React.ReactNode; href?: string; overlay?: DropDownProps['overlay']; dropdownProps?: DropDownProps; onClick?: React.MouseEventHandler; } interface BreadcrumbItemInterface extends React.FC { __ANT_BREADCRUMB_ITEM: boolean; } const BreadcrumbItem: BreadcrumbItemInterface = ({ prefixCls: customizePrefixCls, separator, children, overlay, dropdownProps, ...restProps }) => { const { getPrefixCls } = React.useContext(ConfigContext); const prefixCls = getPrefixCls('breadcrumb', customizePrefixCls); /** * if overlay is have * Wrap a DropDown */ const renderBreadcrumbNode = (breadcrumbItem: React.ReactNode) => { if (overlay) { return ( {breadcrumbItem} ); } return breadcrumbItem; }; let link; if ('href' in restProps) { link = ( {children} ); } else { link = ( {children} ); } // wrap to dropDown link = renderBreadcrumbNode(link); if (children) { return ( {link} {separator && separator !== '' && ( {separator} )} ); } return null; }; BreadcrumbItem.__ANT_BREADCRUMB_ITEM = true; export default BreadcrumbItem;