@tw1934/mui-material 7.3.7 → 7.3.8

package/ClickAwayListener/ClickAwayListener.d.ts

@@ -2,43 +2,11 @@ import * as React from 'react';
 type ClickAwayMouseEventHandler = 'onClick' | 'onMouseDown' | 'onMouseUp' | 'onPointerDown' | 'onPointerUp';
 type ClickAwayTouchEventHandler = 'onTouchStart' | 'onTouchEnd';
 export interface ClickAwayListenerProps {
-  /**
-   * The wrapped element.
-   */
   children: React.ReactElement<any>;
-  /**
-   * If `true`, the React tree is ignored and only the DOM tree is considered.
-   * This prop changes how portaled elements are handled.
-   * @default false
-   */
   disableReactTree?: boolean;
-  /**
-   * The mouse event to listen to. You can disable the listener by providing `false`.
-   * @default 'onClick'
-   */
   mouseEvent?: ClickAwayMouseEventHandler | false;
-  /**
-   * Callback fired when a "click away" event is detected.
-   */
   onClickAway: (event: MouseEvent | TouchEvent) => void;
-  /**
-   * The touch event to listen to. You can disable the listener by providing `false`.
-   * @default 'onTouchEnd'
-   */
   touchEvent?: ClickAwayTouchEventHandler | false;
 }
-/**
- * Listen for click events that occur somewhere in the document, outside of the element itself.
- * For instance, if you need to hide a menu when people click anywhere else on your page.
- *
- * Demos:
- *
- * - [Click-Away Listener](https://mui.com/material-ui/react-click-away-listener/)
- * - [Menu](https://mui.com/material-ui/react-menu/)
- *
- * API:
- *
- * - [ClickAwayListener API](https://mui.com/material-ui/api/click-away-listener/)
- */
 declare function ClickAwayListener(props: ClickAwayListenerProps): React.JSX.Element;
 export { ClickAwayListener };

package/ClickAwayListener/ClickAwayListener.js

@@ -12,26 +12,12 @@ var _ownerDocument = _interopRequireDefault(require("@mui/utils/ownerDocument"))
 var _useForkRef = _interopRequireDefault(require("@mui/utils/useForkRef"));
 var _useEventCallback = _interopRequireDefault(require("@mui/utils/useEventCallback"));
 var _getReactElementRef = _interopRequireDefault(require("@mui/utils/getReactElementRef"));
-// TODO: return `EventHandlerName extends `on${infer EventName}` ? Lowercase<EventName> : never` once generatePropTypes runs with TS 4.1
 function mapEventPropToEvent(eventProp) {
   return eventProp.substring(2).toLowerCase();
 }
 function clickedRootScrollbar(event, doc) {
   return doc.documentElement.clientWidth < event.clientX || doc.documentElement.clientHeight < event.clientY;
 }
