impact-ui 4.0.17-alpha.2 → 5.0.0

package/dist/node_modules/@mui/material/ToggleButtonGroup/ToggleButtonGroup.js

@@ -1,16 +1,19 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from "react";
-import { r as reactIsExports } from "../node_modules/react-is/index.js";
+import { r as reactIsExports } from "../../../react-is/index.js";
 import PropTypes from "../../../prop-types/index.js";
 import { clsx } from "../../../clsx/dist/clsx.js";
 import styled from "../styles/styled.js";
-import useThemeProps from "../styles/useThemeProps.js";
-import isValueSelected from "./isValueSelected.js";
 import toggleButtonGroupClasses, { getToggleButtonGroupUtilityClass } from "./toggleButtonGroupClasses.js";
+import ToggleButtonGroupContext from "./ToggleButtonGroupContext.js";
+import ToggleButtonGroupButtonContext from "./ToggleButtonGroupButtonContext.js";
+import toggleButtonClasses from "../ToggleButton/toggleButtonClasses.js";
 import { jsx } from "react/jsx-runtime";
-import capitalize from "../../utils/capitalize/capitalize.js";
-import composeClasses from "../../utils/composeClasses/composeClasses.js";
+import { useDefaultProps } from "../DefaultPropsProvider/DefaultPropsProvider.js";
+import getValidReactChildren from "../node_modules/@mui/utils/esm/getValidReactChildren/getValidReactChildren.js";
+import capitalize from "../node_modules/@mui/utils/esm/capitalize/capitalize.js";
+import composeClasses from "../node_modules/@mui/utils/esm/composeClasses/composeClasses.js";
 const _excluded = ["children", "className", "color", "disabled", "exclusive", "fullWidth", "onChange", "orientation", "size", "value"];
 const useUtilityClasses = (ownerState) => {
   const {
@@ -21,7 +24,10 @@ const useUtilityClasses = (ownerState) => {
   } = ownerState;
   const slots = {
     root: ["root", orientation === "vertical" && "vertical", fullWidth && "fullWidth"],
-    grouped: ["grouped", `grouped${capitalize(orientation)}`, disabled && "disabled"]
+    grouped: ["grouped", `grouped${capitalize(orientation)}`, disabled && "disabled"],
+    firstButton: ["firstButton"],
+    lastButton: ["lastButton"],
+    middleButton: ["middleButton"]
   };
   return composeClasses(slots, getToggleButtonGroupUtilityClass, classes);
 };
@@ -36,6 +42,12 @@ const ToggleButtonGroupRoot = styled("div", {
       [`& .${toggleButtonGroupClasses.grouped}`]: styles.grouped
     }, {
       [`& .${toggleButtonGroupClasses.grouped}`]: styles[`grouped${capitalize(ownerState.orientation)}`]
+    }, {
+      [`& .${toggleButtonGroupClasses.firstButton}`]: styles.firstButton
+    }, {
+      [`& .${toggleButtonGroupClasses.lastButton}`]: styles.lastButton
+    }, {
+      [`& .${toggleButtonGroupClasses.middleButton}`]: styles.middleButton
     }, styles.root, ownerState.orientation === "vertical" && styles.vertical, ownerState.fullWidth && styles.fullWidth];
   }
 })(({
@@ -50,39 +62,49 @@ const ToggleButtonGroupRoot = styled("div", {
   width: "100%"
 }, {
   [`& .${toggleButtonGroupClasses.grouped}`]: _extends({}, ownerState.orientation === "horizontal" ? {
-    "&:not(:first-of-type)": {
-      marginLeft: -1,
-      borderLeft: "1px solid transparent",
-      borderTopLeftRadius: 0,
-      borderBottomLeftRadius: 0
-    },
-    "&:not(:last-of-type)": {
-      borderTopRightRadius: 0,
-      borderBottomRightRadius: 0
-    },
     [`&.${toggleButtonGroupClasses.selected} + .${toggleButtonGroupClasses.grouped}.${toggleButtonGroupClasses.selected}`]: {
       borderLeft: 0,
       marginLeft: 0
     }
   } : {
-    "&:not(:first-of-type)": {
-      marginTop: -1,
-      borderTop: "1px solid transparent",
-      borderTopLeftRadius: 0,
-      borderTopRightRadius: 0
-    },
-    "&:not(:last-of-type)": {
-      borderBottomLeftRadius: 0,
-      borderBottomRightRadius: 0
-    },
     [`&.${toggleButtonGroupClasses.selected} + .${toggleButtonGroupClasses.grouped}.${toggleButtonGroupClasses.selected}`]: {
       borderTop: 0,
       marginTop: 0
     }
   })
+}, ownerState.orientation === "horizontal" ? {
+  [`& .${toggleButtonGroupClasses.firstButton},& .${toggleButtonGroupClasses.middleButton}`]: {
+    borderTopRightRadius: 0,
+    borderBottomRightRadius: 0
+  },
+  [`& .${toggleButtonGroupClasses.lastButton},& .${toggleButtonGroupClasses.middleButton}`]: {
+    marginLeft: -1,
+    borderLeft: "1px solid transparent",
+    borderTopLeftRadius: 0,
+    borderBottomLeftRadius: 0
+  }
+} : {
+  [`& .${toggleButtonGroupClasses.firstButton},& .${toggleButtonGroupClasses.middleButton}`]: {
+    borderBottomLeftRadius: 0,
+    borderBottomRightRadius: 0
+  },
+  [`& .${toggleButtonGroupClasses.lastButton},& .${toggleButtonGroupClasses.middleButton}`]: {
+    marginTop: -1,
+    borderTop: "1px solid transparent",
+    borderTopLeftRadius: 0,
+    borderTopRightRadius: 0
+  }
+}, ownerState.orientation === "horizontal" ? {
+  [`& .${toggleButtonGroupClasses.lastButton}.${toggleButtonClasses.disabled},& .${toggleButtonGroupClasses.middleButton}.${toggleButtonClasses.disabled}`]: {
+    borderLeft: "1px solid transparent"
+  }
+} : {
+  [`& .${toggleButtonGroupClasses.lastButton}.${toggleButtonClasses.disabled},& .${toggleButtonGroupClasses.middleButton}.${toggleButtonClasses.disabled}`]: {
+    borderTop: "1px solid transparent"
+  }
 }));
 const ToggleButtonGroup = /* @__PURE__ */ React.forwardRef(function ToggleButtonGroup2(inProps, ref) {
-  const props = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: "MuiToggleButtonGroup"
   });
@@ -105,7 +127,7 @@ const ToggleButtonGroup = /* @__PURE__ */ React.forwardRef(function ToggleButton
     size
   });
   const classes = useUtilityClasses(ownerState);
-  const handleChange = (event, buttonValue) => {
+  const handleChange = React.useCallback((event, buttonValue) => {
     if (!onChange) {
       return;
     }
@@ -118,12 +140,37 @@ const ToggleButtonGroup = /* @__PURE__ */ React.forwardRef(function ToggleButton
       newValue = value ? value.concat(buttonValue) : [buttonValue];
     }
     onChange(event, newValue);
-  };
-  const handleExclusiveChange = (event, buttonValue) => {
+  }, [onChange, value]);
+  const handleExclusiveChange = React.useCallback((event, buttonValue) => {
     if (!onChange) {
       return;
     }
     onChange(event, value === buttonValue ? null : buttonValue);
+  }, [onChange, value]);
+  const context = React.useMemo(() => ({
+    className: classes.grouped,
+    onChange: exclusive ? handleExclusiveChange : handleChange,
+    value,
+    size,
+    fullWidth,
+    color,
+    disabled
+  }), [classes.grouped, exclusive, handleExclusiveChange, handleChange, value, size, fullWidth, color, disabled]);
+  const validChildren = getValidReactChildren(children);
+  const childrenCount = validChildren.length;
+  const getButtonPositionClassName = (index) => {
+    const isFirstButton = index === 0;
+    const isLastButton = index === childrenCount - 1;
+    if (isFirstButton && isLastButton) {
+      return "";
+    }
+    if (isFirstButton) {
+      return classes.firstButton;
+    }
+    if (isLastButton) {
+      return classes.lastButton;
+    }
+    return classes.middleButton;
   };
   return /* @__PURE__ */ jsx(ToggleButtonGroupRoot, _extends({
     role: "group",
@@ -131,32 +178,27 @@ const ToggleButtonGroup = /* @__PURE__ */ React.forwardRef(function ToggleButton
     ref,
     ownerState
   }, other, {
-    children: React.Children.map(children, (child) => {
-      if (!/* @__PURE__ */ React.isValidElement(child)) {
-        return null;
-      }
-      if (process.env.NODE_ENV !== "production") {
-        if (reactIsExports.isFragment(child)) {
-          console.error(["MUI: The ToggleButtonGroup component doesn't accept a Fragment as a child.", "Consider providing an array instead."].join("\n"));
+    children: /* @__PURE__ */ jsx(ToggleButtonGroupContext.Provider, {
+      value: context,
+      children: validChildren.map((child, index) => {
+        if (process.env.NODE_ENV !== "production") {
+          if (reactIsExports.isFragment(child)) {
+            console.error(["MUI: The ToggleButtonGroup component doesn't accept a Fragment as a child.", "Consider providing an array instead."].join("\n"));
+          }
         }
-      }
-      return /* @__PURE__ */ React.cloneElement(child, {
-        className: clsx(classes.grouped, child.props.className),
-        onChange: exclusive ? handleExclusiveChange : handleChange,
-        selected: child.props.selected === void 0 ? isValueSelected(child.props.value, value) : child.props.selected,
-        size: child.props.size || size,
-        fullWidth,
-        color: child.props.color || color,
-        disabled: child.props.disabled || disabled
-      });
+        return /* @__PURE__ */ jsx(ToggleButtonGroupButtonContext.Provider, {
+          value: getButtonPositionClassName(index),
+          children: child
+        }, index);
+      })
     })
   }));
 });
 process.env.NODE_ENV !== "production" ? ToggleButtonGroup.propTypes = {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // |     To update them edit the d.ts file and run "yarn proptypes"     |
-  // ----------------------------------------------------------------------
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
   /**
    * The content of the component.
    */
@@ -172,7 +214,7 @@ process.env.NODE_ENV !== "production" ? ToggleButtonGroup.propTypes = {
   /**
    * The color of the button when it is selected.
    * It supports both default and custom theme colors, which can be added as shown in the
-   * [palette customization guide](https://mui.com/material-ui/customization/palette/#adding-new-colors).
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
    * @default 'standard'
    */
   color: PropTypes.oneOfType([PropTypes.oneOf(["standard", "primary", "secondary", "error", "info", "success", "warning"]), PropTypes.string]),

package/dist/node_modules/@mui/material/ToggleButtonGroup/ToggleButtonGroupButtonContext.js

@@ -0,0 +1,8 @@
+import * as React from "react";
+const ToggleButtonGroupButtonContext = /* @__PURE__ */ React.createContext(void 0);
+if (process.env.NODE_ENV !== "production") {
+  ToggleButtonGroupButtonContext.displayName = "ToggleButtonGroupButtonContext";
+}
+export {
+  ToggleButtonGroupButtonContext as default
+};

package/dist/node_modules/@mui/material/ToggleButtonGroup/ToggleButtonGroupContext.js

@@ -0,0 +1,8 @@
+import * as React from "react";
+const ToggleButtonGroupContext = /* @__PURE__ */ React.createContext({});
+if (process.env.NODE_ENV !== "production") {
+  ToggleButtonGroupContext.displayName = "ToggleButtonGroupContext";
+}
+export {
+  ToggleButtonGroupContext as default
+};

package/dist/node_modules/@mui/material/ToggleButtonGroup/toggleButtonGroupClasses.js

@@ -1,9 +1,9 @@
-import generateUtilityClass from "../../utils/generateUtilityClass/generateUtilityClass.js";
-import generateUtilityClasses from "../../utils/generateUtilityClasses/generateUtilityClasses.js";
+import generateUtilityClass from "../node_modules/@mui/utils/esm/generateUtilityClass/generateUtilityClass.js";
+import generateUtilityClasses from "../node_modules/@mui/utils/esm/generateUtilityClasses/generateUtilityClasses.js";
 function getToggleButtonGroupUtilityClass(slot) {
   return generateUtilityClass("MuiToggleButtonGroup", slot);
 }
-const toggleButtonGroupClasses = generateUtilityClasses("MuiToggleButtonGroup", ["root", "selected", "vertical", "disabled", "grouped", "groupedHorizontal", "groupedVertical"]);
+const toggleButtonGroupClasses = generateUtilityClasses("MuiToggleButtonGroup", ["root", "selected", "horizontal", "vertical", "disabled", "grouped", "groupedHorizontal", "groupedVertical", "fullWidth", "firstButton", "lastButton", "middleButton"]);
 export {
   toggleButtonGroupClasses as default,
   getToggleButtonGroupUtilityClass

package/dist/node_modules/@mui/material/Tooltip/Tooltip.js

@@ -3,23 +3,26 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from "react";
 import PropTypes from "../../../prop-types/index.js";
 import { clsx } from "../../../clsx/dist/clsx.js";
-import styled from "../styles/styled.js";
-import useTheme from "../styles/useTheme.js";
-import useThemeProps from "../styles/useThemeProps.js";
+import { alpha as alpha_1 } from "../../system/colorManipulator.js";
+import { useRtl } from "../../system/esm/RtlProvider/index.js";
 import tooltipClasses, { getTooltipUtilityClass } from "./tooltipClasses.js";
 import { jsxs, jsx } from "react/jsx-runtime";
+import { useDefaultProps } from "../DefaultPropsProvider/DefaultPropsProvider.js";
 import Grow from "../Grow/Grow.js";
-import useControlled from "../../utils/useControlled/useControlled.js";
-import useId from "../../utils/useId/useId.js";
-import useEventCallback from "../../utils/useEventCallback/useEventCallback.js";
-import useIsFocusVisible from "../../utils/useIsFocusVisible/useIsFocusVisible.js";
-import useForkRef from "../../utils/useForkRef/useForkRef.js";
-import { appendOwnerState } from "../node_modules/@mui/base/utils/appendOwnerState.js";
+import useTheme from "../styles/useTheme.js";
+import useTimeout, { Timeout } from "../node_modules/@mui/utils/esm/useTimeout/useTimeout.js";
+import useControlled from "../node_modules/@mui/utils/esm/useControlled/useControlled.js";
+import useId from "../node_modules/@mui/utils/esm/useId/useId.js";
+import useEventCallback from "../node_modules/@mui/utils/esm/useEventCallback/useEventCallback.js";
+import useIsFocusVisible from "../node_modules/@mui/utils/esm/useIsFocusVisible/useIsFocusVisible.js";
+import useForkRef from "../node_modules/@mui/utils/esm/useForkRef/useForkRef.js";
+import getReactElementRef from "../node_modules/@mui/utils/esm/getReactElementRef/getReactElementRef.js";
+import appendOwnerState from "../node_modules/@mui/utils/esm/appendOwnerState/appendOwnerState.js";
 import Popper from "../Popper/Popper.js";
-import capitalize from "../../utils/capitalize/capitalize.js";
-import composeClasses from "../../utils/composeClasses/composeClasses.js";
-import { alpha } from "../../system/esm/colorManipulator.js";
-import elementAcceptingRef from "../../utils/elementAcceptingRef/elementAcceptingRef.js";
+import capitalize from "../node_modules/@mui/utils/esm/capitalize/capitalize.js";
+import composeClasses from "../node_modules/@mui/utils/esm/composeClasses/composeClasses.js";
+import styled from "../styles/styled.js";
+import elementAcceptingRef from "../node_modules/@mui/utils/esm/elementAcceptingRef/elementAcceptingRef.js";
 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 round(value) {
   return Math.round(value * 1e5) / 1e5;
@@ -114,7 +117,7 @@ const TooltipTooltip = styled("div", {
   theme,
   ownerState
 }) => _extends({
-  backgroundColor: theme.vars ? theme.vars.palette.Tooltip.bg : alpha(theme.palette.grey[700], 0.92),
+  backgroundColor: theme.vars ? theme.vars.palette.Tooltip.bg : alpha_1(theme.palette.grey[700], 0.92),
   borderRadius: (theme.vars || theme).shape.borderRadius,
   color: (theme.vars || theme).palette.common.white,
   fontFamily: theme.typography.fontFamily,
@@ -180,7 +183,7 @@ const TooltipArrow = styled("span", {
   width: "1em",
   height: "0.71em",
   boxSizing: "border-box",
-  color: theme.vars ? theme.vars.palette.Tooltip.bg : alpha(theme.palette.grey[700], 0.9),
+  color: theme.vars ? theme.vars.palette.Tooltip.bg : alpha_1(theme.palette.grey[700], 0.9),
   "&::before": {
     content: '""',
     margin: "auto",
@@ -192,22 +195,22 @@ const TooltipArrow = styled("span", {
   }
 }));
 let hystersisOpen = false;
-let hystersisTimer = null;
+const hystersisTimer = new Timeout();
 let cursorPosition = {
   x: 0,
   y: 0
 };
 function composeEventHandler(handler, eventHandler) {
-  return (event) => {
+  return (event, ...params) => {
     if (eventHandler) {
-      eventHandler(event);
+      eventHandler(event, ...params);
     }
-    handler(event);
+    handler(event, ...params);
   };
 }
 const Tooltip = /* @__PURE__ */ React.forwardRef(function Tooltip2(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 = useThemeProps({
+  const props = useDefaultProps({
     props: inProps,
     name: "MuiTooltip"
   });
@@ -244,15 +247,15 @@ const Tooltip = /* @__PURE__ */ React.forwardRef(function Tooltip2(inProps, ref)
     children: childrenProp
   });
   const theme = useTheme();
-  const isRtl = theme.direction === "rtl";
+  const isRtl = useRtl();
   const [childNode, setChildNode] = React.useState();
   const [arrowRef, setArrowRef] = React.useState(null);
   const ignoreNonTouchEvents = React.useRef(false);
   const disableInteractive = disableInteractiveProp || followCursor;
-  const closeTimer = React.useRef();
-  const enterTimer = React.useRef();
-  const leaveTimer = React.useRef();
-  const touchTimer = React.useRef();
+  const closeTimer = useTimeout();
+  const enterTimer = useTimeout();
+  const leaveTimer = useTimeout();
+  const touchTimer = useTimeout();
   const [openState, setOpenState] = useControlled({
     controlled: openProp,
     default: false,
@@ -272,23 +275,16 @@ const Tooltip = /* @__PURE__ */ React.forwardRef(function Tooltip2(inProps, ref)
   }
   const id = useId(idProp);
   const prevUserSelect = React.useRef();
-  const stopTouchInteraction = React.useCallback(() => {
+  const stopTouchInteraction = useEventCallback(() => {
     if (prevUserSelect.current !== void 0) {
       document.body.style.WebkitUserSelect = prevUserSelect.current;
       prevUserSelect.current = void 0;
     }
-    clearTimeout(touchTimer.current);
-  }, []);
-  React.useEffect(() => {
-    return () => {
-      clearTimeout(closeTimer.current);
-      clearTimeout(enterTimer.current);
-      clearTimeout(leaveTimer.current);
-      stopTouchInteraction();
-    };
-  }, [stopTouchInteraction]);
+    touchTimer.clear();
+  });
+  React.useEffect(() => stopTouchInteraction, [stopTouchInteraction]);
   const handleOpen = (event) => {
-    clearTimeout(hystersisTimer);
+    hystersisTimer.clear();
     hystersisOpen = true;
     setOpenState(true);
     if (onOpen && !open) {
@@ -300,43 +296,40 @@ const Tooltip = /* @__PURE__ */ React.forwardRef(function Tooltip2(inProps, ref)
      * @param {React.SyntheticEvent | Event} event
      */
     (event) => {
-      clearTimeout(hystersisTimer);
-      hystersisTimer = setTimeout(() => {
+      hystersisTimer.start(800 + leaveDelay, () => {
         hystersisOpen = false;
-      }, 800 + leaveDelay);
+      });
       setOpenState(false);
       if (onClose && open) {
         onClose(event);
       }
-      clearTimeout(closeTimer.current);
-      closeTimer.current = setTimeout(() => {
+      closeTimer.start(theme.transitions.duration.shortest, () => {
         ignoreNonTouchEvents.current = false;
-      }, theme.transitions.duration.shortest);
+      });
     }
   );
-  const handleEnter = (event) => {
+  const handleMouseOver = (event) => {
     if (ignoreNonTouchEvents.current && event.type !== "touchstart") {
       return;
     }
     if (childNode) {
       childNode.removeAttribute("title");
     }
-    clearTimeout(enterTimer.current);
-    clearTimeout(leaveTimer.current);
+    enterTimer.clear();
+    leaveTimer.clear();
     if (enterDelay || hystersisOpen && enterNextDelay) {
-      enterTimer.current = setTimeout(() => {
+      enterTimer.start(hystersisOpen ? enterNextDelay : enterDelay, () => {
         handleOpen(event);
-      }, hystersisOpen ? enterNextDelay : enterDelay);
+      });
     } else {
       handleOpen(event);
     }
   };
-  const handleLeave = (event) => {
-    clearTimeout(enterTimer.current);
-    clearTimeout(leaveTimer.current);
-    leaveTimer.current = setTimeout(() => {
+  const handleMouseLeave = (event) => {
+    enterTimer.clear();
+    leaveTimer.start(leaveDelay, () => {
       handleClose(event);
-    }, leaveDelay);
+    });
   };
   const {
     isFocusVisibleRef,
@@ -349,7 +342,7 @@ const Tooltip = /* @__PURE__ */ React.forwardRef(function Tooltip2(inProps, ref)
     handleBlurVisible(event);
     if (isFocusVisibleRef.current === false) {
       setChildIsFocusVisible(false);
-      handleLeave(event);
+      handleMouseLeave(event);
     }
   };
   const handleFocus = (event) => {
@@ -359,7 +352,7 @@ const Tooltip = /* @__PURE__ */ React.forwardRef(function Tooltip2(inProps, ref)
     handleFocusVisible(event);
     if (isFocusVisibleRef.current === true) {
       setChildIsFocusVisible(true);
-      handleEnter(event);
+      handleMouseOver(event);
     }
   };
   const detectTouchStart = (event) => {
@@ -369,29 +362,26 @@ const Tooltip = /* @__PURE__ */ React.forwardRef(function Tooltip2(inProps, ref)
       childrenProps2.onTouchStart(event);
     }
   };
-  const handleMouseOver = handleEnter;
-  const handleMouseLeave = handleLeave;
   const handleTouchStart = (event) => {
     detectTouchStart(event);
-    clearTimeout(leaveTimer.current);
-    clearTimeout(closeTimer.current);
+    leaveTimer.clear();
+    closeTimer.clear();
     stopTouchInteraction();
     prevUserSelect.current = document.body.style.WebkitUserSelect;
     document.body.style.WebkitUserSelect = "none";
-    touchTimer.current = setTimeout(() => {
+    touchTimer.start(enterTouchDelay, () => {
       document.body.style.WebkitUserSelect = prevUserSelect.current;
-      handleEnter(event);
-    }, enterTouchDelay);
+      handleMouseOver(event);
+    });
   };
   const handleTouchEnd = (event) => {
     if (children.props.onTouchEnd) {
       children.props.onTouchEnd(event);
     }
     stopTouchInteraction();
-    clearTimeout(leaveTimer.current);
-    leaveTimer.current = setTimeout(() => {
+    leaveTimer.start(leaveTouchDelay, () => {
       handleClose(event);
-    }, leaveTouchDelay);
+    });
   };
   React.useEffect(() => {
     if (!open) {
@@ -407,7 +397,7 @@ const Tooltip = /* @__PURE__ */ React.forwardRef(function Tooltip2(inProps, ref)
       document.removeEventListener("keydown", handleKeyDown);
     };
   }, [handleClose, open]);
-  const handleRef = useForkRef(children.ref, focusVisibleRef, setChildNode, ref);
+  const handleRef = useForkRef(getReactElementRef(children), focusVisibleRef, setChildNode, ref);
   if (!title && title !== 0) {
     open = false;
   }
@@ -550,10 +540,10 @@ const Tooltip = /* @__PURE__ */ React.forwardRef(function Tooltip2(inProps, ref)
   });
 });
 process.env.NODE_ENV !== "production" ? Tooltip.propTypes = {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // |     To update them edit the d.ts file and run "yarn 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
@@ -738,7 +728,7 @@ process.env.NODE_ENV !== "production" ? Tooltip.propTypes = {
   TransitionComponent: PropTypes.elementType,
   /**
    * Props applied to the transition element.
-   * By default, the element is based on this [`Transition`](http://reactcommunity.org/react-transition-group/transition/) component.
+   * By default, the element is based on this [`Transition`](https://reactcommunity.org/react-transition-group/transition/) component.
    */
   TransitionProps: PropTypes.object
 } : void 0;

package/dist/node_modules/@mui/material/Tooltip/tooltipClasses.js

@@ -1,5 +1,5 @@
-import generateUtilityClass from "../../utils/generateUtilityClass/generateUtilityClass.js";
-import generateUtilityClasses from "../../utils/generateUtilityClasses/generateUtilityClasses.js";
+import generateUtilityClass from "../node_modules/@mui/utils/esm/generateUtilityClass/generateUtilityClass.js";
+import generateUtilityClasses from "../node_modules/@mui/utils/esm/generateUtilityClasses/generateUtilityClasses.js";
 function getTooltipUtilityClass(slot) {
   return generateUtilityClass("MuiTooltip", slot);
 }

package/dist/node_modules/@mui/material/Typography/Typography.js

@@ -4,12 +4,12 @@ import * as React from "react";
 import PropTypes from "../../../prop-types/index.js";
 import { clsx } from "../../../clsx/dist/clsx.js";
 import styled from "../styles/styled.js";
-import useThemeProps from "../styles/useThemeProps.js";
 import { getTypographyUtilityClass } from "./typographyClasses.js";
 import { jsx } from "react/jsx-runtime";
+import { useDefaultProps } from "../DefaultPropsProvider/DefaultPropsProvider.js";
 import extendSxProp from "../../system/esm/styleFunctionSx/extendSxProp.js";
-import capitalize from "../../utils/capitalize/capitalize.js";
-import composeClasses from "../../utils/composeClasses/composeClasses.js";
+import capitalize from "../node_modules/@mui/utils/esm/capitalize/capitalize.js";
+import composeClasses from "../node_modules/@mui/utils/esm/composeClasses/composeClasses.js";
 const _excluded = ["align", "className", "component", "gutterBottom", "noWrap", "paragraph", "variant", "variantMapping"];
 const useUtilityClasses = (ownerState) => {
   const {
@@ -77,7 +77,7 @@ const transformDeprecatedColors = (color) => {
   return colorTransformations[color] || color;
 };
 const Typography = /* @__PURE__ */ React.forwardRef(function Typography2(inProps, ref) {
-  const themeProps = useThemeProps({
+  const themeProps = useDefaultProps({
     props: inProps,
     name: "MuiTypography"
   });
@@ -116,10 +116,10 @@ const Typography = /* @__PURE__ */ React.forwardRef(function Typography2(inProps
   }, other));
 });
 process.env.NODE_ENV !== "production" ? Typography.propTypes = {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // |     To update them edit the d.ts file and run "yarn proptypes"     |
-  // ----------------------------------------------------------------------
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
   /**
    * Set the text-align on the component.
    * @default 'inherit'

package/dist/node_modules/@mui/material/Typography/typographyClasses.js

@@ -1,5 +1,5 @@
-import generateUtilityClass from "../../utils/generateUtilityClass/generateUtilityClass.js";
-import generateUtilityClasses from "../../utils/generateUtilityClasses/generateUtilityClasses.js";
+import generateUtilityClass from "../node_modules/@mui/utils/esm/generateUtilityClass/generateUtilityClass.js";
+import generateUtilityClasses from "../node_modules/@mui/utils/esm/generateUtilityClasses/generateUtilityClasses.js";
 function getTypographyUtilityClass(slot) {
   return generateUtilityClass("MuiTypography", slot);
 }