diff --git a/docs/data/api/popover-root.json b/docs/data/api/popover-root.json index a18b9808e1..33a7ac57a4 100644 --- a/docs/data/api/popover-root.json +++ b/docs/data/api/popover-root.json @@ -4,10 +4,6 @@ "closeDelay": { "type": { "name": "number" }, "default": "0" }, "defaultOpen": { "type": { "name": "bool" }, "default": "false" }, "delay": { "type": { "name": "number" }, "default": "300" }, - "delayType": { - "type": { "name": "enum", "description": "'hover'
| 'rest'" }, - "default": "'rest'" - }, "onOpenChange": { "type": { "name": "func" } }, "open": { "type": { "name": "bool" }, "default": "false" }, "openOnHover": { "type": { "name": "bool" }, "default": "false" } diff --git a/docs/data/api/preview-card-root.json b/docs/data/api/preview-card-root.json index df36fdd356..5de5a028c7 100644 --- a/docs/data/api/preview-card-root.json +++ b/docs/data/api/preview-card-root.json @@ -4,10 +4,6 @@ "closeDelay": { "type": { "name": "number" }, "default": "300" }, "defaultOpen": { "type": { "name": "bool" }, "default": "false" }, "delay": { "type": { "name": "number" }, "default": "600" }, - "delayType": { - "type": { "name": "enum", "description": "'hover'
| 'rest'" }, - "default": "'rest'" - }, "onOpenChange": { "type": { "name": "func" } }, "open": { "type": { "name": "bool" }, "default": "false" } }, diff --git a/docs/data/api/tooltip-root.json b/docs/data/api/tooltip-root.json index fb548b9ca8..1c6fcd687b 100644 --- a/docs/data/api/tooltip-root.json +++ b/docs/data/api/tooltip-root.json @@ -4,10 +4,6 @@ "closeDelay": { "type": { "name": "number" }, "default": "0" }, "defaultOpen": { "type": { "name": "bool" }, "default": "false" }, "delay": { "type": { "name": "number" }, "default": "600" }, - "delayType": { - "type": { "name": "enum", "description": "'hover'
| 'rest'" }, - "default": "'rest'" - }, "hoverable": { "type": { "name": "bool" }, "default": "true" }, "onOpenChange": { "type": { "name": "func" } }, "open": { "type": { "name": "bool" }, "default": "false" }, diff --git a/docs/data/components/popover/popover.mdx b/docs/data/components/popover/popover.mdx index f851aba316..b39bc3e84b 100644 --- a/docs/data/components/popover/popover.mdx +++ b/docs/data/components/popover/popover.mdx @@ -111,12 +111,6 @@ To change how long the popover waits until it opens or closes when `openOnHover` ``` -The delay type can be changed from `"rest"` (user's cursor is static over the trigger for the given timeout in milliseconds) to `"hover"` (the user's cursor has entered the trigger): - -```jsx - -``` - ## Controlled To control the popover with external state, use the `open` and `onOpenChange` props: diff --git a/docs/data/components/preview-card/preview-card.mdx b/docs/data/components/preview-card/preview-card.mdx index 51bf0f0861..1c708b9a51 100644 --- a/docs/data/components/preview-card/preview-card.mdx +++ b/docs/data/components/preview-card/preview-card.mdx @@ -104,12 +104,6 @@ To change how long the Preview Card waits until it opens or closes, use the `del ``` -The delay type can be changed from `"rest"` (user's cursor is static over the trigger for the given timeout in milliseconds) to `"hover"` (the user's cursor has entered the trigger): - -```jsx - -``` - ## Controlled To control the Preview Card with external state, use the `open` and `onOpenChange` props: diff --git a/docs/data/components/tooltip/tooltip.mdx b/docs/data/components/tooltip/tooltip.mdx index e2a7cad95d..758d3339b5 100644 --- a/docs/data/components/tooltip/tooltip.mdx +++ b/docs/data/components/tooltip/tooltip.mdx @@ -126,12 +126,6 @@ To change how long the tooltip waits until it opens or closes, use the `delay` a ``` -The delay type can be changed from `"rest"` (user's cursor is static over the trigger for the given timeout in milliseconds) to `"hover"` (the user's cursor has entered the trigger): - -```jsx - -``` - ## Controlled To control the tooltip with external state, use the `open` and `onOpenChange` props: diff --git a/docs/data/translations/api-docs/popover-root/popover-root.json b/docs/data/translations/api-docs/popover-root/popover-root.json index 0029313ffe..9c1d22710e 100644 --- a/docs/data/translations/api-docs/popover-root/popover-root.json +++ b/docs/data/translations/api-docs/popover-root/popover-root.json @@ -13,9 +13,6 @@ "delay": { "description": "The delay in milliseconds until the popover popup is opened when openOnHover is true." }, - "delayType": { - "description": "The delay type to use when openOnHover is true. rest means the delay represents how long the user's cursor must rest on the trigger before the popover popup is opened. hover means the delay represents how long to wait as soon as the user's cursor has entered the trigger." - }, "onOpenChange": { "description": "Callback fired when the popover popup is requested to be opened or closed. Use when controlled." }, diff --git a/docs/data/translations/api-docs/preview-card-root/preview-card-root.json b/docs/data/translations/api-docs/preview-card-root/preview-card-root.json index 5487158368..6baba1c2d5 100644 --- a/docs/data/translations/api-docs/preview-card-root/preview-card-root.json +++ b/docs/data/translations/api-docs/preview-card-root/preview-card-root.json @@ -13,9 +13,6 @@ "delay": { "description": "The delay in milliseconds until the preview card popup is opened when openOnHover is true." }, - "delayType": { - "description": "The delay type to use when the preview card is triggered by hover. rest means the delay represents how long the user's cursor must rest on the trigger before the preview card popup is opened. hover means the delay represents how long to wait as soon as the user's cursor has entered the trigger." - }, "onOpenChange": { "description": "Callback fired when the preview card popup is requested to be opened or closed. Use when controlled." }, diff --git a/docs/data/translations/api-docs/tooltip-root/tooltip-root.json b/docs/data/translations/api-docs/tooltip-root/tooltip-root.json index 137b9daae7..3040a2297a 100644 --- a/docs/data/translations/api-docs/tooltip-root/tooltip-root.json +++ b/docs/data/translations/api-docs/tooltip-root/tooltip-root.json @@ -9,9 +9,6 @@ "description": "Whether the tooltip popup is open by default. Use when uncontrolled." }, "delay": { "description": "The delay in milliseconds until the tooltip popup is opened." }, - "delayType": { - "description": "The delay type to use. rest means the delay represents how long the user's cursor must rest on the trigger before the tooltip popup is opened. hover means the delay represents how long to wait as soon as the user's cursor has entered the trigger." - }, "hoverable": { "description": "Whether the user can move their cursor from the trigger element toward the tooltip popup element without it closing using a "safe polygon" technique." }, diff --git a/packages/mui-base/src/Popover/Root/PopoverRoot.test.tsx b/packages/mui-base/src/Popover/Root/PopoverRoot.test.tsx index 029c349c1e..495fc2f1a7 100644 --- a/packages/mui-base/src/Popover/Root/PopoverRoot.test.tsx +++ b/packages/mui-base/src/Popover/Root/PopoverRoot.test.tsx @@ -263,32 +263,6 @@ describe('', () => { expect(screen.getByText('Content')).not.to.equal(null); }); - - it('should open after delay with hover type', async () => { - await render( - - - - Content - - , - ); - - const anchor = screen.getByRole('button'); - - fireEvent.mouseEnter(anchor); - clock.tick(OPEN_DELAY / 2); - - await flushMicrotasks(); - - expect(screen.queryByText('Content')).to.equal(null); - - clock.tick(OPEN_DELAY / 2); - - await flushMicrotasks(); - - expect(screen.getByText('Content')).not.to.equal(null); - }); }); describe('prop: closeDelay', () => { diff --git a/packages/mui-base/src/Popover/Root/PopoverRoot.tsx b/packages/mui-base/src/Popover/Root/PopoverRoot.tsx index cfc4c2d249..905deebde1 100644 --- a/packages/mui-base/src/Popover/Root/PopoverRoot.tsx +++ b/packages/mui-base/src/Popover/Root/PopoverRoot.tsx @@ -17,7 +17,7 @@ import { OPEN_DELAY } from '../utils/constants'; * - [PopoverRoot API](https://base-ui.netlify.app/components/react-popover/#api-reference-PopoverRoot) */ const PopoverRoot: React.FC = function PopoverRoot(props) { - const { openOnHover = false, delayType = 'rest', delay, closeDelay = 0, animated = true } = props; + const { openOnHover = false, delay, closeDelay = 0, animated = true } = props; const delayWithDefault = delay ?? OPEN_DELAY; @@ -43,7 +43,6 @@ const PopoverRoot: React.FC = function PopoverRoot(props) { } = usePopoverRoot({ openOnHover, delay: delayWithDefault, - delayType, closeDelay, animated, open: props.open, @@ -55,7 +54,6 @@ const PopoverRoot: React.FC = function PopoverRoot(props) { () => ({ openOnHover, delay: delayWithDefault, - delayType, closeDelay, open, setOpen, @@ -79,7 +77,6 @@ const PopoverRoot: React.FC = function PopoverRoot(props) { [ openOnHover, delayWithDefault, - delayType, closeDelay, open, setOpen, @@ -145,14 +142,6 @@ PopoverRoot.propTypes /* remove-proptypes */ = { * @default 300 */ delay: PropTypes.number, - /** - * The delay type to use when `openOnHover` is `true`. `rest` means the `delay` represents how - * long the user's cursor must rest on the trigger before the popover popup is opened. `hover` - * means the `delay` represents how long to wait as soon as the user's cursor has entered the - * trigger. - * @default 'rest' - */ - delayType: PropTypes.oneOf(['hover', 'rest']), /** * Callback fired when the popover popup is requested to be opened or closed. Use when * controlled. diff --git a/packages/mui-base/src/Popover/Root/PopoverRootContext.ts b/packages/mui-base/src/Popover/Root/PopoverRootContext.ts index 3e696ad04b..a6f621d8a7 100644 --- a/packages/mui-base/src/Popover/Root/PopoverRootContext.ts +++ b/packages/mui-base/src/Popover/Root/PopoverRootContext.ts @@ -15,7 +15,6 @@ export interface PopoverRootContext { popupRef: React.RefObject; delay: number; closeDelay: number; - delayType: 'rest' | 'hover'; instantType: 'dismiss' | 'click' | undefined; mounted: boolean; setMounted: React.Dispatch>; diff --git a/packages/mui-base/src/Popover/Root/usePopoverRoot.ts b/packages/mui-base/src/Popover/Root/usePopoverRoot.ts index a1b2011773..b8b609abbe 100644 --- a/packages/mui-base/src/Popover/Root/usePopoverRoot.ts +++ b/packages/mui-base/src/Popover/Root/usePopoverRoot.ts @@ -25,7 +25,6 @@ export function usePopoverRoot(params: usePopoverRoot.Parameters): usePopoverRoo onOpenChange: onOpenChangeProp = () => {}, defaultOpen = false, keepMounted = false, - delayType = 'rest', delay, closeDelay, openOnHover = false, @@ -96,12 +95,7 @@ export function usePopoverRoot(params: usePopoverRoot.Parameters): usePopoverRoo }, }); - const computedRestMs = delayType === 'rest' ? delayWithDefault : undefined; - let computedOpenDelay: number | undefined = delayType === 'hover' ? delayWithDefault : undefined; - - if (delayType === 'hover') { - computedOpenDelay = delay == null ? delayWithDefault : delay; - } + const computedRestMs = delayWithDefault; const hover = useHover(context, { enabled: openOnHover, @@ -110,7 +104,6 @@ export function usePopoverRoot(params: usePopoverRoot.Parameters): usePopoverRoo handleClose: safePolygon(), restMs: computedRestMs, delay: { - open: computedOpenDelay, close: closeDelayWithDefault, }, }); @@ -191,14 +184,6 @@ export namespace usePopoverRoot { * @default 0 */ closeDelay?: number; - /** - * The delay type to use when `openOnHover` is `true`. `rest` means the `delay` represents how - * long the user's cursor must rest on the trigger before the popover popup is opened. `hover` - * means the `delay` represents how long to wait as soon as the user's cursor has entered the - * trigger. - * @default 'rest' - */ - delayType?: 'rest' | 'hover'; /** * Whether the popover popup element stays mounted in the DOM when closed. * @default false diff --git a/packages/mui-base/src/PreviewCard/Root/PreviewCardContext.ts b/packages/mui-base/src/PreviewCard/Root/PreviewCardContext.ts index f3e6b1291c..4e87ed603f 100644 --- a/packages/mui-base/src/PreviewCard/Root/PreviewCardContext.ts +++ b/packages/mui-base/src/PreviewCard/Root/PreviewCardContext.ts @@ -13,7 +13,6 @@ export interface PreviewCardRootContext { setPositionerElement: (el: HTMLElement | null) => void; delay: number; closeDelay: number; - delayType: 'rest' | 'hover'; mounted: boolean; setMounted: React.Dispatch>; getRootTriggerProps: (externalProps?: GenericHTMLProps) => GenericHTMLProps; diff --git a/packages/mui-base/src/PreviewCard/Root/PreviewCardRoot.test.tsx b/packages/mui-base/src/PreviewCard/Root/PreviewCardRoot.test.tsx index b379c31fe4..33949b762b 100644 --- a/packages/mui-base/src/PreviewCard/Root/PreviewCardRoot.test.tsx +++ b/packages/mui-base/src/PreviewCard/Root/PreviewCardRoot.test.tsx @@ -330,32 +330,6 @@ describe('', () => { expect(screen.getByText('Content')).not.to.equal(null); }); - - it('should open after delay with hover type', async () => { - await render( - - - - Content - - , - ); - - const trigger = screen.getByRole('link'); - - fireEvent.mouseEnter(trigger); - clock.tick(OPEN_DELAY - 100); - - await flushMicrotasks(); - - expect(screen.queryByText('Content')).to.equal(null); - - clock.tick(100); - - await flushMicrotasks(); - - expect(screen.getByText('Content')).not.to.equal(null); - }); }); describe('prop: closeDelay', () => { diff --git a/packages/mui-base/src/PreviewCard/Root/PreviewCardRoot.tsx b/packages/mui-base/src/PreviewCard/Root/PreviewCardRoot.tsx index 39922404c1..9894946c07 100644 --- a/packages/mui-base/src/PreviewCard/Root/PreviewCardRoot.tsx +++ b/packages/mui-base/src/PreviewCard/Root/PreviewCardRoot.tsx @@ -16,7 +16,7 @@ import { CLOSE_DELAY, OPEN_DELAY } from '../utils/constants'; * - [PreviewCardRoot API](https://base-ui.netlify.app/components/react-preview-card/#api-reference-PreviewCardRoot) */ const PreviewCardRoot: React.FC = function PreviewCardRoot(props) { - const { delayType = 'rest', delay, closeDelay, animated = true } = props; + const { delay, closeDelay, animated = true } = props; const delayWithDefault = delay ?? OPEN_DELAY; const closeDelayWithDefault = closeDelay ?? CLOSE_DELAY; @@ -39,7 +39,6 @@ const PreviewCardRoot: React.FC = function PreviewCardRoo } = usePreviewCardRoot({ animated, delay, - delayType, closeDelay, open: props.open, onOpenChange: props.onOpenChange, @@ -49,7 +48,6 @@ const PreviewCardRoot: React.FC = function PreviewCardRoo const contextValue = React.useMemo( () => ({ delay: delayWithDefault, - delayType, closeDelay: closeDelayWithDefault, open, setOpen, @@ -68,7 +66,6 @@ const PreviewCardRoot: React.FC = function PreviewCardRoo }), [ delayWithDefault, - delayType, closeDelayWithDefault, open, setOpen, @@ -132,14 +129,6 @@ PreviewCardRoot.propTypes /* remove-proptypes */ = { * @default 600 */ delay: PropTypes.number, - /** - * The delay type to use when the preview card is triggered by hover. `rest` means the `delay` - * represents how long the user's cursor must rest on the trigger before the preview card popup is - * opened. `hover` means the `delay` represents how long to wait as soon as the user's cursor has - * entered the trigger. - * @default 'rest' - */ - delayType: PropTypes.oneOf(['hover', 'rest']), /** * Callback fired when the preview card popup is requested to be opened or closed. Use when * controlled. diff --git a/packages/mui-base/src/PreviewCard/Root/usePreviewCardRoot.ts b/packages/mui-base/src/PreviewCard/Root/usePreviewCardRoot.ts index 1e9e3dc642..33f0be50c2 100644 --- a/packages/mui-base/src/PreviewCard/Root/usePreviewCardRoot.ts +++ b/packages/mui-base/src/PreviewCard/Root/usePreviewCardRoot.ts @@ -27,7 +27,6 @@ export function usePreviewCardRoot( defaultOpen = false, keepMounted = false, animated = true, - delayType = 'rest', delay, closeDelay, } = params; @@ -98,12 +97,7 @@ export function usePreviewCardRoot( }); const instantType = instantTypeState; - const computedRestMs = delayType === 'rest' ? delayWithDefault : undefined; - let computedOpenDelay: number | undefined = delayType === 'hover' ? delayWithDefault : undefined; - - if (delayType === 'hover') { - computedOpenDelay = delay == null ? delayWithDefault : delay; - } + const computedRestMs = delayWithDefault; const hover = useHover(context, { mouseOnly: true, @@ -111,7 +105,6 @@ export function usePreviewCardRoot( handleClose: safePolygon(), restMs: computedRestMs, delay: { - open: computedOpenDelay, close: closeDelayWithDefault, }, }); @@ -186,14 +179,6 @@ export namespace usePreviewCardRoot { * @default 300 */ closeDelay?: number; - /** - * The delay type to use when the preview card is triggered by hover. `rest` means the `delay` - * represents how long the user's cursor must rest on the trigger before the preview card popup is - * opened. `hover` means the `delay` represents how long to wait as soon as the user's cursor has - * entered the trigger. - * @default 'rest' - */ - delayType?: 'rest' | 'hover'; /** * Whether the preview card popup element stays mounted in the DOM when closed. * @default false diff --git a/packages/mui-base/src/Tooltip/Root/TooltipRoot.test.tsx b/packages/mui-base/src/Tooltip/Root/TooltipRoot.test.tsx index 809bc2ce66..e95ceb6330 100644 --- a/packages/mui-base/src/Tooltip/Root/TooltipRoot.test.tsx +++ b/packages/mui-base/src/Tooltip/Root/TooltipRoot.test.tsx @@ -328,32 +328,6 @@ describe('', () => { expect(screen.getByText('Content')).not.to.equal(null); }); - - it('should open after delay with hover type', async () => { - await render( - - - - Content - - , - ); - - const trigger = screen.getByRole('button'); - - fireEvent.mouseEnter(trigger); - clock.tick(OPEN_DELAY - 100); - - await flushMicrotasks(); - - expect(screen.queryByText('Content')).to.equal(null); - - clock.tick(100); - - await flushMicrotasks(); - - expect(screen.getByText('Content')).not.to.equal(null); - }); }); describe('prop: closeDelay', () => { diff --git a/packages/mui-base/src/Tooltip/Root/TooltipRoot.tsx b/packages/mui-base/src/Tooltip/Root/TooltipRoot.tsx index 71cf3d7b38..b44e3360d0 100644 --- a/packages/mui-base/src/Tooltip/Root/TooltipRoot.tsx +++ b/packages/mui-base/src/Tooltip/Root/TooltipRoot.tsx @@ -17,14 +17,7 @@ import { OPEN_DELAY } from '../utils/constants'; * - [TooltipRoot API](https://base-ui.netlify.app/components/react-tooltip/#api-reference-TooltipRoot) */ const TooltipRoot: React.FC = function TooltipRoot(props) { - const { - delayType = 'rest', - delay, - closeDelay, - hoverable = true, - animated = true, - trackCursorAxis = 'none', - } = props; + const { delay, closeDelay, hoverable = true, animated = true, trackCursorAxis = 'none' } = props; const delayWithDefault = delay ?? OPEN_DELAY; const closeDelayWithDefault = closeDelay ?? 0; @@ -49,7 +42,6 @@ const TooltipRoot: React.FC = function TooltipRoot(props) { animated, trackCursorAxis, delay, - delayType, closeDelay, open: props.open, onOpenChange: props.onOpenChange, @@ -59,7 +51,6 @@ const TooltipRoot: React.FC = function TooltipRoot(props) { const contextValue = React.useMemo( () => ({ delay: delayWithDefault, - delayType, closeDelay: closeDelayWithDefault, open, setOpen, @@ -79,7 +70,6 @@ const TooltipRoot: React.FC = function TooltipRoot(props) { }), [ delayWithDefault, - delayType, closeDelayWithDefault, open, setOpen, @@ -142,13 +132,6 @@ TooltipRoot.propTypes /* remove-proptypes */ = { * @default 600 */ delay: PropTypes.number, - /** - * The delay type to use. `rest` means the `delay` represents how long the user's cursor must - * rest on the trigger before the tooltip popup is opened. `hover` means the `delay` represents - * how long to wait as soon as the user's cursor has entered the trigger. - * @default 'rest' - */ - delayType: PropTypes.oneOf(['hover', 'rest']), /** * Whether the user can move their cursor from the trigger element toward the tooltip popup element * without it closing using a "safe polygon" technique. diff --git a/packages/mui-base/src/Tooltip/Root/TooltipRootContext.ts b/packages/mui-base/src/Tooltip/Root/TooltipRootContext.ts index b8e57e7f21..05e581963c 100644 --- a/packages/mui-base/src/Tooltip/Root/TooltipRootContext.ts +++ b/packages/mui-base/src/Tooltip/Root/TooltipRootContext.ts @@ -14,7 +14,6 @@ export interface TooltipRootContext { popupRef: React.RefObject; delay: number; closeDelay: number; - delayType: 'rest' | 'hover'; mounted: boolean; setMounted: React.Dispatch>; getRootTriggerProps: (externalProps?: GenericHTMLProps) => GenericHTMLProps; diff --git a/packages/mui-base/src/Tooltip/Root/useTooltipRoot.ts b/packages/mui-base/src/Tooltip/Root/useTooltipRoot.ts index 3933352e59..5072dbc7a2 100644 --- a/packages/mui-base/src/Tooltip/Root/useTooltipRoot.ts +++ b/packages/mui-base/src/Tooltip/Root/useTooltipRoot.ts @@ -29,7 +29,6 @@ export function useTooltipRoot(params: useTooltipRoot.Parameters): useTooltipRoo hoverable = true, animated = true, trackCursorAxis = 'none', - delayType = 'rest', delay, closeDelay, } = params; @@ -110,23 +109,9 @@ export function useTooltipRoot(params: useTooltipRoot.Parameters): useTooltipRoo instantType = instantTypeState; } - const computedRestMs = delayType === 'rest' ? openGroupDelay || delayWithDefault : undefined; - let computedOpenDelay: number | undefined = delayType === 'hover' ? delayWithDefault : undefined; + const computedRestMs = openGroupDelay || delayWithDefault; let computedCloseDelay: number | undefined = closeDelayWithDefault; - if (delayType === 'hover') { - if (delay == null) { - computedOpenDelay = - groupDelay === 0 - ? // A provider is not present. - delayWithDefault - : // A provider is present. - openGroupDelay; - } else { - computedOpenDelay = delay; - } - } - // A provider is present and the close delay is not set. if (closeDelay == null && groupDelay !== 0) { computedCloseDelay = closeGroupDelay; @@ -138,7 +123,6 @@ export function useTooltipRoot(params: useTooltipRoot.Parameters): useTooltipRoo handleClose: hoverable && trackCursorAxis !== 'both' ? safePolygon() : null, restMs: computedRestMs, delay: { - open: computedOpenDelay, close: computedCloseDelay, }, }); @@ -228,13 +212,6 @@ export namespace useTooltipRoot { * @default 0 */ closeDelay?: number; - /** - * The delay type to use. `rest` means the `delay` represents how long the user's cursor must - * rest on the trigger before the tooltip popup is opened. `hover` means the `delay` represents - * how long to wait as soon as the user's cursor has entered the trigger. - * @default 'rest' - */ - delayType?: 'rest' | 'hover'; /** * Whether the tooltip popup element stays mounted in the DOM when closed. * @default false