md-elevation has already been used with this registry

[zZHorizonZz]

I'm currently using material-web components with lit/react, but I'm encountering a strange issue. On certain pages, I receive the following error:

Error: Failed to execute 'define' on 'CustomElementRegistry': the name "md-elevation" has already been used with this registry

I suspect the issue arises when the page includes components using the material-web component "md-elevation" (for example elevated buttons, chips, progress, fab, etc)
I create React components using Lit/React's createComponent method. Here's an example:

"use client";

import React from "react";
import { createComponent } from "@lit/react";
import { MdElevatedButton } from "@material/web/button/elevated-button.js";

export const ElevatedButton = createComponent({
 react: React,
 tagName: "md-elevated-button",
 elementClass: MdElevatedButton,
});

My research suggests this might be a known issue with Lit, as discussed here and here. However, I could be wrong. I would greatly appreciate any help or insights from the material-web team.

[asyncLiz]

Are you using or embedding your component in an application where someone else is also using @material/web? This error appears when multiple versions of @material/web are loaded at the same time on the page.

If you're not loading other code that is using MWC, your build may not be code splitting or bundling properly, causing additional copies of MWC to be loaded.