fix: use correct public path for assets in React (ESM) builds (version/11.12)

packages/pluggable-widgets-tools/CHANGELOG.md

@@ -26,6 +26,8 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ### Fixed
 
+-   We fixed an issue where images imported in widgets were not displayed correctly in the React client when deployed in the cloud.
+
 -   We fixed an issue on Windows where the generated `.mpk` was missing the widget's `.xml` files and icon/tile PNGs.
 
 -   We fixed an error thrown by the `audit` command on windows. It would fail when looking up available versions for vulnerable packages.

packages/pluggable-widgets-tools/configs/rollup.config.mjs

@@ -105,7 +105,11 @@ export default async args => {
                 url({
                     include: imagesAndFonts,
                     limit: 0,
-                    publicPath: `${join("widgets", outAssetsDir)}/`, // Prefix for the actual import, relative to Mendix web server root
+                    // Prefix for the actual import, relative to Mendix web server root
+                    // dojo uses: "widgets/<widget-path>/assets/123abc.png"
+                    // react uses:   "dist/<widget-path>/assets/123abc.png"
+                    publicPath:
+                        outputFormat === "es" ? `${join("dist", outAssetsDir)}/` : `${join("widgets", outAssetsDir)}/`,
                     destDir: absoluteOutAssetsDir
                 }),
                 postCssPlugin(outputFormat, production),

packages/pluggable-widgets-tools/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mendix/pluggable-widgets-tools",
-  "version": "11.12.0",
+  "version": "11.12.1",
   "description": "Mendix Pluggable Widgets Tools",
   "engines": {
     "node": "^22.18.0"