ant-design/components/menu/OverrideContext.tsx
JiaQi 8cdb76bad6
fix(dropdown): Dropdown menu support transmit ref (#43002)
* fix(dropdown): Dropdown menu support transmit ref

* chore: add test case
2023-06-18 13:21:39 +08:00

46 lines
1.4 KiB
TypeScript

import * as React from 'react';
import { NoCompactStyle } from '../space/Compact';
import type { MenuProps } from './menu';
// Used for Dropdown only
export interface OverrideContextProps {
prefixCls?: string;
expandIcon?: React.ReactNode;
mode?: MenuProps['mode'];
selectable?: boolean;
validator?: (menuProps: Pick<MenuProps, 'mode'>) => void;
onClick?: () => void;
}
const OverrideContext = React.createContext<OverrideContextProps | null>(null);
/** @internal Only used for Dropdown component. Do not use this in your production. */
export const OverrideProvider = React.forwardRef<
HTMLElement,
OverrideContextProps & { children: React.ReactNode }
>((props, ref) => {
const { children, ...restProps } = props;
const override = React.useContext(OverrideContext);
const context = React.useMemo<OverrideContextProps>(
() => ({ ...override, ...restProps }),
[
override,
restProps.prefixCls,
// restProps.expandIcon, Not mark as deps since this is a ReactNode
restProps.mode,
restProps.selectable,
// restProps.validator, Not mark as deps since this is a function
],
);
return (
<OverrideContext.Provider value={context}>
<NoCompactStyle>{React.cloneElement(children as React.ReactElement, { ref })}</NoCompactStyle>
</OverrideContext.Provider>
);
});
/** @internal Only used for Dropdown component. Do not use this in your production. */
export default OverrideContext;