-/**
- * Listen for click events that occur somewhere in the document, outside of the element itself.
- * For instance, if you need to hide a menu when people click anywhere else on your page.
- *
- * Demos:
- *
- * - [Click-Away Listener](https://mui.com/material-ui/react-click-away-listener/)
- * - [Menu](https://mui.com/material-ui/react-menu/)
- *
- * API:
- *
- * - [ClickAwayListener API](https://mui.com/material-ui/api/click-away-listener/)
- */
 function ClickAwayListener(props) {
   const {
     children,
@@ -45,8 +31,6 @@ function ClickAwayListener(props) {
   const activatedRef = React.useRef(false);
   const syntheticEventRef = React.useRef(false);
   React.useEffect(() => {
-    // Ensure that this component is not "activated" synchronously.
-    // https://github.com/facebook/react/issues/20074
     setTimeout(() => {
       activatedRef.current = true;
     }, 0);
@@ -55,55 +39,32 @@ function ClickAwayListener(props) {
     };
   }, []);
   const handleRef = (0, _useForkRef.default)((0, _getReactElementRef.default)(children), nodeRef);
-
-  // The handler doesn't take event.defaultPrevented into account:
-  //
-  // event.preventDefault() is meant to stop default behaviors like
-  // clicking a checkbox to check it, hitting a button to submit a form,
-  // and hitting left arrow to move the cursor in a text input etc.
-  // Only special HTML elements have these default behaviors.
   const handleClickAway = (0, _useEventCallback.default)(event => {
-    // Given developers can stop the propagation of the synthetic event,
-    // we can only be confident with a positive value.
     const insideReactTree = syntheticEventRef.current;
     syntheticEventRef.current = false;
     const doc = (0, _ownerDocument.default)(nodeRef.current);
-
-    // 1. IE11 support, which trigger the handleClickAway even after the unbind
-    // 2. The child might render null.
-    // 3. Behave like a blur listener.
     if (!activatedRef.current || !nodeRef.current || 'clientX' in event && clickedRootScrollbar(event, doc)) {
       return;
     }
-
-    // Do not act if user performed touchmove
     if (movedRef.current) {
       movedRef.current = false;
       return;
     }
     let insideDOM;
-
-    // If not enough, can use https://github.com/DieterHolvoet/event-propagation-path/blob/master/propagationPath.js
     if (event.composedPath) {
       insideDOM = event.composedPath().includes(nodeRef.current);
     } else {
-      insideDOM = !doc.documentElement.contains(
-      // @ts-expect-error returns `false` as intended when not dispatched from a Node
-      event.target) || nodeRef.current.contains(
-      // @ts-expect-error returns `false` as intended when not dispatched from a Node
-      event.target);
+      insideDOM = !doc.documentElement.contains(event.target) || nodeRef.current.contains(event.target);
     }
     if (!insideDOM && (disableReactTree || !insideReactTree)) {
       onClickAway(event);
     }
   });
-
-  // Keep track of mouse/touch events that bubbled up through the portal.
   const createHandleSynthetic = handlerName => event => {
     syntheticEventRef.current = true;
-    const childrenPropsHandler = children.props[handlerName];
-    if (childrenPropsHandler) {
-      childrenPropsHandler(event);
+    const handler = children.props[handlerName];
+    if (handler) {
+      handler(event);
     }
   };
   const childrenProps = {
@@ -114,15 +75,15 @@ function ClickAwayListener(props) {
   }
   React.useEffect(() => {
     if (touchEvent !== false) {
-      const mappedTouchEvent = mapEventPropToEvent(touchEvent);
+      const mapped = mapEventPropToEvent(touchEvent);
       const doc = (0, _ownerDocument.default)(nodeRef.current);
       const handleTouchMove = () => {
         movedRef.current = true;
       };
-      doc.addEventListener(mappedTouchEvent, handleClickAway);
+      doc.addEventListener(mapped, handleClickAway);
       doc.addEventListener('touchmove', handleTouchMove);
       return () => {
-        doc.removeEventListener(mappedTouchEvent, handleClickAway);
+        doc.removeEventListener(mapped, handleClickAway);
         doc.removeEventListener('touchmove', handleTouchMove);
       };
     }
@@ -133,11 +94,11 @@ function ClickAwayListener(props) {
   }
   React.useEffect(() => {
     if (mouseEvent !== false) {
-      const mappedMouseEvent = mapEventPropToEvent(mouseEvent);
+      const mapped = mapEventPropToEvent(mouseEvent);
       const doc = (0, _ownerDocument.default)(nodeRef.current);
-      doc.addEventListener(mappedMouseEvent, handleClickAway);
+      doc.addEventListener(mapped, handleClickAway);
       return () => {
-        doc.removeEventListener(mappedMouseEvent, handleClickAway);
+        doc.removeEventListener(mapped, handleClickAway);
       };
     }
     return undefined;

package/Slider/SliderValueLabel.d.ts

@@ -5,5 +5,5 @@ import { SliderValueLabelProps } from "./SliderValueLabel.types.js";
  */
 export default function SliderValueLabel(props: SliderValueLabelProps): React.ReactElement<{
   className?: string;
-  children?: React.ReactNode;
+  children?: import("react").ReactNode;
 }, string | React.JSXElementConstructor<any>> | null;

package/TextField/TextField.d.ts

@@ -72,7 +72,7 @@ export type TextFieldSlotsAndSlotProps<InputPropsType> = CreateSlotsAndSlotProps
    * Props forwarded to the html input slot.
    * By default, the available props are based on the html input element.
    */
-  htmlInput: SlotProps<React.ElementType<InputBaseProps['inputProps']>, {}, TextFieldOwnerState>;
+  htmlInput: SlotProps<React.ElementType<InputBaseProps>, {}, TextFieldOwnerState>;
   /**
    * Props forwarded to the form helper text slot.
    * By default, the available props are based on the [FormHelperText](https://mui.com/material-ui/api/form-helper-text/#props) component.

package/esm/ClickAwayListener/ClickAwayListener.d.ts

@@ -2,43 +2,11 @@ import * as React from 'react';
 type ClickAwayMouseEventHandler = 'onClick' | 'onMouseDown' | 'onMouseUp' | 'onPointerDown' | 'onPointerUp';
 type ClickAwayTouchEventHandler = 'onTouchStart' | 'onTouchEnd';
 export interface ClickAwayListenerProps {
-  /**
-   * The wrapped element.
-   */
   children: React.ReactElement<any>;
-  /**
-   * If `true`, the React tree is ignored and only the DOM tree is considered.
-   * This prop changes how portaled elements are handled.
-   * @default false
-   */
   disableReactTree?: boolean;
-  /**
-   * The mouse event to listen to. You can disable the listener by providing `false`.
-   * @default 'onClick'
-   */
   mouseEvent?: ClickAwayMouseEventHandler | false;
-  /**
-   * Callback fired when a "click away" event is detected.
-   */
   onClickAway: (event: MouseEvent | TouchEvent) => void;
-  /**
-   * The touch event to listen to. You can disable the listener by providing `false`.
-   * @default 'onTouchEnd'
-   */
   touchEvent?: ClickAwayTouchEventHandler | false;
 }
-/**
- * Listen for click events that occur somewhere in the document, outside of the element itself.
- * For instance, if you need to hide a menu when people click anywhere else on your page.
- *
- * Demos:
- *
- * - [Click-Away Listener](https://mui.com/material-ui/react-click-away-listener/)
- * - [Menu](https://mui.com/material-ui/react-menu/)
- *
- * API:
- *
- * - [ClickAwayListener API](https://mui.com/material-ui/api/click-away-listener/)
- */
 declare function ClickAwayListener(props: ClickAwayListenerProps): React.JSX.Element;
 export { ClickAwayListener };

package/esm/ClickAwayListener/ClickAwayListener.js

@@ -5,27 +5,12 @@ import ownerDocument from '@mui/utils/ownerDocument';
 import useForkRef from '@mui/utils/useForkRef';
 import useEventCallback from '@mui/utils/useEventCallback';
 import getReactElementRef from '@mui/utils/getReactElementRef';
-
-// TODO: return `EventHandlerName extends `on${infer EventName}` ? Lowercase<EventName> : never` once generatePropTypes runs with TS 4.1
 function mapEventPropToEvent(eventProp) {
   return eventProp.substring(2).toLowerCase();
 }
 function clickedRootScrollbar(event, doc) {
   return doc.documentElement.clientWidth < event.clientX || doc.documentElement.clientHeight < event.clientY;
 }
-/**
- * Listen for click events that occur somewhere in the document, outside of the element itself.
- * For instance, if you need to hide a menu when people click anywhere else on your page.
- *
- * Demos:
- *
- * - [Click-Away Listener](https://mui.com/material-ui/react-click-away-listener/)
- * - [Menu](https://mui.com/material-ui/react-menu/)
- *
- * API:
- *
- * - [ClickAwayListener API](https://mui.com/material-ui/api/click-away-listener/)
- */
 function ClickAwayListener(props) {
   const {
     children,
@@ -39,8 +24,6 @@ function ClickAwayListener(props) {
   const activatedRef = React.useRef(false);
   const syntheticEventRef = React.useRef(false);
   React.useEffect(() => {
-    // Ensure that this component is not "activated" synchronously.
-    // https://github.com/facebook/react/issues/20074
     setTimeout(() => {
       activatedRef.current = true;
     }, 0);
@@ -49,55 +32,32 @@ function ClickAwayListener(props) {
     };
   }, []);
   const handleRef = useForkRef(getReactElementRef(children), nodeRef);
-
-  // The handler doesn't take event.defaultPrevented into account:
-  //
-  // event.preventDefault() is meant to stop default behaviors like
-  // clicking a checkbox to check it, hitting a button to submit a form,
-  // and hitting left arrow to move the cursor in a text input etc.
-  // Only special HTML elements have these default behaviors.
   const handleClickAway = useEventCallback(event => {
-    // Given developers can stop the propagation of the synthetic event,
-    // we can only be confident with a positive value.
     const insideReactTree = syntheticEventRef.current;
     syntheticEventRef.current = false;
     const doc = ownerDocument(nodeRef.current);
-
-    // 1. IE11 support, which trigger the handleClickAway even after the unbind
-    // 2. The child might render null.
-    // 3. Behave like a blur listener.
     if (!activatedRef.current || !nodeRef.current || 'clientX' in event && clickedRootScrollbar(event, doc)) {
       return;
     }
-
-    // Do not act if user performed touchmove
     if (movedRef.current) {
       movedRef.current = false;
       return;
     }
     let insideDOM;
-
-    // If not enough, can use https://github.com/DieterHolvoet/event-propagation-path/blob/master/propagationPath.js
     if (event.composedPath) {
       insideDOM = event.composedPath().includes(nodeRef.current);
     } else {
-      insideDOM = !doc.documentElement.contains(
-      // @ts-expect-error returns `false` as intended when not dispatched from a Node
-      event.target) || nodeRef.current.contains(
-      // @ts-expect-error returns `false` as intended when not dispatched from a Node
-      event.target);
+      insideDOM = !doc.documentElement.contains(event.target) || nodeRef.current.contains(event.target);
     }
     if (!insideDOM && (disableReactTree || !insideReactTree)) {
       onClickAway(event);
     }
   });
-
-  // Keep track of mouse/touch events that bubbled up through the portal.
   const createHandleSynthetic = handlerName => event => {
     syntheticEventRef.current = true;
-    const childrenPropsHandler = children.props[handlerName];
-    if (childrenPropsHandler) {
-      childrenPropsHandler(event);
+    const handler = children.props[handlerName];
+    if (handler) {
+      handler(event);
     }
   };
   const childrenProps = {
@@ -108,15 +68,15 @@ function ClickAwayListener(props) {
   }
   React.useEffect(() => {
     if (touchEvent !== false) {
-      const mappedTouchEvent = mapEventPropToEvent(touchEvent);
+      const mapped = mapEventPropToEvent(touchEvent);
       const doc = ownerDocument(nodeRef.current);
       const handleTouchMove = () => {
         movedRef.current = true;
       };
-      doc.addEventListener(mappedTouchEvent, handleClickAway);
+      doc.addEventListener(mapped, handleClickAway);
       doc.addEventListener('touchmove', handleTouchMove);
       return () => {
-        doc.removeEventListener(mappedTouchEvent, handleClickAway);
+        doc.removeEventListener(mapped, handleClickAway);
         doc.removeEventListener('touchmove', handleTouchMove);
       };
     }
@@ -127,11 +87,11 @@ function ClickAwayListener(props) {
   }
   React.useEffect(() => {
     if (mouseEvent !== false) {
-      const mappedMouseEvent = mapEventPropToEvent(mouseEvent);
+      const mapped = mapEventPropToEvent(mouseEvent);
       const doc = ownerDocument(nodeRef.current);
-      doc.addEventListener(mappedMouseEvent, handleClickAway);
+      doc.addEventListener(mapped, handleClickAway);
       return () => {
-        doc.removeEventListener(mappedMouseEvent, handleClickAway);
+        doc.removeEventListener(mapped, handleClickAway);
       };
     }
     return undefined;

package/esm/Slider/SliderValueLabel.d.ts

@@ -5,5 +5,5 @@ import { SliderValueLabelProps } from "./SliderValueLabel.types.js";
  */
 export default function SliderValueLabel(props: SliderValueLabelProps): React.ReactElement<{
   className?: string;
-  children?: React.ReactNode;
+  children?: import("react").ReactNode;
 }, string | React.JSXElementConstructor<any>> | null;

package/esm/TextField/TextField.d.ts

@@ -72,7 +72,7 @@ export type TextFieldSlotsAndSlotProps<InputPropsType> = CreateSlotsAndSlotProps
    * Props forwarded to the html input slot.
    * By default, the available props are based on the html input element.
    */
-  htmlInput: SlotProps<React.ElementType<InputBaseProps['inputProps']>, {}, TextFieldOwnerState>;
+  htmlInput: SlotProps<React.ElementType<InputBaseProps>, {}, TextFieldOwnerState>;
   /**
    * Props forwarded to the form helper text slot.
    * By default, the available props are based on the [FormHelperText](https://mui.com/material-ui/api/form-helper-text/#props) component.

package/esm/index.js

@@ -1,5 +1,5 @@
 /**
- * @tw1934/mui-material v7.3.7
+ * @tw1934/mui-material v7.3.8
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/esm/utils/useSlot.js

@@ -60,6 +60,7 @@ name, parameters) {
     className,
     ...useSlotPropsParams,
     externalForwardedProps: name === 'root' ? other : undefined,
+    // @ts-ignore
     externalSlotProps: resolvedComponentsProps
   });
   const ref = useForkRef(internalRef, resolvedComponentsProps?.ref, parameters.ref);

package/esm/version/index.js

@@ -1,6 +1,6 @@
-export const version = "7.3.7";
+export const version = "7.3.8";
 export const major = Number("7");
 export const minor = Number("3");
-export const patch = Number("7");
+export const patch = Number("8");
 export const prerelease = undefined;
 export default version;

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @tw1934/mui-material v7.3.7
+ * @tw1934/mui-material v7.3.8
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tw1934/mui-material",
-  "version": "7.3.7",
+  "version": "7.3.8",
   "author": "MUI Team",
   "description": "Material UI is an open-source React component library that implements Google's Material Design. It's comprehensive and can be used in production out of the box.",
   "keywords": [
@@ -26,24 +26,24 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.28.6",
-    "@mui/utils": "@tw1934/mui-utils",
+    "@mui/core-downloads-tracker": "^7.3.7",
+    "@mui/system": "npm:@tw1934/mui-system",
+    "@mui/types": "^7.4.10",
+    "@mui/utils": "npm:@tw1934/mui-utils",
     "@popperjs/core": "^2.11.8",
     "@types/react-transition-group": "^4.4.12",
     "clsx": "^2.1.1",
     "csstype": "^3.2.3",
     "react-is": "^19.2.3",
-    "react-transition-group": "@tw1934/react-transition-group",
-    "@mui/core-downloads-tracker": "^7.3.7",
-    "@mui/types": "^7.4.10",
-    "@mui/system": "npm:@tw1934/mui-system@^7.3.7"
+    "react-transition-group": "npm:@tw1934/react-transition-group"
   },
   "peerDependencies": {
     "@emotion/react": "^11.5.0",
     "@emotion/styled": "^11.3.0",
+    "@mui/material-pigment-css": "^7.3.7",
     "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0",
     "react": "^17.0.0 || ^18.0.0 || ^19.0.0",
-    "react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0",
-    "@mui/material-pigment-css": "^7.3.7"
+    "react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0"
   },
   "peerDependenciesMeta": {
     "@types/react": {

package/utils/useSlot.js

@@ -66,6 +66,7 @@ name, parameters) {
     className,
     ...useSlotPropsParams,
     externalForwardedProps: name === 'root' ? other : undefined,
+    // @ts-ignore
     externalSlotProps: resolvedComponentsProps
   });
   const ref = (0, _useForkRef.default)(internalRef, resolvedComponentsProps?.ref, parameters.ref);

package/version/index.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.version = exports.prerelease = exports.patch = exports.minor = exports.major = exports.default = void 0;
-const version = exports.version = "7.3.7";
+const version = exports.version = "7.3.8";
 const major = exports.major = Number("7");
 const minor = exports.minor = Number("3");
-const patch = exports.patch = Number("7");
+const patch = exports.patch = Number("8");
 const prerelease = exports.prerelease = undefined;
 var _default = exports.default = version;