Skip to content

Releases: RubtsovAV/mui-symbols-material

v0.3.3

03 May 02:45
Compare
Choose a tag to compare

New Features:

  • ESM-Only Versions Introduced: To enhance the performance of package installation and reduce memory usage, we have introduced ESM-only versions of our icon sets across all weights. These versions are optimized for faster loading times and reduced resource utilization during the build processes, especially in CI environments.

Available Packages:

  • ESM-Only Versions:

    • @mui-symbols-material/w100-esm
    • @mui-symbols-material/w200-esm
    • @mui-symbols-material/w300-esm
    • @mui-symbols-material/w400-esm
    • @mui-symbols-material/w500-esm
    • @mui-symbols-material/w600-esm
    • @mui-symbols-material/w700-esm

    Each ESM-only package contains exclusively ECMAScript Module files, reducing the overall size of each package by approximately 50%.

  • Standard Packages:

    • @mui-symbols-material/w100
    • @mui-symbols-material/w200
    • @mui-symbols-material/w300
    • @mui-symbols-material/w400
    • @mui-symbols-material/w500
    • @mui-symbols-material/w600
    • @mui-symbols-material/w700

    The standard packages continue to be available, including both CommonJS (CJS) and ECMAScript Module (ESM) versions, catering to various development needs and environments.

Usage Instructions:

For the ESM-only versions, once installed, use the icons in your React components with an -esm suffix:

import React from 'react';
import { 
  FavoriteOutlined, 
  FavoriteRounded, 
  FavoriteSharp, 
  FavoriteFilledOutlined, 
  FavoriteFilledRounded, 
  FavoriteFilledSharp,
} from '@mui-symbols-material/w400-esm'; // Example using ESM version of weight 400

/**
 * Renders all variants of the favorite icon from Material Symbols in a React component.
 */
function MyComponent() {
  return (
    <>
      <FavoriteOutlined />
      <FavoriteRounded />
      <FavoriteSharp />
      <FavoriteFilledOutlined />
      <FavoriteFilledRounded />
      <FavoriteFilledSharp />
    </>
  );
}

For the standard packages, import icons as before, without the -esm suffix, allowing flexibility between CJS and ESM formats.

Additional Notes:

This update is part of our ongoing efforts to improve developer experience and efficiency. We appreciate your feedback and encourage you to test both the new ESM-only versions and the standard packages, especially in environments where performance and resource management are critical.

Thank you for your continued support and usage of @mui-symbols-material!

v0.3.2

16 Apr 20:33
Compare
Choose a tag to compare

What's Changed

  • Optimized Imports for @mui/material: We've updated the import path for the CommonJS (cjs) build of @mui/material to specifically target SvgIcon. Previously, the require statement imported the entire material library, which could lead to significantly slower test executions when using Jest, as it does not default to the ECMAScript Module (ESM) build. With this change, the import is now more focused, improving performance during testing. For details on minimizing bundle size with path imports, see the MUI Documentation.

A big thank you to @mbernardeau for identifying this issue and contributing to the fix. Your efforts help improve the library for everyone.
We encourage all users to update to this version to benefit from improved test performance.

As always, we appreciate your feedback and contributions!

v0.3.1

08 Apr 15:22
Compare
Choose a tag to compare

fixed import path to resolve this

import SvgIcon from '@mui/material';

// Error: No matching export in ... for import "default"

v0.3.0

08 Apr 12:33
Compare
Choose a tag to compare

The use of defaultProps has been deprecated in React, and accordingly, we have removed it from our project in version 0.3.0. This change aligns our codebase with the current standards and ensures compatibility with future versions of React. We recommend all users to update to this latest version for the most streamlined and efficient application experience.

v0.2.2

18 Feb 14:02
Compare
Choose a tag to compare

fix filled icon names: before it was with Fill suffix, now with Filled as it should be

v0.2.1

18 Feb 11:52
Compare
Choose a tag to compare

Fix Could not resolve "./utils/createSvgIcon"

v0.2.0

18 Feb 04:54
Compare
Choose a tag to compare

Release Notes for v0.2.0

We're thrilled to announce the release of version 0.2.0 for Material Symbols for MUI, featuring a significant enhancement tailored to improve design flexibility and integration ease within your projects. This update introduces a wide range of symbol weights and maintains consistent component naming across all variants, streamlining your design process.

What's New:

  • Full Spectrum of Weights: All weights from 100 to 700 are now available, allowing for a greater degree of design customization and precision.
  • Selective Installation: Optimize your project's efficiency by installing only the necessary weights. Each weight is available as a separate package, enabling precise control over your project's footprint.
  • Uniform Component Names: Regardless of the weight chosen, component names stay consistent, ensuring a straightforward and hassle-free integration into your projects. This consistency allows for easy swapping and comparison of different weights without the need to juggle different component names.

Available Packages:

  • @mui-symbols-material/w100
  • @mui-symbols-material/w200
  • @mui-symbols-material/w300
  • @mui-symbols-material/w400
  • @mui-symbols-material/w500
  • @mui-symbols-material/w600
  • @mui-symbols-material/w700

Installation:

To include the desired weight(s) in your project, simply install the specific package(s) you need:

npm install @mui-symbols-material/w[weight]

Replace [weight] with the desired weight number (e.g., 100, 200, ..., 700).

Example Usage:

Easily use and switch between different symbol weights by importing them under the same component name. This example demonstrates how to use two different weights for the FavoriteOutlined symbol:

import React from 'react';
import { FavoriteOutlined as FavoriteOutlinedRegular } from '@mui-symbols-material/w400'; // Regular weight
import { FavoriteOutlined as FavoriteOutlinedBold } from '@mui-symbols-material/w700'; // Bold weight

function App() {
  return (
    <div>
      <FavoriteOutlinedRegular /> {/* Regular */}
      <FavoriteOutlinedBold /> {/* Bold */}
    </div>
  );
}

This enhancement aims to provide you with a more dynamic and versatile design toolkit, ensuring that your projects can adapt to various design requirements with ease. We are excited to see the innovative ways you will utilize these new features in your projects.

Thank you for your continued support.

v0.0.1

18 Feb 01:40
Compare
Choose a tag to compare

First version with 400 weight