@mui/utils

What is @mui/utils?

The @mui/utils package provides a collection of utility functions designed to aid in the development of UI components and applications. These utilities cover a range of functionalities such as deep object manipulation, event handling, and system property helpers, making it easier to implement common tasks in a more efficient and standardized way.

What are @mui/utils's main functionalities?

Deep object manipulation

Allows for the deep merging of two objects, useful for combining default and user-provided configurations.

import { deepmerge } from '@mui/utils';
const obj1 = { a: 1, b: 2 };
const obj2 = { b: 3, c: 4 };
const merged = deepmerge(obj1, obj2);
// Result: { a: 1, b: 3, c: 4 }

Event handling

Facilitates getting the owner document of a node, which is helpful for correctly attaching event listeners in a document-agnostic way.

import { ownerDocument } from '@mui/utils';
const doc = ownerDocument(node);
// Use doc to add or remove event listeners

System property helpers

Provides an enhanced effect hook that uses `useLayoutEffect` on the server to avoid warnings and `useEffect` on the client.

import { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';
useEnhancedEffect(() => {
  // Effect logic here
}, [deps]);

Other packages similar to @mui/utils

lodash

Lodash is a comprehensive utility library offering a wide range of functions for tasks such as object manipulation, array handling, and function utilities. It is more general-purpose compared to @mui/utils, which is more focused on UI development needs.

ramda

Ramda is a functional programming utility library that emphasizes a more functional programming approach. It provides utilities for working with functions, arrays, and objects in a functional manner. Ramda's approach is more about composing functions and immutable data handling, which contrasts with @mui/utils' focus on UI-specific utilities.

README

@mui/utils

Shared utilities used by MUI packages.

Changelog

6.2.0

<!-- generated comparing v6.1.10..master -->

Dec 10, 2024

A big thanks to the 9 contributors who made this release possible. Here are some highlights ✨:

• Material UI is now compatible with React 19 (#44672) @DiegoAndai
• Fixed incorrect aria-orientation for vertical sliders. <kbd>ArrowRight</kbd> now increases the value and <kbd>ArrowLeft</kbd> decreases the value in vertical sliders; they were reversed in prior versions. (#44537) @mj12albert