From 1ccc94042af93eff1d90a360117c07d34d67ae6d Mon Sep 17 00:00:00 2001 From: Huynh Tan Date: Sat, 15 Oct 2022 22:52:53 +0700 Subject: [PATCH 01/13] [Popper] Convert code to typescript --- ...styled.test.js => PopperUnstyled.test.tsx} | 5 +- .../{PopperUnstyled.js => PopperUnstyled.tsx} | 86 ++++++++++++------- ...rUnstyled.d.ts => PopperUnstyled.types.ts} | 65 ++++++++------ .../mui-base/src/PopperUnstyled/index.d.ts | 5 -- packages/mui-base/src/PopperUnstyled/index.js | 4 - packages/mui-base/src/PopperUnstyled/index.ts | 12 +++ 6 files changed, 108 insertions(+), 69 deletions(-) rename packages/mui-base/src/PopperUnstyled/{PopperUnstyled.test.js => PopperUnstyled.test.tsx} (89%) rename packages/mui-base/src/PopperUnstyled/{PopperUnstyled.js => PopperUnstyled.tsx} (85%) rename packages/mui-base/src/PopperUnstyled/{PopperUnstyled.d.ts => PopperUnstyled.types.ts} (76%) delete mode 100644 packages/mui-base/src/PopperUnstyled/index.d.ts delete mode 100644 packages/mui-base/src/PopperUnstyled/index.js create mode 100644 packages/mui-base/src/PopperUnstyled/index.ts diff --git a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.js b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx similarity index 89% rename from packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.js rename to packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx index ee065fbedd6cd7..cab47f4e37db91 100644 --- a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.js +++ b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx @@ -3,6 +3,7 @@ import { expect } from 'chai'; import { createRenderer, createMount, describeConformanceUnstyled, screen } from 'test/utils'; import PopperUnstyled, { popperUnstyledClasses } from '@mui/base/PopperUnstyled'; + describe('', () => { const { render } = createRenderer(); const mount = createMount(); @@ -14,6 +15,8 @@ describe('', () => { }; describeConformanceUnstyled(, () => ({ + muiName: 'PopperUnstyled', + classes: {}, inheritComponent: 'div', render, mount, @@ -30,7 +33,7 @@ describe('', () => { })); it('should pass ownerState to overridable component', () => { - const CustomComponent = React.forwardRef(({ ownerState }, ref) => ( + const CustomComponent = React.forwardRef(({ ownerState }, ref) => (
)); render( diff --git a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.js b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx similarity index 85% rename from packages/mui-base/src/PopperUnstyled/PopperUnstyled.js rename to packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx index 3c1370cd01e625..45875e520d118d 100644 --- a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.js +++ b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { OverridableComponent } from '@mui/types'; import { chainPropTypes, HTMLElementType, @@ -7,14 +8,18 @@ import { unstable_useEnhancedEffect as useEnhancedEffect, unstable_useForkRef as useForkRef, } from '@mui/utils'; -import { createPopper } from '@popperjs/core'; +import { createPopper, Instance, Modifier, Placement, State, VirtualElement } from '@popperjs/core'; import PropTypes from 'prop-types'; import composeClasses from '../composeClasses'; import Portal from '../Portal'; import { getPopperUnstyledUtilityClass } from './popperUnstyledClasses'; -import { useSlotProps } from '../utils'; +import { useSlotProps, WithOptionalOwnerState } from '../utils'; +import { PopperPlacementType, PopperTooltipProps, PopperTooltipTypeMap, PopperUnstyledChildrenProps, PopperUnstyledRootSlotProps, PopperUnstyledTransitionProps, PopperUnstyledTypeMap } from './PopperUnstyled.types'; -function flipPlacement(placement, direction) { +function flipPlacement( + placement?: PopperPlacementType, + direction?: 'ltr' | 'rtl', +) { if (direction === 'ltr') { return placement; } @@ -33,7 +38,9 @@ function flipPlacement(placement, direction) { } } -function resolveAnchorEl(anchorEl) { +function resolveAnchorEl( + anchorEl: VirtualElement | (() => VirtualElement) +): any { return typeof anchorEl === 'function' ? anchorEl() : anchorEl; } @@ -47,8 +54,10 @@ const useUtilityClasses = () => { const defaultPopperOptions = {}; -/* eslint-disable react/prop-types */ -const PopperTooltip = React.forwardRef(function PopperTooltip(props, ref) { +const PopperTooltip = React.forwardRef(function PopperTooltip( + props: PopperTooltipProps, + ref: React.ForwardedRef, +) { const { anchorEl, children, @@ -67,23 +76,23 @@ const PopperTooltip = React.forwardRef(function PopperTooltip(props, ref) { ...other } = props; - const tooltipRef = React.useRef(null); + const tooltipRef = React.useRef(null); const ownRef = useForkRef(tooltipRef, ref); - const popperRef = React.useRef(null); + const popperRef = React.useRef(null); const handlePopperRef = useForkRef(popperRef, popperRefProp); const handlePopperRefRef = React.useRef(handlePopperRef); useEnhancedEffect(() => { handlePopperRefRef.current = handlePopperRef; }, [handlePopperRef]); - React.useImperativeHandle(popperRefProp, () => popperRef.current, []); + React.useImperativeHandle(popperRefProp, () => popperRef.current!, []); const rtlPlacement = flipPlacement(initialPlacement, direction); /** * placement initialized from prop but can change during lifetime if modifiers.flip. * modifiers.flip is essentially a flip for controlled/uncontrolled behavior */ - const [placement, setPlacement] = React.useState(rtlPlacement); + const [placement, setPlacement] = React.useState(rtlPlacement); React.useEffect(() => { if (popperRef.current) { @@ -96,7 +105,7 @@ const PopperTooltip = React.forwardRef(function PopperTooltip(props, ref) { return undefined; } - const handlePopperUpdate = (data) => { + const handlePopperUpdate = (data: State) => { setPlacement(data.placement); }; @@ -124,7 +133,7 @@ const PopperTooltip = React.forwardRef(function PopperTooltip(props, ref) { } } - let popperModifiers = [ + let popperModifiers: Partial>[] = [ { name: 'preventOverflow', options: { @@ -154,21 +163,21 @@ const PopperTooltip = React.forwardRef(function PopperTooltip(props, ref) { popperModifiers = popperModifiers.concat(popperOptions.modifiers); } - const popper = createPopper(resolveAnchorEl(anchorEl), tooltipRef.current, { + const popper = createPopper(resolveAnchorEl(anchorEl), tooltipRef.current!, { placement: rtlPlacement, ...popperOptions, modifiers: popperModifiers, }); - handlePopperRefRef.current(popper); + handlePopperRefRef.current!(popper); return () => { popper.destroy(); - handlePopperRefRef.current(null); + handlePopperRefRef.current!(null); }; }, [anchorEl, disablePortal, modifiers, open, popperOptions, rtlPlacement]); - const childProps = { placement }; + const childProps: PopperUnstyledChildrenProps = { placement: placement! }; if (TransitionProps !== null) { childProps.TransitionProps = TransitionProps; @@ -176,7 +185,7 @@ const PopperTooltip = React.forwardRef(function PopperTooltip(props, ref) { const classes = useUtilityClasses(); const Root = component ?? slots.root ?? 'div'; - const rootProps = useSlotProps({ + const rootProps: WithOptionalOwnerState = useSlotProps({ elementType: Root, externalSlotProps: slotProps.root, externalForwardedProps: other, @@ -195,13 +204,23 @@ const PopperTooltip = React.forwardRef(function PopperTooltip(props, ref) { return ( {typeof children === 'function' ? children(childProps) : children} ); -}); -/* eslint-enable react/prop-types */ +}) as OverridableComponent; /** * Poppers rely on the 3rd party library [Popper.js](https://popper.js.org/docs/v2/) for positioning. + * + * Demos: + * + * - [Unstyled Popper](https://mui.com/base/react-popper/) + * + * API: + * + * - [PopperUnstyled API](https://mui.com/base/api/popper-unstyled/) */ -const PopperUnstyled = React.forwardRef(function PopperUnstyled(props, ref) { +const PopperUnstyled = React.forwardRef(function PopperUnstyled( + props, + ref, +) { const { anchorEl, children, @@ -238,6 +257,14 @@ const PopperUnstyled = React.forwardRef(function PopperUnstyled(props, ref) { // If neither are provided let the Modal take care of choosing the container const container = containerProp || (anchorEl ? ownerDocument(resolveAnchorEl(anchorEl)).body : undefined); + const display = !open && keepMounted && (!transition || exited) ? 'none' : undefined + const transitionProps: PopperUnstyledTransitionProps | undefined = transition + ? { + in: open, + onEnter: handleEnter, + onExited: handleExited, + } + : undefined return ( @@ -258,24 +285,17 @@ const PopperUnstyled = React.forwardRef(function PopperUnstyled(props, ref) { // Fix Popper.js display issue top: 0, left: 0, - display: !open && keepMounted && (!transition || exited) ? 'none' : null, - ...style, + display, + ...style }} - TransitionProps={ - transition - ? { - in: open, - onEnter: handleEnter, - onExited: handleExited, - } - : null - } + TransitionProps={transitionProps} + > {children} ); -}); +}) as OverridableComponent; PopperUnstyled.propTypes /* remove-proptypes */ = { // ----------------------------- Warning -------------------------------- @@ -294,7 +314,7 @@ PopperUnstyled.propTypes /* remove-proptypes */ = { if (props.open) { const resolvedAnchorEl = resolveAnchorEl(props.anchorEl); - if (resolvedAnchorEl && resolvedAnchorEl.nodeType === 1) { + if (resolvedAnchorEl && resolvedAnchorEl.nodeType === 1) { const box = resolvedAnchorEl.getBoundingClientRect(); if ( diff --git a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.d.ts b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts similarity index 76% rename from packages/mui-base/src/PopperUnstyled/PopperUnstyled.d.ts rename to packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts index 615fb2e6631766..aeeef0af8091c8 100644 --- a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.d.ts +++ b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts @@ -1,6 +1,6 @@ +import { OverrideProps } from '@mui/types'; +import { Instance, Options, OptionsGeneric, VirtualElement } from '@popperjs/core'; import * as React from 'react'; -import { OverridableComponent, OverrideProps } from '@mui/types'; -import { Instance, VirtualElement, Options, OptionsGeneric } from '@popperjs/core'; import { PortalProps } from '../Portal'; import { SlotComponentProps } from '../utils'; @@ -8,6 +8,17 @@ export type PopperPlacementType = Options['placement']; interface PopperUnstyledComponentsPropsOverrides {} +export interface PopperUnstyledTransitionProps { + in: boolean; + onEnter: () => void; + onExited: () => void; +} + +export interface PopperUnstyledChildrenProps { + placement: PopperPlacementType; + TransitionProps?: PopperUnstyledTransitionProps +} + export interface PopperUnstyledOwnProps { /** * An HTML element, [virtualElement](https://popper.js.org/docs/v2/virtual-elements/), @@ -21,14 +32,7 @@ export interface PopperUnstyledOwnProps { */ children?: | React.ReactNode - | ((props: { - placement: PopperPlacementType; - TransitionProps?: { - in: boolean; - onEnter: () => {}; - onExited: () => {}; - }; - }) => React.ReactNode); + | ((props: PopperUnstyledChildrenProps) => React.ReactNode); /** * An HTML element or function that returns one. * The `container` will have the portal children appended to it. @@ -106,15 +110,16 @@ export interface PopperUnstyledOwnProps { * @default false */ transition?: boolean; + + ownerState?: PopperUnstyledOwnerState; } -export interface PopperUnstyledOwnerState extends PopperUnstyledOwnProps {} +export type PopperUnstyledOwnerState = Record export interface PopperUnstyledTypeMap

{ props: P & PopperUnstyledOwnProps; defaultComponent: D; } - export type PopperUnstyledProps< D extends React.ElementType = PopperUnstyledTypeMap['defaultComponent'], P = {}, @@ -122,22 +127,30 @@ export type PopperUnstyledProps< component?: D; }; +export type PopperTooltipOwnProps = + Omit< + PopperUnstyledOwnProps, + 'container' + | 'keepMounted' + | 'transition' + > & { + TransitionProps?: PopperUnstyledTransitionProps; + } + +export interface PopperTooltipTypeMap

{ + props: P & PopperTooltipOwnProps; + defaultComponent: D; +}; + +export type PopperTooltipProps< + D extends React.ElementType = PopperTooltipTypeMap['defaultComponent'], + P = {}, +> = OverrideProps, D> & { + component?: D; +}; + export interface PopperUnstyledRootSlotProps { className?: string; ref: React.Ref; ownerState: PopperUnstyledOwnerState; } -/** - * Poppers rely on the 3rd party library [Popper.js](https://popper.js.org/docs/v2/) for positioning. - * - * Demos: - * - * - [Unstyled Popper](https://mui.com/base/react-popper/) - * - * API: - * - * - [PopperUnstyled API](https://mui.com/base/api/popper-unstyled/) - */ -declare const PopperUnstyled: OverridableComponent; - -export default PopperUnstyled; diff --git a/packages/mui-base/src/PopperUnstyled/index.d.ts b/packages/mui-base/src/PopperUnstyled/index.d.ts deleted file mode 100644 index 0550601a07f062..00000000000000 --- a/packages/mui-base/src/PopperUnstyled/index.d.ts +++ /dev/null @@ -1,5 +0,0 @@ -export { default } from './PopperUnstyled'; -export * from './PopperUnstyled'; - -export { default as popperUnstyledClasses } from './popperUnstyledClasses'; -export * from './popperUnstyledClasses'; diff --git a/packages/mui-base/src/PopperUnstyled/index.js b/packages/mui-base/src/PopperUnstyled/index.js deleted file mode 100644 index 264df8cd2af84e..00000000000000 --- a/packages/mui-base/src/PopperUnstyled/index.js +++ /dev/null @@ -1,4 +0,0 @@ -export { default } from './PopperUnstyled'; - -export { default as popperUnstyledClasses } from './popperUnstyledClasses'; -export * from './popperUnstyledClasses'; diff --git a/packages/mui-base/src/PopperUnstyled/index.ts b/packages/mui-base/src/PopperUnstyled/index.ts new file mode 100644 index 00000000000000..434c95185e0c5c --- /dev/null +++ b/packages/mui-base/src/PopperUnstyled/index.ts @@ -0,0 +1,12 @@ +export { default } from './PopperUnstyled'; +export { + PopperPlacementType, + PopperUnstyledTransitionProps, + PopperUnstyledChildrenProps, + PopperUnstyledOwnProps, + PopperUnstyledOwnerState, + PopperUnstyledTypeMap, + PopperUnstyledProps, + PopperUnstyledRootSlotProps, +} from './PopperUnstyled.types'; + From fbf6e9615939ce6d8119169bf4df8a199fce6679 Mon Sep 17 00:00:00 2001 From: Huynh Tan Date: Sat, 15 Oct 2022 23:11:13 +0700 Subject: [PATCH 02/13] Restore owner state type --- packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx | 2 +- packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts | 3 ++- packages/mui-base/src/PopperUnstyled/index.ts | 2 +- 3 files changed, 4 insertions(+), 3 deletions(-) diff --git a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx index cab47f4e37db91..8dd4ccf18c54e4 100644 --- a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx +++ b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx @@ -41,7 +41,7 @@ describe('', () => { anchorEl={() => document.createElement('div')} open component={CustomComponent} - ownerState={{ foo: 'foo' }} + ownerState={{ foo: 'foo' } as any} />, ); diff --git a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts index aeeef0af8091c8..515ebd2c167ace 100644 --- a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts +++ b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts @@ -114,12 +114,13 @@ export interface PopperUnstyledOwnProps { ownerState?: PopperUnstyledOwnerState; } -export type PopperUnstyledOwnerState = Record +export interface PopperUnstyledOwnerState extends PopperUnstyledOwnProps {} export interface PopperUnstyledTypeMap

{ props: P & PopperUnstyledOwnProps; defaultComponent: D; } + export type PopperUnstyledProps< D extends React.ElementType = PopperUnstyledTypeMap['defaultComponent'], P = {}, diff --git a/packages/mui-base/src/PopperUnstyled/index.ts b/packages/mui-base/src/PopperUnstyled/index.ts index 434c95185e0c5c..9e7b890154c855 100644 --- a/packages/mui-base/src/PopperUnstyled/index.ts +++ b/packages/mui-base/src/PopperUnstyled/index.ts @@ -1,5 +1,5 @@ export { default } from './PopperUnstyled'; -export { +export type { PopperPlacementType, PopperUnstyledTransitionProps, PopperUnstyledChildrenProps, From 4020e668381b33e9498aa409037250a572c804a2 Mon Sep 17 00:00:00 2001 From: Huynh Tan Date: Sun, 23 Oct 2022 22:05:20 +0700 Subject: [PATCH 03/13] Resolve conflict --- packages/mui-base/src/PopperUnstyled/index.ts | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/packages/mui-base/src/PopperUnstyled/index.ts b/packages/mui-base/src/PopperUnstyled/index.ts index 9e7b890154c855..b0341a1a24d905 100644 --- a/packages/mui-base/src/PopperUnstyled/index.ts +++ b/packages/mui-base/src/PopperUnstyled/index.ts @@ -9,4 +9,11 @@ export type { PopperUnstyledProps, PopperUnstyledRootSlotProps, } from './PopperUnstyled.types'; - +export { + default as popperUnstyledClasses, + getPopperUnstyledUtilityClass, +} from './popperUnstyledClasses'; +export type { + PopperUnstyledClassKey, + PopperUnstyledClasses, +} from './popperUnstyledClasses'; From a25626e0b0632f9e8cbe40a16fb87a8ed67fdc6f Mon Sep 17 00:00:00 2001 From: Huynh Tan Date: Sun, 23 Oct 2022 22:20:01 +0700 Subject: [PATCH 04/13] fix(popper): Correctly model anchorEl handling --- .../src/PopperUnstyled/PopperUnstyled.tsx | 40 ++++++++++++++----- .../PopperUnstyled/PopperUnstyled.types.ts | 2 +- 2 files changed, 32 insertions(+), 10 deletions(-) diff --git a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx index 45875e520d118d..c902e3b5f03836 100644 --- a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx +++ b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx @@ -38,12 +38,20 @@ function flipPlacement( } } -function resolveAnchorEl( - anchorEl: VirtualElement | (() => VirtualElement) -): any { +function resolveAnchorEl(anchorEl: VirtualElement | (() => VirtualElement)): VirtualElement; +function resolveAnchorEl(anchorEl: HTMLElement | (() => HTMLElement)): HTMLElement; +function resolveAnchorEl(anchorEl: VirtualElement | (() => VirtualElement) | HTMLElement | (() => HTMLElement)): HTMLElement | VirtualElement { return typeof anchorEl === 'function' ? anchorEl() : anchorEl; } +function isHTMLElement(element: HTMLElement | VirtualElement): element is HTMLElement { + return (element as HTMLElement).nodeType !== undefined; +} + +function isVirtualElement(element: HTMLElement | VirtualElement): element is VirtualElement { + return !isHTMLElement(element) +} + const useUtilityClasses = () => { const slots = { root: ['root'], @@ -112,7 +120,7 @@ const PopperTooltip = React.forwardRef(function PopperTooltip( const resolvedAnchorEl = resolveAnchorEl(anchorEl); if (process.env.NODE_ENV !== 'production') { - if (resolvedAnchorEl && resolvedAnchorEl.nodeType === 1) { + if (resolvedAnchorEl && isHTMLElement(resolvedAnchorEl) && resolvedAnchorEl.nodeType === 1) { const box = resolvedAnchorEl.getBoundingClientRect(); if ( @@ -255,8 +263,16 @@ const PopperUnstyled = React.forwardRef(function PopperUnstyled( // If the container prop is provided, use that // If the anchorEl prop is provided, use its parent body element as the container // If neither are provided let the Modal take care of choosing the container - const container = - containerProp || (anchorEl ? ownerDocument(resolveAnchorEl(anchorEl)).body : undefined); + let container; + if (containerProp) { + container = containerProp + } + if (anchorEl) { + const resolvedAnchorEl = resolveAnchorEl(anchorEl) + container = isHTMLElement(resolvedAnchorEl) + ? ownerDocument(resolvedAnchorEl).body + : ownerDocument(null).body + } const display = !open && keepMounted && (!transition || exited) ? 'none' : undefined const transitionProps: PopperUnstyledTransitionProps | undefined = transition ? { @@ -314,7 +330,11 @@ PopperUnstyled.propTypes /* remove-proptypes */ = { if (props.open) { const resolvedAnchorEl = resolveAnchorEl(props.anchorEl); - if (resolvedAnchorEl && resolvedAnchorEl.nodeType === 1) { + if ( + resolvedAnchorEl + && isHTMLElement(resolvedAnchorEl) + && resolvedAnchorEl.nodeType === 1 + ) { const box = resolvedAnchorEl.getBoundingClientRect(); if ( @@ -335,8 +355,10 @@ PopperUnstyled.propTypes /* remove-proptypes */ = { } else if ( !resolvedAnchorEl || typeof resolvedAnchorEl.getBoundingClientRect !== 'function' || - (resolvedAnchorEl.contextElement != null && - resolvedAnchorEl.contextElement.nodeType !== 1) + + (isVirtualElement(resolvedAnchorEl) && + resolvedAnchorEl.contextElement != null && + resolvedAnchorEl.contextElement.nodeType !== 1) ) { return new Error( [ diff --git a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts index 515ebd2c167ace..68ef3e2a6ed645 100644 --- a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts +++ b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts @@ -26,7 +26,7 @@ export interface PopperUnstyledOwnProps { * It's used to set the position of the popper. * The return value will passed as the reference object of the Popper instance. */ - anchorEl?: null | VirtualElement | (() => VirtualElement); + anchorEl?: null | VirtualElement | HTMLElement | (() => HTMLElement | VirtualElement); /** * Popper render function or node. */ From 29b75aefa586d7a6a1f99e712d56f8dfff104152 Mon Sep 17 00:00:00 2001 From: Huynh Tan Date: Sun, 20 Nov 2022 17:23:14 +0700 Subject: [PATCH 05/13] change ownerState to object > In short, we generally don't want to expose ownerState as a prop, because users of the components should not manually set it. However, in some cases, when an MUI Base component is used in a slot of another component, it will receive the ownerState (as all slot components do). The type of this ownerState is not PopperUnstyledOwnerState, though - it's a state of a component that owns the slots, so it's impossible to type this strongly. --- packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx | 2 +- packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx index 8dd4ccf18c54e4..cab47f4e37db91 100644 --- a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx +++ b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx @@ -41,7 +41,7 @@ describe('', () => { anchorEl={() => document.createElement('div')} open component={CustomComponent} - ownerState={{ foo: 'foo' } as any} + ownerState={{ foo: 'foo' }} />, ); diff --git a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts index 68ef3e2a6ed645..7f0adb0cfa44a4 100644 --- a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts +++ b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts @@ -111,7 +111,7 @@ export interface PopperUnstyledOwnProps { */ transition?: boolean; - ownerState?: PopperUnstyledOwnerState; + ownerState?: object; } export interface PopperUnstyledOwnerState extends PopperUnstyledOwnProps {} From e716811d475e90b2fad98929f60efff1ae963e08 Mon Sep 17 00:00:00 2001 From: Huynh Tan Date: Sun, 20 Nov 2022 17:44:49 +0700 Subject: [PATCH 06/13] Fix typo --- packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx index c902e3b5f03836..4873953d142e22 100644 --- a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx +++ b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx @@ -266,8 +266,7 @@ const PopperUnstyled = React.forwardRef(function PopperUnstyled( let container; if (containerProp) { container = containerProp - } - if (anchorEl) { + } else if (anchorEl) { const resolvedAnchorEl = resolveAnchorEl(anchorEl) container = isHTMLElement(resolvedAnchorEl) ? ownerDocument(resolvedAnchorEl).body From f884e6708b242432f89abb4564520a89a223a4a8 Mon Sep 17 00:00:00 2001 From: Huynh Tan Date: Sun, 20 Nov 2022 18:17:41 +0700 Subject: [PATCH 07/13] Cannot ownerState as object due to incompatible downstream type --- packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts index 7f0adb0cfa44a4..53902c79c51ef5 100644 --- a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts +++ b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts @@ -111,10 +111,10 @@ export interface PopperUnstyledOwnProps { */ transition?: boolean; - ownerState?: object; + ownerState?: any; } -export interface PopperUnstyledOwnerState extends PopperUnstyledOwnProps {} +export type PopperUnstyledOwnerState = Omit; export interface PopperUnstyledTypeMap

{ props: P & PopperUnstyledOwnProps; From f6cb06dbbeed31787762cf36aea08db138aaf2cb Mon Sep 17 00:00:00 2001 From: Huynh Tan Date: Sun, 20 Nov 2022 18:28:09 +0700 Subject: [PATCH 08/13] Run Prettier format --- .../PopperUnstyled/PopperUnstyled.test.tsx | 1 - .../src/PopperUnstyled/PopperUnstyled.tsx | 54 ++++++++++--------- .../PopperUnstyled/PopperUnstyled.types.ts | 23 ++++---- packages/mui-base/src/PopperUnstyled/index.ts | 5 +- 4 files changed, 38 insertions(+), 45 deletions(-) diff --git a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx index cab47f4e37db91..0da2d79b0502d5 100644 --- a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx +++ b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx @@ -3,7 +3,6 @@ import { expect } from 'chai'; import { createRenderer, createMount, describeConformanceUnstyled, screen } from 'test/utils'; import PopperUnstyled, { popperUnstyledClasses } from '@mui/base/PopperUnstyled'; - describe('', () => { const { render } = createRenderer(); const mount = createMount(); diff --git a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx index 4873953d142e22..d97e32ad9e1bb0 100644 --- a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx +++ b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx @@ -14,12 +14,17 @@ import composeClasses from '../composeClasses'; import Portal from '../Portal'; import { getPopperUnstyledUtilityClass } from './popperUnstyledClasses'; import { useSlotProps, WithOptionalOwnerState } from '../utils'; -import { PopperPlacementType, PopperTooltipProps, PopperTooltipTypeMap, PopperUnstyledChildrenProps, PopperUnstyledRootSlotProps, PopperUnstyledTransitionProps, PopperUnstyledTypeMap } from './PopperUnstyled.types'; - -function flipPlacement( - placement?: PopperPlacementType, - direction?: 'ltr' | 'rtl', -) { +import { + PopperPlacementType, + PopperTooltipProps, + PopperTooltipTypeMap, + PopperUnstyledChildrenProps, + PopperUnstyledRootSlotProps, + PopperUnstyledTransitionProps, + PopperUnstyledTypeMap, +} from './PopperUnstyled.types'; + +function flipPlacement(placement?: PopperPlacementType, direction?: 'ltr' | 'rtl') { if (direction === 'ltr') { return placement; } @@ -40,7 +45,9 @@ function flipPlacement( function resolveAnchorEl(anchorEl: VirtualElement | (() => VirtualElement)): VirtualElement; function resolveAnchorEl(anchorEl: HTMLElement | (() => HTMLElement)): HTMLElement; -function resolveAnchorEl(anchorEl: VirtualElement | (() => VirtualElement) | HTMLElement | (() => HTMLElement)): HTMLElement | VirtualElement { +function resolveAnchorEl( + anchorEl: VirtualElement | (() => VirtualElement) | HTMLElement | (() => HTMLElement), +): HTMLElement | VirtualElement { return typeof anchorEl === 'function' ? anchorEl() : anchorEl; } @@ -49,7 +56,7 @@ function isHTMLElement(element: HTMLElement | VirtualElement): element is HTMLEl } function isVirtualElement(element: HTMLElement | VirtualElement): element is VirtualElement { - return !isHTMLElement(element) + return !isHTMLElement(element); } const useUtilityClasses = () => { @@ -225,10 +232,7 @@ const PopperTooltip = React.forwardRef(function PopperTooltip( * * - [PopperUnstyled API](https://mui.com/base/api/popper-unstyled/) */ -const PopperUnstyled = React.forwardRef(function PopperUnstyled( - props, - ref, -) { +const PopperUnstyled = React.forwardRef(function PopperUnstyled(props, ref) { const { anchorEl, children, @@ -265,21 +269,21 @@ const PopperUnstyled = React.forwardRef(function PopperUnstyled( // If neither are provided let the Modal take care of choosing the container let container; if (containerProp) { - container = containerProp + container = containerProp; } else if (anchorEl) { - const resolvedAnchorEl = resolveAnchorEl(anchorEl) + const resolvedAnchorEl = resolveAnchorEl(anchorEl); container = isHTMLElement(resolvedAnchorEl) ? ownerDocument(resolvedAnchorEl).body - : ownerDocument(null).body + : ownerDocument(null).body; } - const display = !open && keepMounted && (!transition || exited) ? 'none' : undefined + const display = !open && keepMounted && (!transition || exited) ? 'none' : undefined; const transitionProps: PopperUnstyledTransitionProps | undefined = transition ? { in: open, onEnter: handleEnter, onExited: handleExited, - } - : undefined + } + : undefined; return ( @@ -301,10 +305,9 @@ const PopperUnstyled = React.forwardRef(function PopperUnstyled( top: 0, left: 0, display, - ...style + ...style, }} TransitionProps={transitionProps} - > {children} @@ -330,9 +333,9 @@ PopperUnstyled.propTypes /* remove-proptypes */ = { const resolvedAnchorEl = resolveAnchorEl(props.anchorEl); if ( - resolvedAnchorEl - && isHTMLElement(resolvedAnchorEl) - && resolvedAnchorEl.nodeType === 1 + resolvedAnchorEl && + isHTMLElement(resolvedAnchorEl) && + resolvedAnchorEl.nodeType === 1 ) { const box = resolvedAnchorEl.getBoundingClientRect(); @@ -354,10 +357,9 @@ PopperUnstyled.propTypes /* remove-proptypes */ = { } else if ( !resolvedAnchorEl || typeof resolvedAnchorEl.getBoundingClientRect !== 'function' || - (isVirtualElement(resolvedAnchorEl) && - resolvedAnchorEl.contextElement != null && - resolvedAnchorEl.contextElement.nodeType !== 1) + resolvedAnchorEl.contextElement != null && + resolvedAnchorEl.contextElement.nodeType !== 1) ) { return new Error( [ diff --git a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts index 53902c79c51ef5..ee46ab9dd46ae5 100644 --- a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts +++ b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts @@ -16,7 +16,7 @@ export interface PopperUnstyledTransitionProps { export interface PopperUnstyledChildrenProps { placement: PopperPlacementType; - TransitionProps?: PopperUnstyledTransitionProps + TransitionProps?: PopperUnstyledTransitionProps; } export interface PopperUnstyledOwnProps { @@ -30,9 +30,7 @@ export interface PopperUnstyledOwnProps { /** * Popper render function or node. */ - children?: - | React.ReactNode - | ((props: PopperUnstyledChildrenProps) => React.ReactNode); + children?: React.ReactNode | ((props: PopperUnstyledChildrenProps) => React.ReactNode); /** * An HTML element or function that returns one. * The `container` will have the portal children appended to it. @@ -128,20 +126,17 @@ export type PopperUnstyledProps< component?: D; }; -export type PopperTooltipOwnProps = - Omit< - PopperUnstyledOwnProps, - 'container' - | 'keepMounted' - | 'transition' - > & { - TransitionProps?: PopperUnstyledTransitionProps; - } +export type PopperTooltipOwnProps = Omit< + PopperUnstyledOwnProps, + 'container' | 'keepMounted' | 'transition' +> & { + TransitionProps?: PopperUnstyledTransitionProps; +}; export interface PopperTooltipTypeMap

{ props: P & PopperTooltipOwnProps; defaultComponent: D; -}; +} export type PopperTooltipProps< D extends React.ElementType = PopperTooltipTypeMap['defaultComponent'], diff --git a/packages/mui-base/src/PopperUnstyled/index.ts b/packages/mui-base/src/PopperUnstyled/index.ts index b0341a1a24d905..9f8d876a0c45c7 100644 --- a/packages/mui-base/src/PopperUnstyled/index.ts +++ b/packages/mui-base/src/PopperUnstyled/index.ts @@ -13,7 +13,4 @@ export { default as popperUnstyledClasses, getPopperUnstyledUtilityClass, } from './popperUnstyledClasses'; -export type { - PopperUnstyledClassKey, - PopperUnstyledClasses, -} from './popperUnstyledClasses'; +export type { PopperUnstyledClassKey, PopperUnstyledClasses } from './popperUnstyledClasses'; From 1bfd5ddfb59a45dcd5ed6a5a5cc54e990e1ee4cf Mon Sep 17 00:00:00 2001 From: Huynh Tan Date: Mon, 21 Nov 2022 09:45:58 +0700 Subject: [PATCH 09/13] Update proptypes --- .../mui-base/src/PopperUnstyled/PopperUnstyled.tsx | 14 +++++++++++--- packages/mui-material/src/Popper/Popper.tsx | 4 ++++ 2 files changed, 15 insertions(+), 3 deletions(-) diff --git a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx index d97e32ad9e1bb0..75f6b72dbff781 100644 --- a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx +++ b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx @@ -19,6 +19,7 @@ import { PopperTooltipProps, PopperTooltipTypeMap, PopperUnstyledChildrenProps, + PopperUnstyledProps, PopperUnstyledRootSlotProps, PopperUnstyledTransitionProps, PopperUnstyledTypeMap, @@ -232,7 +233,10 @@ const PopperTooltip = React.forwardRef(function PopperTooltip( * * - [PopperUnstyled API](https://mui.com/base/api/popper-unstyled/) */ -const PopperUnstyled = React.forwardRef(function PopperUnstyled(props, ref) { +const PopperUnstyled = React.forwardRef(function PopperUnstyled( + props: PopperUnstyledProps, + ref: React.ForwardedRef, +) { const { anchorEl, children, @@ -247,6 +251,8 @@ const PopperUnstyled = React.forwardRef(function PopperUnstyled(props, ref) { popperRef, style, transition = false, + slotProps = {}, + slots = {}, ...other } = props; @@ -297,6 +303,8 @@ const PopperUnstyled = React.forwardRef(function PopperUnstyled(props, ref) { placement={placement} popperOptions={popperOptions} popperRef={popperRef} + slotProps={slotProps} + slots={slots} {...other} style={{ // Prevents scroll issue, waiting for Popper.js to add this style once initiated. @@ -318,7 +326,7 @@ const PopperUnstyled = React.forwardRef(function PopperUnstyled(props, ref) { PopperUnstyled.propTypes /* remove-proptypes */ = { // ----------------------------- Warning -------------------------------- // | These PropTypes are generated from the TypeScript type definitions | - // | To update them edit the d.ts file and run "yarn proptypes" | + // | To update them edit TypeScript types and run "yarn proptypes" | // ---------------------------------------------------------------------- /** * An HTML element, [virtualElement](https://popper.js.org/docs/v2/virtual-elements/), @@ -520,6 +528,6 @@ PopperUnstyled.propTypes /* remove-proptypes */ = { * @default false */ transition: PropTypes.bool, -}; +} as any; export default PopperUnstyled; diff --git a/packages/mui-material/src/Popper/Popper.tsx b/packages/mui-material/src/Popper/Popper.tsx index e62ece2792ba94..bee3462980d8f5 100644 --- a/packages/mui-material/src/Popper/Popper.tsx +++ b/packages/mui-material/src/Popper/Popper.tsx @@ -168,6 +168,10 @@ Popper.propTypes /* remove-proptypes */ = { * If `true`, the component is shown. */ open: PropTypes.bool.isRequired, + /** + * @ignore + */ + ownerState: PropTypes.any, /** * Popper placement. * @default 'bottom' From 97d7c0f2cb73ff3ff4101526ad009e3cf429820b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micha=C5=82=20Dudak?= Date: Tue, 20 Dec 2022 13:46:59 +0100 Subject: [PATCH 10/13] Update types --- .../src/PopperUnstyled/PopperUnstyled.tsx | 33 ++++++++++++------- .../PopperUnstyled/PopperUnstyled.types.ts | 2 +- 2 files changed, 22 insertions(+), 13 deletions(-) diff --git a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx index 3f9acdc9167dcc..bf659028a100cc 100644 --- a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx +++ b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx @@ -44,11 +44,15 @@ function flipPlacement(placement?: PopperPlacementType, direction?: 'ltr' | 'rtl } } -function resolveAnchorEl(anchorEl: VirtualElement | (() => VirtualElement)): VirtualElement; -function resolveAnchorEl(anchorEl: HTMLElement | (() => HTMLElement)): HTMLElement; function resolveAnchorEl( - anchorEl: VirtualElement | (() => VirtualElement) | HTMLElement | (() => HTMLElement), -): HTMLElement | VirtualElement { + anchorEl: + | VirtualElement + | (() => VirtualElement) + | HTMLElement + | (() => HTMLElement) + | null + | undefined, +): HTMLElement | VirtualElement | null | undefined { return typeof anchorEl === 'function' ? anchorEl() : anchorEl; } @@ -108,10 +112,10 @@ const PopperTooltip = React.forwardRef(function PopperTooltip( * placement initialized from prop but can change during lifetime if modifiers.flip. * modifiers.flip is essentially a flip for controlled/uncontrolled behavior */ - const [placement, setPlacement] = React.useState(rtlPlacement); - const [resolvedAnchorElement, setResolvedAnchorElement] = React.useState( - resolveAnchorEl(anchorEl), - ); + const [placement, setPlacement] = React.useState(rtlPlacement); + const [resolvedAnchorElement, setResolvedAnchorElement] = React.useState< + HTMLElement | VirtualElement | null | undefined + >(resolveAnchorEl(anchorEl)); React.useEffect(() => { if (popperRef.current) { @@ -135,7 +139,11 @@ const PopperTooltip = React.forwardRef(function PopperTooltip( }; if (process.env.NODE_ENV !== 'production') { - if (resolvedAnchorElement && isHTMLElement(resolvedAnchorElement) && resolvedAnchorElement.nodeType === 1) { + if ( + resolvedAnchorElement && + isHTMLElement(resolvedAnchorElement) && + resolvedAnchorElement.nodeType === 1 + ) { const box = resolvedAnchorElement.getBoundingClientRect(); if ( @@ -285,9 +293,10 @@ const PopperUnstyled = React.forwardRef(function PopperUnstyled( container = containerProp; } else if (anchorEl) { const resolvedAnchorEl = resolveAnchorEl(anchorEl); - container = isHTMLElement(resolvedAnchorEl) - ? ownerDocument(resolvedAnchorEl).body - : ownerDocument(null).body; + container = + resolvedAnchorEl && isHTMLElement(resolvedAnchorEl) + ? ownerDocument(resolvedAnchorEl).body + : ownerDocument(null).body; } const display = !open && keepMounted && (!transition || exited) ? 'none' : undefined; const transitionProps: PopperUnstyledTransitionProps | undefined = transition diff --git a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts index ee46ab9dd46ae5..de036405e9f6dc 100644 --- a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts +++ b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.types.ts @@ -26,7 +26,7 @@ export interface PopperUnstyledOwnProps { * It's used to set the position of the popper. * The return value will passed as the reference object of the Popper instance. */ - anchorEl?: null | VirtualElement | HTMLElement | (() => HTMLElement | VirtualElement); + anchorEl?: null | VirtualElement | HTMLElement | (() => HTMLElement) | (() => VirtualElement); /** * Popper render function or node. */ From 7cbace3aa74b0284e093723825426028f20b9ec7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micha=C5=82=20Dudak?= Date: Tue, 20 Dec 2022 14:12:47 +0100 Subject: [PATCH 11/13] Narrow ref type --- packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx index bf659028a100cc..21eb36b9121814 100644 --- a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx +++ b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx @@ -76,7 +76,7 @@ const defaultPopperOptions = {}; const PopperTooltip = React.forwardRef(function PopperTooltip( props: PopperTooltipProps, - ref: React.ForwardedRef, + ref: React.ForwardedRef, ) { const { anchorEl, From 40885096332ef4e0366d348d895f7a5c8a9ae0b4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micha=C5=82=20Dudak?= Date: Tue, 20 Dec 2022 15:07:48 +0100 Subject: [PATCH 12/13] docs:api --- docs/pages/base/api/popper-unstyled.json | 2 +- docs/pages/material-ui/api/popper.json | 10 ++-------- docs/translations/api-docs/popper/popper.json | 3 +-- 3 files changed, 4 insertions(+), 11 deletions(-) diff --git a/docs/pages/base/api/popper-unstyled.json b/docs/pages/base/api/popper-unstyled.json index c59aafe0473eca..0b02a1cbcf978a 100644 --- a/docs/pages/base/api/popper-unstyled.json +++ b/docs/pages/base/api/popper-unstyled.json @@ -50,7 +50,7 @@ "styles": { "classes": [], "globalClasses": {}, "name": null }, "spread": true, "forwardsRefTo": "HTMLDivElement", - "filename": "/packages/mui-base/src/PopperUnstyled/PopperUnstyled.js", + "filename": "/packages/mui-base/src/PopperUnstyled/PopperUnstyled.tsx", "inheritance": null, "demos": "

", "cssComponent": false diff --git a/docs/pages/material-ui/api/popper.json b/docs/pages/material-ui/api/popper.json index c37e718ae6ef1d..f8dbd99d5a1b72 100644 --- a/docs/pages/material-ui/api/popper.json +++ b/docs/pages/material-ui/api/popper.json @@ -13,10 +13,6 @@ "type": { "name": "shape", "description": "{ root?: func
| object }" } }, "container": { "type": { "name": "union", "description": "HTML element
| func" } }, - "direction": { - "type": { "name": "enum", "description": "'ltr'
| 'rtl'" }, - "default": "'ltr'" - }, "disablePortal": { "type": { "name": "bool" } }, "keepMounted": { "type": { "name": "bool" } }, "modifiers": { @@ -29,15 +25,13 @@ "type": { "name": "enum", "description": "'auto-end'
| 'auto-start'
| 'auto'
| 'bottom-end'
| 'bottom-start'
| 'bottom'
| 'left-end'
| 'left-start'
| 'left'
| 'right-end'
| 'right-start'
| 'right'
| 'top-end'
| 'top-start'
| 'top'" - }, - "default": "'bottom'" + } }, "popperOptions": { "type": { "name": "shape", "description": "{ modifiers?: array, onFirstUpdate?: func, placement?: 'auto-end'
| 'auto-start'
| 'auto'
| 'bottom-end'
| 'bottom-start'
| 'bottom'
| 'left-end'
| 'left-start'
| 'left'
| 'right-end'
| 'right-start'
| 'right'
| 'top-end'
| 'top-start'
| 'top', strategy?: 'absolute'
| 'fixed' }" - }, - "default": "{}" + } }, "popperRef": { "type": { "name": "custom", "description": "ref" } }, "slotProps": { diff --git a/docs/translations/api-docs/popper/popper.json b/docs/translations/api-docs/popper/popper.json index 6ffc8353adf6f2..b6533b390e8cf1 100644 --- a/docs/translations/api-docs/popper/popper.json +++ b/docs/translations/api-docs/popper/popper.json @@ -16,8 +16,7 @@ "slotProps": "The props used for each slot inside the Popper.", "slots": "The components used for each slot inside the Popper. Either a string to use a HTML element or a component.", "sx": "The system prop that allows defining system overrides as well as additional CSS styles. See the `sx` page for more details.", - "transition": "Help supporting a react-transition-group/Transition component.", - "direction": "Direction of the text." + "transition": "Help supporting a react-transition-group/Transition component." }, "classDescriptions": {} } From d6b14befccb1d72de69986bc3ecb4a09700ab4e5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micha=C5=82=20Dudak?= Date: Tue, 20 Dec 2022 21:01:24 +0100 Subject: [PATCH 13/13] Remove unnecessary keys from conformance test config --- packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx index 0da2d79b0502d5..ffb9186a524518 100644 --- a/packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx +++ b/packages/mui-base/src/PopperUnstyled/PopperUnstyled.test.tsx @@ -14,8 +14,6 @@ describe('', () => { }; describeConformanceUnstyled(, () => ({ - muiName: 'PopperUnstyled', - classes: {}, inheritComponent: 'div', render, mount,