Published own npm react package causes project's big bundle

Question

I have my own ui library, called my-library which I am using in main project.

After some optimalization I figure out, that my-library cause that main project's bundle is too big, approximately 9MB (even with Webpack production mode). webpack-bundle-analyzer shows that almost 6MB takes react-icons library which I am using in my-library. There are some other big parts, which are caused also by my-library.

I think that there is some problem with "esm" vs "cjs". But in that part I am stuck.

I am attaching the parts of the code that I think are relevant.

my-library

// my-library babel.config.js

module.exports = {
    presets: ["@babel/preset-env", "@babel/preset-react"]
}

// my-library package.json

{
  "name": "my-library",
  "version": "3.9.0",
  "description": "",
  "main": "dist/index.js",
  "module": "dist/index.js",
  "scripts": {
     "build": "babel src --out-dir dist
  },
   "dependencies": {
     "react-icons": "^4.4.0",
     ...
  }
  ...
}

// my-librabry src/index.js

export { default as CrossButton } from './components/CrossButton'

// ...

// my-library CrossButton component

import React from 'react'
import { FaTimes } from 'react-icons/fa' // Webpack bundle all 'fa' icons, not just FaTimes

import PropTypes from 'prop-types'

const CrossButton = ({
    text=""
}) => {

    return (
        <button type="button">
         <FaTimes size={20} />
         {text}
           
        </button>
    )
}

CrossButton.propTypes = {
    text: PropTypes.string,
}

export default Button

Project

// Project's Webpack config

 module: {
        rules: [
            {
                test: /\.(js|jsx)$/,
                exclude: /node_modules/,
                use: {
                    loader: "babel-loader"
                }
            },
        ]
    },

import { CrossButton } from "my-library"

---

Note: I would rather not bundle 'my-library'. There were some complications with Redux, or something, I don't remember.