"use strict"; 'use client'; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; exports.testReset = testReset; var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose")); var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")); var React = _interopRequireWildcard(require("react")); var _propTypes = _interopRequireDefault(require("prop-types")); var _clsx = _interopRequireDefault(require("clsx")); var _useTimeout = _interopRequireWildcard(require("@mui/utils/useTimeout")); var _elementAcceptingRef = _interopRequireDefault(require("@mui/utils/elementAcceptingRef")); var _utils = require("@mui/base/utils"); var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses")); var _colorManipulator = require("@mui/system/colorManipulator"); var _RtlProvider = require("@mui/system/RtlProvider"); var _styled = _interopRequireDefault(require("../styles/styled")); var _useTheme = _interopRequireDefault(require("../styles/useTheme")); var _useThemeProps = _interopRequireDefault(require("../styles/useThemeProps")); var _capitalize = _interopRequireDefault(require("../utils/capitalize")); var _Grow = _interopRequireDefault(require("../Grow")); var _Popper = _interopRequireDefault(require("../Popper")); var _useEventCallback = _interopRequireDefault(require("../utils/useEventCallback")); var _useForkRef = _interopRequireDefault(require("../utils/useForkRef")); var _useId = _interopRequireDefault(require("../utils/useId")); var _useIsFocusVisible = _interopRequireDefault(require("../utils/useIsFocusVisible")); var _useControlled = _interopRequireDefault(require("../utils/useControlled")); var _tooltipClasses = _interopRequireWildcard(require("./tooltipClasses")); var _jsxRuntime = require("react/jsx-runtime"); const _excluded = ["arrow", "children", "classes", "components", "componentsProps", "describeChild", "disableFocusListener", "disableHoverListener", "disableInteractive", "disableTouchListener", "enterDelay", "enterNextDelay", "enterTouchDelay", "followCursor", "id", "leaveDelay", "leaveTouchDelay", "onClose", "onOpen", "open", "placement", "PopperComponent", "PopperProps", "slotProps", "slots", "title", "TransitionComponent", "TransitionProps"]; function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } function round(value) { return Math.round(value * 1e5) / 1e5; } const useUtilityClasses = ownerState => { const { classes, disableInteractive, arrow, touch, placement } = ownerState; const slots = { popper: ['popper', !disableInteractive && 'popperInteractive', arrow && 'popperArrow'], tooltip: ['tooltip', arrow && 'tooltipArrow', touch && 'touch', `tooltipPlacement${(0, _capitalize.default)(placement.split('-')[0])}`], arrow: ['arrow'] }; return (0, _composeClasses.default)(slots, _tooltipClasses.getTooltipUtilityClass, classes); }; const TooltipPopper = (0, _styled.default)(_Popper.default, { name: 'MuiTooltip', slot: 'Popper', overridesResolver: (props, styles) => { const { ownerState } = props; return [styles.popper, !ownerState.disableInteractive && styles.popperInteractive, ownerState.arrow && styles.popperArrow, !ownerState.open && styles.popperClose]; } })(({ theme, ownerState, open }) => (0, _extends2.default)({ zIndex: (theme.vars || theme).zIndex.tooltip, pointerEvents: 'none' }, !ownerState.disableInteractive && { pointerEvents: 'auto' }, !open && { pointerEvents: 'none' }, ownerState.arrow && { [`&[data-popper-placement*="bottom"] .${_tooltipClasses.default.arrow}`]: { top: 0, marginTop: '-0.71em', '&::before': { transformOrigin: '0 100%' } }, [`&[data-popper-placement*="top"] .${_tooltipClasses.default.arrow}`]: { bottom: 0, marginBottom: '-0.71em', '&::before': { transformOrigin: '100% 0' } }, [`&[data-popper-placement*="right"] .${_tooltipClasses.default.arrow}`]: (0, _extends2.default)({}, !ownerState.isRtl ? { left: 0, marginLeft: '-0.71em' } : { right: 0, marginRight: '-0.71em' }, { height: '1em', width: '0.71em', '&::before': { transformOrigin: '100% 100%' } }), [`&[data-popper-placement*="left"] .${_tooltipClasses.default.arrow}`]: (0, _extends2.default)({}, !ownerState.isRtl ? { right: 0, marginRight: '-0.71em' } : { left: 0, marginLeft: '-0.71em' }, { height: '1em', width: '0.71em', '&::before': { transformOrigin: '0 0' } }) })); const TooltipTooltip = (0, _styled.default)('div', { name: 'MuiTooltip', slot: 'Tooltip', overridesResolver: (props, styles) => { const { ownerState } = props; return [styles.tooltip, ownerState.touch && styles.touch, ownerState.arrow && styles.tooltipArrow, styles[`tooltipPlacement${(0, _capitalize.default)(ownerState.placement.split('-')[0])}`]]; } })(({ theme, ownerState }) => (0, _extends2.default)({ backgroundColor: theme.vars ? theme.vars.palette.Tooltip.bg : (0, _colorManipulator.alpha)(theme.palette.grey[700], 0.92), borderRadius: (theme.vars || theme).shape.borderRadius, color: (theme.vars || theme).palette.common.white, fontFamily: theme.typography.fontFamily, padding: '4px 8px', fontSize: theme.typography.pxToRem(11), maxWidth: 300, margin: 2, wordWrap: 'break-word', fontWeight: theme.typography.fontWeightMedium }, ownerState.arrow && { position: 'relative', margin: 0 }, ownerState.touch && { padding: '8px 16px', fontSize: theme.typography.pxToRem(14), lineHeight: `${round(16 / 14)}em`, fontWeight: theme.typography.fontWeightRegular }, { [`.${_tooltipClasses.default.popper}[data-popper-placement*="left"] &`]: (0, _extends2.default)({ transformOrigin: 'right center' }, !ownerState.isRtl ? (0, _extends2.default)({ marginRight: '14px' }, ownerState.touch && { marginRight: '24px' }) : (0, _extends2.default)({ marginLeft: '14px' }, ownerState.touch && { marginLeft: '24px' })), [`.${_tooltipClasses.default.popper}[data-popper-placement*="right"] &`]: (0, _extends2.default)({ transformOrigin: 'left center' }, !ownerState.isRtl ? (0, _extends2.default)({ marginLeft: '14px' }, ownerState.touch && { marginLeft: '24px' }) : (0, _extends2.default)({ marginRight: '14px' }, ownerState.touch && { marginRight: '24px' })), [`.${_tooltipClasses.default.popper}[data-popper-placement*="top"] &`]: (0, _extends2.default)({ transformOrigin: 'center bottom', marginBottom: '14px' }, ownerState.touch && { marginBottom: '24px' }), [`.${_tooltipClasses.default.popper}[data-popper-placement*="bottom"] &`]: (0, _extends2.default)({ transformOrigin: 'center top', marginTop: '14px' }, ownerState.touch && { marginTop: '24px' }) })); const TooltipArrow = (0, _styled.default)('span', { name: 'MuiTooltip', slot: 'Arrow', overridesResolver: (props, styles) => styles.arrow })(({ theme }) => ({ overflow: 'hidden', position: 'absolute', width: '1em', height: '0.71em' /* = width / sqrt(2) = (length of the hypotenuse) */, boxSizing: 'border-box', color: theme.vars ? theme.vars.palette.Tooltip.bg : (0, _colorManipulator.alpha)(theme.palette.grey[700], 0.9), '&::before': { content: '""', margin: 'auto', display: 'block', width: '100%', height: '100%', backgroundColor: 'currentColor', transform: 'rotate(45deg)' } })); let hystersisOpen = false; const hystersisTimer = new _useTimeout.Timeout(); let cursorPosition = { x: 0, y: 0 }; function testReset() { hystersisOpen = false; hystersisTimer.clear(); } function composeEventHandler(handler, eventHandler) { return (event, ...params) => { if (eventHandler) { eventHandler(event, ...params); } handler(event, ...params); }; } // TODO v6: Remove PopperComponent, PopperProps, TransitionComponent and TransitionProps. const Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(inProps, ref) { var _ref, _slots$popper, _ref2, _ref3, _slots$transition, _ref4, _slots$tooltip, _ref5, _slots$arrow, _slotProps$popper, _ref6, _slotProps$popper2, _slotProps$transition, _slotProps$tooltip, _ref7, _slotProps$tooltip2, _slotProps$arrow, _ref8, _slotProps$arrow2; const props = (0, _useThemeProps.default)({ props: inProps, name: 'MuiTooltip' }); const { arrow = false, children: childrenProp, components = {}, componentsProps = {}, describeChild = false, disableFocusListener = false, disableHoverListener = false, disableInteractive: disableInteractiveProp = false, disableTouchListener = false, enterDelay = 100, enterNextDelay = 0, enterTouchDelay = 700, followCursor = false, id: idProp, leaveDelay = 0, leaveTouchDelay = 1500, onClose, onOpen, open: openProp, placement = 'bottom', PopperComponent: PopperComponentProp, PopperProps = {}, slotProps = {}, slots = {}, title, TransitionComponent: TransitionComponentProp = _Grow.default, TransitionProps } = props, other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded); // to prevent runtime errors, developers will need to provide a child as a React element anyway. const children = /*#__PURE__*/React.isValidElement(childrenProp) ? childrenProp : /*#__PURE__*/(0, _jsxRuntime.jsx)("span", { children: childrenProp }); const theme = (0, _useTheme.default)(); const isRtl = (0, _RtlProvider.useRtl)(); const [childNode, setChildNode] = React.useState(); const [arrowRef, setArrowRef] = React.useState(null); const ignoreNonTouchEvents = React.useRef(false); const disableInteractive = disableInteractiveProp || followCursor; const closeTimer = (0, _useTimeout.default)(); const enterTimer = (0, _useTimeout.default)(); const leaveTimer = (0, _useTimeout.default)(); const touchTimer = (0, _useTimeout.default)(); const [openState, setOpenState] = (0, _useControlled.default)({ controlled: openProp, default: false, name: 'Tooltip', state: 'open' }); let open = openState; if (process.env.NODE_ENV !== 'production') { // eslint-disable-next-line react-hooks/rules-of-hooks const { current: isControlled } = React.useRef(openProp !== undefined); // eslint-disable-next-line react-hooks/rules-of-hooks React.useEffect(() => { if (childNode && childNode.disabled && !isControlled && title !== '' && childNode.tagName.toLowerCase() === 'button') { console.error(['MUI: You are providing a disabled `button` child to the Tooltip component.', 'A disabled element does not fire events.', "Tooltip needs to listen to the child element's events to display the title.", '', 'Add a simple wrapper element, such as a `span`.'].join('\n')); } }, [title, childNode, isControlled]); } const id = (0, _useId.default)(idProp); const prevUserSelect = React.useRef(); const stopTouchInteraction = (0, _useEventCallback.default)(() => { if (prevUserSelect.current !== undefined) { document.body.style.WebkitUserSelect = prevUserSelect.current; prevUserSelect.current = undefined; } touchTimer.clear(); }); React.useEffect(() => stopTouchInteraction, [stopTouchInteraction]); const handleOpen = event => { hystersisTimer.clear(); hystersisOpen = true; // The mouseover event will trigger for every nested element in the tooltip. // We can skip rerendering when the tooltip is already open. // We are using the mouseover event instead of the mouseenter event to fix a hide/show issue. setOpenState(true); if (onOpen && !open) { onOpen(event); } }; const handleClose = (0, _useEventCallback.default)( /** * @param {React.SyntheticEvent | Event} event */ event => { hystersisTimer.start(800 + leaveDelay, () => { hystersisOpen = false; }); setOpenState(false); if (onClose && open) { onClose(event); } closeTimer.start(theme.transitions.duration.shortest, () => { ignoreNonTouchEvents.current = false; }); }); const handleMouseOver = event => { if (ignoreNonTouchEvents.current && event.type !== 'touchstart') { return; } // Remove the title ahead of time. // We don't want to wait for the next render commit. // We would risk displaying two tooltips at the same time (native + this one). if (childNode) { childNode.removeAttribute('title'); } enterTimer.clear(); leaveTimer.clear(); if (enterDelay || hystersisOpen && enterNextDelay) { enterTimer.start(hystersisOpen ? enterNextDelay : enterDelay, () => { handleOpen(event); }); } else { handleOpen(event); } }; const handleMouseLeave = event => { enterTimer.clear(); leaveTimer.start(leaveDelay, () => { handleClose(event); }); }; const { isFocusVisibleRef, onBlur: handleBlurVisible, onFocus: handleFocusVisible, ref: focusVisibleRef } = (0, _useIsFocusVisible.default)(); // We don't necessarily care about the focusVisible state (which is safe to access via ref anyway). // We just need to re-render the Tooltip if the focus-visible state changes. const [, setChildIsFocusVisible] = React.useState(false); const handleBlur = event => { handleBlurVisible(event); if (isFocusVisibleRef.current === false) { setChildIsFocusVisible(false); handleMouseLeave(event); } }; const handleFocus = event => { // Workaround for https://github.com/facebook/react/issues/7769 // The autoFocus of React might trigger the event before the componentDidMount. // We need to account for this eventuality. if (!childNode) { setChildNode(event.currentTarget); } handleFocusVisible(event); if (isFocusVisibleRef.current === true) { setChildIsFocusVisible(true); handleMouseOver(event); } }; const detectTouchStart = event => { ignoreNonTouchEvents.current = true; const childrenProps = children.props; if (childrenProps.onTouchStart) { childrenProps.onTouchStart(event); } }; const handleTouchStart = event => { detectTouchStart(event); leaveTimer.clear(); closeTimer.clear(); stopTouchInteraction(); prevUserSelect.current = document.body.style.WebkitUserSelect; // Prevent iOS text selection on long-tap. document.body.style.WebkitUserSelect = 'none'; touchTimer.start(enterTouchDelay, () => { document.body.style.WebkitUserSelect = prevUserSelect.current; handleMouseOver(event); }); }; const handleTouchEnd = event => { if (children.props.onTouchEnd) { children.props.onTouchEnd(event); } stopTouchInteraction(); leaveTimer.start(leaveTouchDelay, () => { handleClose(event); }); }; React.useEffect(() => { if (!open) { return undefined; } /** * @param {KeyboardEvent} nativeEvent */ function handleKeyDown(nativeEvent) { // IE11, Edge (prior to using Bink?) use 'Esc' if (nativeEvent.key === 'Escape' || nativeEvent.key === 'Esc') { handleClose(nativeEvent); } } document.addEventListener('keydown', handleKeyDown); return () => { document.removeEventListener('keydown', handleKeyDown); }; }, [handleClose, open]); const handleRef = (0, _useForkRef.default)(children.ref, focusVisibleRef, setChildNode, ref); // There is no point in displaying an empty tooltip. // So we exclude all falsy values, except 0, which is valid. if (!title && title !== 0) { open = false; } const popperRef = React.useRef(); const handleMouseMove = event => { const childrenProps = children.props; if (childrenProps.onMouseMove) { childrenProps.onMouseMove(event); } cursorPosition = { x: event.clientX, y: event.clientY }; if (popperRef.current) { popperRef.current.update(); } }; const nameOrDescProps = {}; const titleIsString = typeof title === 'string'; if (describeChild) { nameOrDescProps.title = !open && titleIsString && !disableHoverListener ? title : null; nameOrDescProps['aria-describedby'] = open ? id : null; } else { nameOrDescProps['aria-label'] = titleIsString ? title : null; nameOrDescProps['aria-labelledby'] = open && !titleIsString ? id : null; } const childrenProps = (0, _extends2.default)({}, nameOrDescProps, other, children.props, { className: (0, _clsx.default)(other.className, children.props.className), onTouchStart: detectTouchStart, ref: handleRef }, followCursor ? { onMouseMove: handleMouseMove } : {}); if (process.env.NODE_ENV !== 'production') { childrenProps['data-mui-internal-clone-element'] = true; // eslint-disable-next-line react-hooks/rules-of-hooks React.useEffect(() => { if (childNode && !childNode.getAttribute('data-mui-internal-clone-element')) { console.error(['MUI: The `children` component of the Tooltip is not forwarding its props correctly.', 'Please make sure that props are spread on the same element that the ref is applied to.'].join('\n')); } }, [childNode]); } const interactiveWrapperListeners = {}; if (!disableTouchListener) { childrenProps.onTouchStart = handleTouchStart; childrenProps.onTouchEnd = handleTouchEnd; } if (!disableHoverListener) { childrenProps.onMouseOver = composeEventHandler(handleMouseOver, childrenProps.onMouseOver); childrenProps.onMouseLeave = composeEventHandler(handleMouseLeave, childrenProps.onMouseLeave); if (!disableInteractive) { interactiveWrapperListeners.onMouseOver = handleMouseOver; interactiveWrapperListeners.onMouseLeave = handleMouseLeave; } } if (!disableFocusListener) { childrenProps.onFocus = composeEventHandler(handleFocus, childrenProps.onFocus); childrenProps.onBlur = composeEventHandler(handleBlur, childrenProps.onBlur); if (!disableInteractive) { interactiveWrapperListeners.onFocus = handleFocus; interactiveWrapperListeners.onBlur = handleBlur; } } if (process.env.NODE_ENV !== 'production') { if (children.props.title) { console.error(['MUI: You have provided a `title` prop to the child of .', `Remove this title prop \`${children.props.title}\` or the Tooltip component.`].join('\n')); } } const popperOptions = React.useMemo(() => { var _PopperProps$popperOp; let tooltipModifiers = [{ name: 'arrow', enabled: Boolean(arrowRef), options: { element: arrowRef, padding: 4 } }]; if ((_PopperProps$popperOp = PopperProps.popperOptions) != null && _PopperProps$popperOp.modifiers) { tooltipModifiers = tooltipModifiers.concat(PopperProps.popperOptions.modifiers); } return (0, _extends2.default)({}, PopperProps.popperOptions, { modifiers: tooltipModifiers }); }, [arrowRef, PopperProps]); const ownerState = (0, _extends2.default)({}, props, { isRtl, arrow, disableInteractive, placement, PopperComponentProp, touch: ignoreNonTouchEvents.current }); const classes = useUtilityClasses(ownerState); const PopperComponent = (_ref = (_slots$popper = slots.popper) != null ? _slots$popper : components.Popper) != null ? _ref : TooltipPopper; const TransitionComponent = (_ref2 = (_ref3 = (_slots$transition = slots.transition) != null ? _slots$transition : components.Transition) != null ? _ref3 : TransitionComponentProp) != null ? _ref2 : _Grow.default; const TooltipComponent = (_ref4 = (_slots$tooltip = slots.tooltip) != null ? _slots$tooltip : components.Tooltip) != null ? _ref4 : TooltipTooltip; const ArrowComponent = (_ref5 = (_slots$arrow = slots.arrow) != null ? _slots$arrow : components.Arrow) != null ? _ref5 : TooltipArrow; const popperProps = (0, _utils.appendOwnerState)(PopperComponent, (0, _extends2.default)({}, PopperProps, (_slotProps$popper = slotProps.popper) != null ? _slotProps$popper : componentsProps.popper, { className: (0, _clsx.default)(classes.popper, PopperProps == null ? void 0 : PopperProps.className, (_ref6 = (_slotProps$popper2 = slotProps.popper) != null ? _slotProps$popper2 : componentsProps.popper) == null ? void 0 : _ref6.className) }), ownerState); const transitionProps = (0, _utils.appendOwnerState)(TransitionComponent, (0, _extends2.default)({}, TransitionProps, (_slotProps$transition = slotProps.transition) != null ? _slotProps$transition : componentsProps.transition), ownerState); const tooltipProps = (0, _utils.appendOwnerState)(TooltipComponent, (0, _extends2.default)({}, (_slotProps$tooltip = slotProps.tooltip) != null ? _slotProps$tooltip : componentsProps.tooltip, { className: (0, _clsx.default)(classes.tooltip, (_ref7 = (_slotProps$tooltip2 = slotProps.tooltip) != null ? _slotProps$tooltip2 : componentsProps.tooltip) == null ? void 0 : _ref7.className) }), ownerState); const tooltipArrowProps = (0, _utils.appendOwnerState)(ArrowComponent, (0, _extends2.default)({}, (_slotProps$arrow = slotProps.arrow) != null ? _slotProps$arrow : componentsProps.arrow, { className: (0, _clsx.default)(classes.arrow, (_ref8 = (_slotProps$arrow2 = slotProps.arrow) != null ? _slotProps$arrow2 : componentsProps.arrow) == null ? void 0 : _ref8.className) }), ownerState); return /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, { children: [/*#__PURE__*/React.cloneElement(children, childrenProps), /*#__PURE__*/(0, _jsxRuntime.jsx)(PopperComponent, (0, _extends2.default)({ as: PopperComponentProp != null ? PopperComponentProp : _Popper.default, placement: placement, anchorEl: followCursor ? { getBoundingClientRect: () => ({ top: cursorPosition.y, left: cursorPosition.x, right: cursorPosition.x, bottom: cursorPosition.y, width: 0, height: 0 }) } : childNode, popperRef: popperRef, open: childNode ? open : false, id: id, transition: true }, interactiveWrapperListeners, popperProps, { popperOptions: popperOptions, children: ({ TransitionProps: TransitionPropsInner }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(TransitionComponent, (0, _extends2.default)({ timeout: theme.transitions.duration.shorter }, TransitionPropsInner, transitionProps, { children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(TooltipComponent, (0, _extends2.default)({}, tooltipProps, { children: [title, arrow ? /*#__PURE__*/(0, _jsxRuntime.jsx)(ArrowComponent, (0, _extends2.default)({}, tooltipArrowProps, { ref: setArrowRef })) : null] })) })) }))] }); }); process.env.NODE_ENV !== "production" ? Tooltip.propTypes /* remove-proptypes */ = { // ┌────────────────────────────── Warning ──────────────────────────────┐ // │ These PropTypes are generated from the TypeScript type definitions. │ // │ To update them, edit the d.ts file and run `pnpm proptypes`. │ // └─────────────────────────────────────────────────────────────────────┘ /** * If `true`, adds an arrow to the tooltip. * @default false */ arrow: _propTypes.default.bool, /** * Tooltip reference element. */ children: _elementAcceptingRef.default.isRequired, /** * Override or extend the styles applied to the component. */ classes: _propTypes.default.object, /** * @ignore */ className: _propTypes.default.string, /** * The components used for each slot inside. * * This prop is an alias for the `slots` prop. * It's recommended to use the `slots` prop instead. * * @default {} */ components: _propTypes.default.shape({ Arrow: _propTypes.default.elementType, Popper: _propTypes.default.elementType, Tooltip: _propTypes.default.elementType, Transition: _propTypes.default.elementType }), /** * The extra props for the slot components. * You can override the existing props or add new ones. * * This prop is an alias for the `slotProps` prop. * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future. * * @default {} */ componentsProps: _propTypes.default.shape({ arrow: _propTypes.default.object, popper: _propTypes.default.object, tooltip: _propTypes.default.object, transition: _propTypes.default.object }), /** * Set to `true` if the `title` acts as an accessible description. * By default the `title` acts as an accessible label for the child. * @default false */ describeChild: _propTypes.default.bool, /** * Do not respond to focus-visible events. * @default false */ disableFocusListener: _propTypes.default.bool, /** * Do not respond to hover events. * @default false */ disableHoverListener: _propTypes.default.bool, /** * Makes a tooltip not interactive, i.e. it will close when the user * hovers over the tooltip before the `leaveDelay` is expired. * @default false */ disableInteractive: _propTypes.default.bool, /** * Do not respond to long press touch events. * @default false */ disableTouchListener: _propTypes.default.bool, /** * The number of milliseconds to wait before showing the tooltip. * This prop won't impact the enter touch delay (`enterTouchDelay`). * @default 100 */ enterDelay: _propTypes.default.number, /** * The number of milliseconds to wait before showing the tooltip when one was already recently opened. * @default 0 */ enterNextDelay: _propTypes.default.number, /** * The number of milliseconds a user must touch the element before showing the tooltip. * @default 700 */ enterTouchDelay: _propTypes.default.number, /** * If `true`, the tooltip follow the cursor over the wrapped element. * @default false */ followCursor: _propTypes.default.bool, /** * This prop is used to help implement the accessibility logic. * If you don't provide this prop. It falls back to a randomly generated id. */ id: _propTypes.default.string, /** * The number of milliseconds to wait before hiding the tooltip. * This prop won't impact the leave touch delay (`leaveTouchDelay`). * @default 0 */ leaveDelay: _propTypes.default.number, /** * The number of milliseconds after the user stops touching an element before hiding the tooltip. * @default 1500 */ leaveTouchDelay: _propTypes.default.number, /** * Callback fired when the component requests to be closed. * * @param {React.SyntheticEvent} event The event source of the callback. */ onClose: _propTypes.default.func, /** * Callback fired when the component requests to be open. * * @param {React.SyntheticEvent} event The event source of the callback. */ onOpen: _propTypes.default.func, /** * If `true`, the component is shown. */ open: _propTypes.default.bool, /** * Tooltip placement. * @default 'bottom' */ placement: _propTypes.default.oneOf(['bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']), /** * The component used for the popper. * @default Popper */ PopperComponent: _propTypes.default.elementType, /** * Props applied to the [`Popper`](/material-ui/api/popper/) element. * @default {} */ PopperProps: _propTypes.default.object, /** * The extra props for the slot components. * You can override the existing props or add new ones. * * This prop is an alias for the `componentsProps` prop, which will be deprecated in the future. * * @default {} */ slotProps: _propTypes.default.shape({ arrow: _propTypes.default.object, popper: _propTypes.default.object, tooltip: _propTypes.default.object, transition: _propTypes.default.object }), /** * The components used for each slot inside. * * This prop is an alias for the `components` prop, which will be deprecated in the future. * * @default {} */ slots: _propTypes.default.shape({ arrow: _propTypes.default.elementType, popper: _propTypes.default.elementType, tooltip: _propTypes.default.elementType, transition: _propTypes.default.elementType }), /** * The system prop that allows defining system overrides as well as additional CSS styles. */ sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]), /** * Tooltip title. Zero-length titles string, undefined, null and false are never displayed. */ title: _propTypes.default.node, /** * The component used for the transition. * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. * @default Grow */ TransitionComponent: _propTypes.default.elementType, /** * Props applied to the transition element. * By default, the element is based on this [`Transition`](https://reactcommunity.org/react-transition-group/transition/) component. */ TransitionProps: _propTypes.default.object } : void 0; var _default = exports.default = Tooltip;