Overwrite built-in Vaadin web component

Is there a right way to remove an import added with @JsModule? My goal is to provide an alternative implementation of vaadin-details.

If you want to use another webcomponent for the Java class, you can extend the class and add your Tag.

The “right” way is probably to create your own Java class.

Honestly, I think I am going to monkey patch customElements.

Then, I can override custom elements

It’s hard to give a better advice without any context.

I need to somehow block the import of @vaadin/details/src/vaadin-details.js.

Using Vite. Could I somehow use a Vite plugin to modify generated-flow-imports.js on the fly to remove the import line?

I can add node_modules/@vaadin/details to my Vite config server.fs.deny, but that’s not enough since generated-flow-imports.js imports @vaadin/details/src/vaadin-details.js.

Sorry, I can’t offer much more context for confidentially reasons

The goal is to remove or block @vaadin/details/** from the dev/prod bundles. From there, I will provide a different implementation.

I have to remove or block it since the custom elements standard does not permit redefining custom elements.

If you remove the dependency to vaadin-details from your pom - it should not be in the prod bundle theoretically

But then devs wouldn’t have the Java class

Yes, I could recreate it in the same package in my app, but that

is messy

You can try to blacklist the package ( com.vaadin.flow.component.details) if you’re using Spring. That should block the jsmodule to be imported, but it will work only in production mode ( and maybe not at all).

Exclude the Vaadin details from the pom and create ( or copy/paste) the Java class is probably better. You won’t have the updates, but the updates will very likely break the component ( since the client side won’t be updated).

But why you want to do this? What exactly you want to modify? Could it be achieved by simple CSS adjustment?

Tatu is asking the right question here. It’s hard to recommend doing anything that complicated without first understanding what the underlying issue is that you’re trying to solve