@grafana/create-plugin 6.8.0-canary.2356.20813241719.0 → 6.8.0-canary.2356.20813982803.0

package/CHANGELOG.md

@@ -1,3 +1,15 @@
+# v6.7.1 (Thu Jan 08 2026)
+
+#### 🐛 Bug Fix
+
+- fix: stop copying all images to bundle [#2369](https://github.com/grafana/plugin-tools/pull/2369) ([@jackw](https://github.com/jackw))
+
+#### Authors: 1
+
+- Jack Westbrook ([@jackw](https://github.com/jackw))
+
+---
+
 # v6.7.0 (Wed Jan 07 2026)
 
 #### 🚀 Enhancement

package/dist/codemods/additions/scripts/bundle-grafana-ui/index.js

@@ -1,39 +1,35 @@
 import * as v from 'valibot';
 import * as recast from 'recast';
-import * as typeScriptParser from 'recast/parsers/typescript.js';
 import { coerce, gte } from 'semver';
 import { additionsDebug } from '../../../utils.js';
 import { updateExternalsArray } from '../../../utils.externals.js';
 
 const { builders } = recast.types;
-const schema = v.object({});
 const PLUGIN_JSON_PATH = "src/plugin.json";
 const MIN_GRAFANA_VERSION = "10.2.0";
 const WEBPACK_CONFIG_PATH = ".config/webpack/webpack.config.ts";
 const RSPACK_CONFIG_PATH = ".config/rspack/rspack.config.ts";
-function isGrafanaUiRegex(element) {
-  if (element.type === "RegExpLiteral") {
-    const regexNode = element;
-    return regexNode.pattern === "^@grafana\\/ui" && regexNode.flags === "i";
-  }
-  if (element.type === "Literal" && "regex" in element && element.regex) {
-    const regex = element.regex;
-    return regex.pattern === "^@grafana\\/ui" && regex.flags === "i";
-  }
-  return false;
+const schema = v.object({});
+function bundleGrafanaUI(context, _options) {
+  additionsDebug("Running bundle-grafana-ui addition...");
+  ensureMinGrafanaVersion(context);
+  updateExternalsArray(context, createBundleGrafanaUIModifier());
+  updateResolveExtensionsSimple(context);
+  updateModuleRulesSimple(context);
+  return context;
 }
-function isGrafanaDataRegex(element) {
+function isGrafanaRegex(element, pattern) {
   if (element.type === "RegExpLiteral") {
     const regexNode = element;
-    return regexNode.pattern === "^@grafana\\/data" && regexNode.flags === "i";
+    return regexNode.pattern === pattern && regexNode.flags === "i";
   }
   if (element.type === "Literal" && "regex" in element && element.regex) {
     const regex = element.regex;
-    return regex.pattern === "^@grafana\\/data" && regex.flags === "i";
+    return regex.pattern === pattern && regex.flags === "i";
   }
   return false;
 }
-function modifyExternalsArray(externalsArray) {
+function removeGrafanaUiAndAddReactInlineSvg(externalsArray) {
   let hasChanges = false;
   let hasGrafanaUiExternal = false;
   let hasReactInlineSvg = false;
@@ -41,7 +37,7 @@ function modifyExternalsArray(externalsArray) {
     if (!element) {
       continue;
     }
-    if (isGrafanaUiRegex(element)) {
+    if (isGrafanaRegex(element, "^@grafana\\/ui")) {
       hasGrafanaUiExternal = true;
     }
     if ((element.type === "Literal" || element.type === "StringLiteral") && "value" in element && typeof element.value === "string" && element.value === "react-inlinesvg") {
@@ -53,7 +49,7 @@ function modifyExternalsArray(externalsArray) {
       if (!element) {
         return true;
       }
-      return !isGrafanaUiRegex(element);
+      return !isGrafanaRegex(element, "^@grafana\\/ui");
     });
     hasChanges = true;
     additionsDebug("Removed /^@grafana\\/ui/i from externals array");
@@ -62,7 +58,7 @@ function modifyExternalsArray(externalsArray) {
     let insertIndex = -1;
     for (let i = 0; i < externalsArray.elements.length; i++) {
       const element = externalsArray.elements[i];
-      if (element && isGrafanaDataRegex(element)) {
+      if (element && isGrafanaRegex(element, "^@grafana\\/data")) {
         insertIndex = i + 1;
         break;
       }
@@ -79,196 +75,69 @@ function modifyExternalsArray(externalsArray) {
 }
 function createBundleGrafanaUIModifier() {
   return (externalsArray) => {
-    return modifyExternalsArray(externalsArray);
+    return removeGrafanaUiAndAddReactInlineSvg(externalsArray);
   };
 }
-function updateBundlerResolveConfig(context) {
-  if (context.doesFileExist(RSPACK_CONFIG_PATH)) {
-    additionsDebug(`Found ${RSPACK_CONFIG_PATH}, updating resolve configuration...`);
-    const rspackContent = context.getFile(RSPACK_CONFIG_PATH);
-    if (rspackContent) {
-      try {
-        const ast = recast.parse(rspackContent, {
-          parser: typeScriptParser
-        });
-        let hasChanges = false;
-        recast.visit(ast, {
-          visitObjectExpression(path) {
-            const { node } = path;
-            const properties = node.properties;
-            if (properties) {
-              for (const prop of properties) {
-                if (prop && (prop.type === "Property" || prop.type === "ObjectProperty")) {
-                  const key = "key" in prop ? prop.key : null;
-                  const value = "value" in prop ? prop.value : null;
-                  if (key && key.type === "Identifier" && key.name === "resolve" && value && value.type === "ObjectExpression") {
-                    hasChanges = updateResolveObject(value) || hasChanges;
-                  }
-                  if (key && key.type === "Identifier" && key.name === "module" && value && value.type === "ObjectExpression") {
-                    hasChanges = updateModuleRules(value) || hasChanges;
-                  }
-                }
-              }
-            }
-            return this.traverse(path);
-          }
-        });
-        if (hasChanges) {
-          const output = recast.print(ast, {
-            tabWidth: 2,
-            trailingComma: true,
-            lineTerminator: "\n"
-          });
-          context.updateFile(RSPACK_CONFIG_PATH, output.code);
-          additionsDebug(`Updated ${RSPACK_CONFIG_PATH}`);
-        }
-      } catch (error) {
-        additionsDebug(`Error updating ${RSPACK_CONFIG_PATH}:`, error);
-      }
-    }
+function updateResolveExtensionsSimple(context) {
+  const configPath = context.doesFileExist(RSPACK_CONFIG_PATH) ? RSPACK_CONFIG_PATH : context.doesFileExist(WEBPACK_CONFIG_PATH) ? WEBPACK_CONFIG_PATH : null;
+  if (!configPath) {
     return;
   }
-  if (context.doesFileExist(WEBPACK_CONFIG_PATH)) {
-    additionsDebug(`Found ${WEBPACK_CONFIG_PATH}, updating resolve configuration...`);
-    const webpackContent = context.getFile(WEBPACK_CONFIG_PATH);
-    if (webpackContent) {
-      try {
-        const ast = recast.parse(webpackContent, {
-          parser: typeScriptParser
-        });
-        let hasChanges = false;
-        recast.visit(ast, {
-          visitObjectExpression(path) {
-            const { node } = path;
-            const properties = node.properties;
-            if (properties) {
-              for (const prop of properties) {
-                if (prop && (prop.type === "Property" || prop.type === "ObjectProperty")) {
-                  const key = "key" in prop ? prop.key : null;
-                  const value = "value" in prop ? prop.value : null;
-                  if (key && key.type === "Identifier" && key.name === "resolve" && value && value.type === "ObjectExpression") {
-                    hasChanges = updateResolveObject(value) || hasChanges;
-                  }
-                  if (key && key.type === "Identifier" && key.name === "module" && value && value.type === "ObjectExpression") {
-                    hasChanges = updateModuleRules(value) || hasChanges;
-                  }
-                }
-              }
-            }
-            return this.traverse(path);
-          }
-        });
-        if (hasChanges) {
-          const output = recast.print(ast, {
-            tabWidth: 2,
-            trailingComma: true,
-            lineTerminator: "\n"
-          });
-          context.updateFile(WEBPACK_CONFIG_PATH, output.code);
-          additionsDebug(`Updated ${WEBPACK_CONFIG_PATH}`);
-        }
-      } catch (error) {
-        additionsDebug(`Error updating ${WEBPACK_CONFIG_PATH}:`, error);
-      }
-    }
+  const content = context.getFile(configPath);
+  if (!content) {
+    return;
   }
-}
-function updateModuleRules(moduleObject) {
-  if (!moduleObject.properties) {
-    return false;
+  if (content.includes("'.mjs'") || content.includes('".mjs"')) {
+    return;
   }
-  let hasChanges = false;
-  let hasMjsRule = false;
-  let rulesProperty = null;
-  for (const prop of moduleObject.properties) {
-    if (!prop || prop.type !== "Property" && prop.type !== "ObjectProperty") {
-      continue;
-    }
-    const key = "key" in prop ? prop.key : null;
-    const value = "value" in prop ? prop.value : null;
-    if (key && key.type === "Identifier" && key.name === "rules" && value && value.type === "ArrayExpression") {
-      rulesProperty = prop;
-      for (const element of value.elements) {
-        if (element && element.type === "ObjectExpression" && element.properties) {
-          for (const ruleProp of element.properties) {
-            if (ruleProp && (ruleProp.type === "Property" || ruleProp.type === "ObjectProperty") && "key" in ruleProp && ruleProp.key.type === "Identifier" && ruleProp.key.name === "test") {
-              const testValue = "value" in ruleProp ? ruleProp.value : null;
-              if (testValue) {
-                if (testValue.type === "RegExpLiteral" && "pattern" in testValue && testValue.pattern === "\\.mjs$") {
-                  hasMjsRule = true;
-                  break;
-                }
-                if (testValue.type === "Literal" && "regex" in testValue && testValue.regex && typeof testValue.regex === "object" && "pattern" in testValue.regex && testValue.regex.pattern === "\\.mjs$") {
-                  hasMjsRule = true;
-                  break;
-                }
-                if (testValue.type === "Literal" && "value" in testValue && typeof testValue.value === "string" && testValue.value.includes(".mjs")) {
-                  hasMjsRule = true;
-                  break;
-                }
-              }
-            }
-          }
-        }
-        if (hasMjsRule) {
-          break;
-        }
-      }
-      break;
+  const updated = content.replace(/(extensions:\s*\[)([^\]]+)(\])/, (match, prefix, extensions, suffix) => {
+    if (extensions.includes(".mjs")) {
+      return match;
     }
+    return `${prefix}${extensions}, '.mjs'${suffix}`;
+  });
+  if (updated !== content) {
+    context.updateFile(configPath, updated);
+    additionsDebug("Added '.mjs' to resolve.extensions");
   }
-  if (!hasMjsRule && rulesProperty && "value" in rulesProperty) {
-    const rulesArray = rulesProperty.value;
-    const mjsRule = builders.objectExpression([
-      builders.property("init", builders.identifier("test"), builders.literal(/\.mjs$/)),
-      builders.property("init", builders.identifier("include"), builders.literal(/node_modules/)),
-      builders.property(
-        "init",
-        builders.identifier("resolve"),
-        builders.objectExpression([
-          builders.property("init", builders.identifier("fullySpecified"), builders.literal(false))
-        ])
-      ),
-      builders.property("init", builders.identifier("type"), builders.literal("javascript/auto"))
-    ]);
-    rulesArray.elements.splice(1, 0, mjsRule);
-    hasChanges = true;
-    additionsDebug("Added module rule for .mjs files in node_modules with resolve.fullySpecified: false");
-  }
-  return hasChanges;
 }
-function updateResolveObject(resolveObject) {
-  if (!resolveObject.properties) {
-    return false;
+function updateModuleRulesSimple(context) {
+  const configPath = context.doesFileExist(RSPACK_CONFIG_PATH) ? RSPACK_CONFIG_PATH : context.doesFileExist(WEBPACK_CONFIG_PATH) ? WEBPACK_CONFIG_PATH : null;
+  if (!configPath) {
+    return;
   }
-  let hasChanges = false;
-  let hasMjsExtension = false;
-  let extensionsProperty = null;
-  for (const prop of resolveObject.properties) {
-    if (!prop || prop.type !== "Property" && prop.type !== "ObjectProperty") {
-      continue;
-    }
-    const key = "key" in prop ? prop.key : null;
-    const value = "value" in prop ? prop.value : null;
-    if (key && key.type === "Identifier") {
-      if (key.name === "extensions" && value && value.type === "ArrayExpression") {
-        extensionsProperty = prop;
-        for (const element of value.elements) {
-          if (element && (element.type === "Literal" || element.type === "StringLiteral") && "value" in element && element.value === ".mjs") {
-            hasMjsExtension = true;
-            break;
-          }
-        }
+  const content = context.getFile(configPath);
+  if (!content) {
+    return;
+  }
+  if (content.includes("test: /\\.mjs$") || content.includes("test: /\\\\.mjs$")) {
+    return;
+  }
+  const mjsRule = `{
+        test: /\\.mjs$/,
+        include: /node_modules/,
+        resolve: {
+          fullySpecified: false,
+        },
+        type: 'javascript/auto',
+      },`;
+  let updated = content;
+  if (content.match(/rules:\s*\[\s*\]/)) {
+    updated = content.replace(/(rules:\s*\[\s*)(\])/, `$1${mjsRule}
+      $2`);
+  } else {
+    updated = content.replace(/(rules:\s*\[\s*)(\{[\s\S]*?\}),(\s*)/, (match, prefix, firstRule, suffix) => {
+      if (match.includes("test: /\\.mjs$")) {
+        return match;
       }
-    }
+      return `${prefix}${firstRule},
+      ${mjsRule}${suffix}`;
+    });
   }
-  if (!hasMjsExtension && extensionsProperty && "value" in extensionsProperty) {
-    const extensionsArray = extensionsProperty.value;
-    extensionsArray.elements.push(builders.literal(".mjs"));
-    hasChanges = true;
-    additionsDebug("Added '.mjs' to resolve.extensions");
+  if (updated !== content) {
+    context.updateFile(configPath, updated);
+    additionsDebug("Added module rule for .mjs files in node_modules with resolve.fullySpecified: false");
   }
-  return hasChanges;
 }
 function ensureMinGrafanaVersion(context) {
   if (!context.doesFileExist(PLUGIN_JSON_PATH)) {
@@ -308,12 +177,5 @@ function ensureMinGrafanaVersion(context) {
     additionsDebug(`Error updating ${PLUGIN_JSON_PATH}:`, error);
   }
 }
-function bundleGrafanaUI(context, _options) {
-  additionsDebug("Running bundle-grafana-ui addition...");
-  ensureMinGrafanaVersion(context);
-  updateExternalsArray(context, createBundleGrafanaUIModifier());
-  updateBundlerResolveConfig(context);
-  return context;
-}
 
 export { bundleGrafanaUI as default, schema };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@grafana/create-plugin",
-  "version": "6.8.0-canary.2356.20813241719.0",
+  "version": "6.8.0-canary.2356.20813982803.0",
   "repository": {
     "directory": "packages/create-plugin",
     "url": "https://github.com/grafana/plugin-tools"
@@ -55,5 +55,5 @@
   "engines": {
     "node": ">=20"
   },
-  "gitHead": "a1f3d6909efb7fabc801bc7cc221803fffe0cc2f"
+  "gitHead": "fedff1c23ee3079d90f0ed2d6984c78fb294b1b9"
 }

package/src/codemods/additions/scripts/bundle-grafana-ui/index.ts

@@ -1,6 +1,5 @@
 import * as v from 'valibot';
 import * as recast from 'recast';
-import * as typeScriptParser from 'recast/parsers/typescript.js';
 import { coerce, gte } from 'semver';
 
 import type { Context } from '../../../context.js';
@@ -9,47 +8,47 @@ import { updateExternalsArray, type ExternalsArrayModifier } from '../../../util
 
 const { builders } = recast.types;
 
-export const schema = v.object({});
-
-type BundleGrafanaUIOptions = v.InferOutput<typeof schema>;
-
 const PLUGIN_JSON_PATH = 'src/plugin.json';
 const MIN_GRAFANA_VERSION = '10.2.0';
 const WEBPACK_CONFIG_PATH = '.config/webpack/webpack.config.ts';
 const RSPACK_CONFIG_PATH = '.config/rspack/rspack.config.ts';
 
-/**
- * Checks if an AST node is a regex matching @grafana/ui
- * The pattern in the AST is "^@grafana\/ui" (backslash-escaped forward slash)
- */
-function isGrafanaUiRegex(element: recast.types.namedTypes.ASTNode): boolean {
-  // Handle RegExpLiteral (TypeScript parser)
-  if (element.type === 'RegExpLiteral') {
-    const regexNode = element as recast.types.namedTypes.RegExpLiteral;
-    return regexNode.pattern === '^@grafana\\/ui' && regexNode.flags === 'i';
-  }
-  // Handle Literal with regex property (other parsers)
-  if (element.type === 'Literal' && 'regex' in element && element.regex) {
-    const regex = element.regex as { pattern: string; flags: string };
-    return regex.pattern === '^@grafana\\/ui' && regex.flags === 'i';
-  }
-  return false;
+export const schema = v.object({});
+type BundleGrafanaUIOptions = v.InferOutput<typeof schema>;
+
+export default function bundleGrafanaUI(context: Context, _options: BundleGrafanaUIOptions): Context {
+  additionsDebug('Running bundle-grafana-ui addition...');
+
+  // Ensure minimum Grafana version requirement
+  ensureMinGrafanaVersion(context);
+
+  // Update externals array using the shared utility
+  updateExternalsArray(context, createBundleGrafanaUIModifier());
+
+  // Update bundler resolve configuration to handle ESM imports
+  updateResolveExtensionsSimple(context);
+
+  // Update module rules directly with simple string manipulation
+  updateModuleRulesSimple(context);
+
+  return context;
 }
 
 /**
- * Checks if an AST node is a regex matching @grafana/data
- * The pattern in the AST is "^@grafana\/data" (backslash-escaped forward slash)
+ * Checks if an AST node is a regex matching a Grafana package pattern
+ * @param element - The AST node to check
+ * @param pattern - The regex pattern to match (e.g., "^@grafana\\/ui" or "^@grafana\\/data")
  */
-function isGrafanaDataRegex(element: recast.types.namedTypes.ASTNode): boolean {
+function isGrafanaRegex(element: recast.types.namedTypes.ASTNode, pattern: string): boolean {
   // Handle RegExpLiteral (TypeScript parser)
   if (element.type === 'RegExpLiteral') {
     const regexNode = element as recast.types.namedTypes.RegExpLiteral;
-    return regexNode.pattern === '^@grafana\\/data' && regexNode.flags === 'i';
+    return regexNode.pattern === pattern && regexNode.flags === 'i';
   }
   // Handle Literal with regex property (other parsers)
   if (element.type === 'Literal' && 'regex' in element && element.regex) {
     const regex = element.regex as { pattern: string; flags: string };
-    return regex.pattern === '^@grafana\\/data' && regex.flags === 'i';
+    return regex.pattern === pattern && regex.flags === 'i';
   }
   return false;
 }
@@ -58,7 +57,7 @@ function isGrafanaDataRegex(element: recast.types.namedTypes.ASTNode): boolean {
  * Removes /^@grafana\/ui/i regex from externals array and adds 'react-inlinesvg'
  * @returns true if changes were made, false otherwise
  */
-function modifyExternalsArray(externalsArray: recast.types.namedTypes.ArrayExpression): boolean {
+function removeGrafanaUiAndAddReactInlineSvg(externalsArray: recast.types.namedTypes.ArrayExpression): boolean {
   let hasChanges = false;
   let hasGrafanaUiExternal = false;
   let hasReactInlineSvg = false;
@@ -70,7 +69,7 @@ function modifyExternalsArray(externalsArray: recast.types.namedTypes.ArrayExpre
     }
 
     // Check for /^@grafana\/ui/i regex
-    if (isGrafanaUiRegex(element)) {
+    if (isGrafanaRegex(element, '^@grafana\\/ui')) {
       hasGrafanaUiExternal = true;
     }
 
@@ -91,7 +90,7 @@ function modifyExternalsArray(externalsArray: recast.types.namedTypes.ArrayExpre
       if (!element) {
         return true;
       }
-      return !isGrafanaUiRegex(element);
+      return !isGrafanaRegex(element, '^@grafana\\/ui');
     });
     hasChanges = true;
     additionsDebug('Removed /^@grafana\\/ui/i from externals array');
@@ -103,7 +102,7 @@ function modifyExternalsArray(externalsArray: recast.types.namedTypes.ArrayExpre
     let insertIndex = -1;
     for (let i = 0; i < externalsArray.elements.length; i++) {
       const element = externalsArray.elements[i];
-      if (element && isGrafanaDataRegex(element)) {
+      if (element && isGrafanaRegex(element, '^@grafana\\/data')) {
         insertIndex = i + 1;
         break;
       }
@@ -128,302 +127,108 @@ function modifyExternalsArray(externalsArray: recast.types.namedTypes.ArrayExpre
  */
 function createBundleGrafanaUIModifier(): ExternalsArrayModifier {
   return (externalsArray: recast.types.namedTypes.ArrayExpression) => {
-    return modifyExternalsArray(externalsArray);
+    return removeGrafanaUiAndAddReactInlineSvg(externalsArray);
   };
 }
 
 /**
- * Updates the bundler's resolve configuration to handle ESM imports from @grafana/ui
- * - Adds '.mjs' to resolve.extensions
- * - Adds fullySpecified: false to allow extensionless imports in node_modules
+ * Updates resolve extensions to add .mjs using simple string manipulation
+ * This is a simplified approach that may not handle all edge cases, but is much simpler
  */
-function updateBundlerResolveConfig(context: Context): void {
-  // Try rspack config first (newer structure)
-  if (context.doesFileExist(RSPACK_CONFIG_PATH)) {
-    additionsDebug(`Found ${RSPACK_CONFIG_PATH}, updating resolve configuration...`);
-    const rspackContent = context.getFile(RSPACK_CONFIG_PATH);
-    if (rspackContent) {
-      try {
-        const ast = recast.parse(rspackContent, {
-          parser: typeScriptParser,
-        });
-
-        let hasChanges = false;
-
-        recast.visit(ast, {
-          visitObjectExpression(path) {
-            const { node } = path;
-            const properties = node.properties;
-
-            if (properties) {
-              for (const prop of properties) {
-                if (prop && (prop.type === 'Property' || prop.type === 'ObjectProperty')) {
-                  const key = 'key' in prop ? prop.key : null;
-                  const value = 'value' in prop ? prop.value : null;
-
-                  // Find the resolve property
-                  if (
-                    key &&
-                    key.type === 'Identifier' &&
-                    key.name === 'resolve' &&
-                    value &&
-                    value.type === 'ObjectExpression'
-                  ) {
-                    hasChanges = updateResolveObject(value) || hasChanges;
-                  }
-
-                  // Find the module property to add .mjs rule
-                  if (
-                    key &&
-                    key.type === 'Identifier' &&
-                    key.name === 'module' &&
-                    value &&
-                    value.type === 'ObjectExpression'
-                  ) {
-                    hasChanges = updateModuleRules(value) || hasChanges;
-                  }
-                }
-              }
-            }
-
-            return this.traverse(path);
-          },
-        });
-
-        if (hasChanges) {
-          const output = recast.print(ast, {
-            tabWidth: 2,
-            trailingComma: true,
-            lineTerminator: '\n',
-          });
-          context.updateFile(RSPACK_CONFIG_PATH, output.code);
-          additionsDebug(`Updated ${RSPACK_CONFIG_PATH}`);
-        }
-      } catch (error) {
-        additionsDebug(`Error updating ${RSPACK_CONFIG_PATH}:`, error);
-      }
-    }
+function updateResolveExtensionsSimple(context: Context): void {
+  const configPath = context.doesFileExist(RSPACK_CONFIG_PATH)
+    ? RSPACK_CONFIG_PATH
+    : context.doesFileExist(WEBPACK_CONFIG_PATH)
+      ? WEBPACK_CONFIG_PATH
+      : null;
+
+  if (!configPath) {
     return;
   }
 
-  // Fall back to webpack config (legacy structure)
-  if (context.doesFileExist(WEBPACK_CONFIG_PATH)) {
-    additionsDebug(`Found ${WEBPACK_CONFIG_PATH}, updating resolve configuration...`);
-    const webpackContent = context.getFile(WEBPACK_CONFIG_PATH);
-    if (webpackContent) {
-      try {
-        const ast = recast.parse(webpackContent, {
-          parser: typeScriptParser,
-        });
-
-        let hasChanges = false;
-
-        recast.visit(ast, {
-          visitObjectExpression(path) {
-            const { node } = path;
-            const properties = node.properties;
-
-            if (properties) {
-              for (const prop of properties) {
-                if (prop && (prop.type === 'Property' || prop.type === 'ObjectProperty')) {
-                  const key = 'key' in prop ? prop.key : null;
-                  const value = 'value' in prop ? prop.value : null;
-
-                  // Find the resolve property
-                  if (
-                    key &&
-                    key.type === 'Identifier' &&
-                    key.name === 'resolve' &&
-                    value &&
-                    value.type === 'ObjectExpression'
-                  ) {
-                    hasChanges = updateResolveObject(value) || hasChanges;
-                  }
-
-                  // Find the module property to add .mjs rule
-                  if (
-                    key &&
-                    key.type === 'Identifier' &&
-                    key.name === 'module' &&
-                    value &&
-                    value.type === 'ObjectExpression'
-                  ) {
-                    hasChanges = updateModuleRules(value) || hasChanges;
-                  }
-                }
-              }
-            }
-
-            return this.traverse(path);
-          },
-        });
-
-        if (hasChanges) {
-          const output = recast.print(ast, {
-            tabWidth: 2,
-            trailingComma: true,
-            lineTerminator: '\n',
-          });
-          context.updateFile(WEBPACK_CONFIG_PATH, output.code);
-          additionsDebug(`Updated ${WEBPACK_CONFIG_PATH}`);
-        }
-      } catch (error) {
-        additionsDebug(`Error updating ${WEBPACK_CONFIG_PATH}:`, error);
-      }
-    }
+  const content = context.getFile(configPath);
+  if (!content) {
+    return;
   }
-}
 
-/**
- * Updates module rules to add a rule for .mjs files in node_modules with resolve.fullySpecified: false
- */
-function updateModuleRules(moduleObject: recast.types.namedTypes.ObjectExpression): boolean {
-  if (!moduleObject.properties) {
-    return false;
+  // Check if .mjs already exists
+  if (content.includes("'.mjs'") || content.includes('".mjs"')) {
+    return;
   }
 
-  let hasChanges = false;
-  let hasMjsRule = false;
-  let rulesProperty: recast.types.namedTypes.Property | null = null;
-
-  // Find the rules property
-  for (const prop of moduleObject.properties) {
-    if (!prop || (prop.type !== 'Property' && prop.type !== 'ObjectProperty')) {
-      continue;
-    }
-
-    const key = 'key' in prop ? prop.key : null;
-    const value = 'value' in prop ? prop.value : null;
-
-    if (key && key.type === 'Identifier' && key.name === 'rules' && value && value.type === 'ArrayExpression') {
-      rulesProperty = prop as recast.types.namedTypes.Property;
-      // Check if .mjs rule already exists
-      for (const element of value.elements) {
-        if (element && element.type === 'ObjectExpression' && element.properties) {
-          for (const ruleProp of element.properties) {
-            if (
-              ruleProp &&
-              (ruleProp.type === 'Property' || ruleProp.type === 'ObjectProperty') &&
-              'key' in ruleProp &&
-              ruleProp.key.type === 'Identifier' &&
-              ruleProp.key.name === 'test'
-            ) {
-              const testValue = 'value' in ruleProp ? ruleProp.value : null;
-              if (testValue) {
-                // Check for RegExpLiteral with .mjs pattern
-                if (testValue.type === 'RegExpLiteral' && 'pattern' in testValue && testValue.pattern === '\\.mjs$') {
-                  hasMjsRule = true;
-                  break;
-                }
-                // Check for Literal with regex property
-                if (
-                  testValue.type === 'Literal' &&
-                  'regex' in testValue &&
-                  testValue.regex &&
-                  typeof testValue.regex === 'object' &&
-                  'pattern' in testValue.regex &&
-                  testValue.regex.pattern === '\\.mjs$'
-                ) {
-                  hasMjsRule = true;
-                  break;
-                }
-                // Check for string literal containing .mjs
-                if (
-                  testValue.type === 'Literal' &&
-                  'value' in testValue &&
-                  typeof testValue.value === 'string' &&
-                  testValue.value.includes('.mjs')
-                ) {
-                  hasMjsRule = true;
-                  break;
-                }
-              }
-            }
-          }
-        }
-        if (hasMjsRule) {
-          break;
-        }
-      }
-      break;
+  // Add .mjs to extensions array
+  const updated = content.replace(/(extensions:\s*\[)([^\]]+)(\])/, (match, prefix, extensions, suffix) => {
+    if (extensions.includes('.mjs')) {
+      return match;
     }
-  }
+    return `${prefix}${extensions}, '.mjs'${suffix}`;
+  });
 
-  // Add .mjs rule if missing (insert at position 1, after imports-loader rule which must be first)
-  if (!hasMjsRule && rulesProperty && 'value' in rulesProperty) {
-    const rulesArray = rulesProperty.value as recast.types.namedTypes.ArrayExpression;
-    const mjsRule = builders.objectExpression([
-      builders.property('init', builders.identifier('test'), builders.literal(/\.mjs$/)),
-      builders.property('init', builders.identifier('include'), builders.literal(/node_modules/)),
-      builders.property(
-        'init',
-        builders.identifier('resolve'),
-        builders.objectExpression([
-          builders.property('init', builders.identifier('fullySpecified'), builders.literal(false)),
-        ])
-      ),
-      builders.property('init', builders.identifier('type'), builders.literal('javascript/auto')),
-    ]);
-    // Insert at position 1 (second position) to keep imports-loader first
-    rulesArray.elements.splice(1, 0, mjsRule);
-    hasChanges = true;
-    additionsDebug('Added module rule for .mjs files in node_modules with resolve.fullySpecified: false');
+  if (updated !== content) {
+    context.updateFile(configPath, updated);
+    additionsDebug("Added '.mjs' to resolve.extensions");
   }
-
-  return hasChanges;
 }
 
 /**
- * Updates a resolve object expression to add .mjs extension
- * Note: We don't set fullySpecified: false globally because .mjs files need
- * rule-level configuration to override ESM's strict fully-specified import requirements
+ * Updates module rules to add .mjs rule using simple string manipulation
+ * This is a simplified approach that may not handle all edge cases, but is much simpler
  */
-function updateResolveObject(resolveObject: recast.types.namedTypes.ObjectExpression): boolean {
-  if (!resolveObject.properties) {
-    return false;
+function updateModuleRulesSimple(context: Context): void {
+  const configPath = context.doesFileExist(RSPACK_CONFIG_PATH)
+    ? RSPACK_CONFIG_PATH
+    : context.doesFileExist(WEBPACK_CONFIG_PATH)
+      ? WEBPACK_CONFIG_PATH
+      : null;
+
+  if (!configPath) {
+    return;
   }
 
-  let hasChanges = false;
-  let hasMjsExtension = false;
-  let extensionsProperty: recast.types.namedTypes.Property | null = null;
+  const content = context.getFile(configPath);
+  if (!content) {
+    return;
+  }
 
-  // Check current state
-  for (const prop of resolveObject.properties) {
-    if (!prop || (prop.type !== 'Property' && prop.type !== 'ObjectProperty')) {
-      continue;
-    }
+  // Check if rule already exists
+  if (content.includes('test: /\\.mjs$') || content.includes('test: /\\\\.mjs$')) {
+    return;
+  }
 
-    const key = 'key' in prop ? prop.key : null;
-    const value = 'value' in prop ? prop.value : null;
-
-    if (key && key.type === 'Identifier') {
-      if (key.name === 'extensions' && value && value.type === 'ArrayExpression') {
-        extensionsProperty = prop as recast.types.namedTypes.Property;
-        // Check if .mjs is already in the extensions array
-        for (const element of value.elements) {
-          if (
-            element &&
-            (element.type === 'Literal' || element.type === 'StringLiteral') &&
-            'value' in element &&
-            element.value === '.mjs'
-          ) {
-            hasMjsExtension = true;
-            break;
-          }
-        }
+  const mjsRule = `{
+        test: /\\.mjs$/,
+        include: /node_modules/,
+        resolve: {
+          fullySpecified: false,
+        },
+        type: 'javascript/auto',
+      },`;
+
+  // Simple approach: find rules array and insert after first rule
+  let updated = content;
+
+  // Case 1: Empty array - insert at start
+  if (content.match(/rules:\s*\[\s*\]/)) {
+    updated = content.replace(/(rules:\s*\[\s*)(\])/, `$1${mjsRule}\n      $2`);
+  }
+  // Case 2: Find first rule and insert after it
+  else {
+    // Match: rules: [ { ... }, and insert mjs rule after the first rule
+    // The regex finds the first complete rule object (balanced braces)
+    updated = content.replace(/(rules:\s*\[\s*)(\{[\s\S]*?\}),(\s*)/, (match, prefix, firstRule, suffix) => {
+      // Check if we already inserted (avoid double insertion)
+      if (match.includes('test: /\\.mjs$')) {
+        return match;
       }
-    }
+      // Insert mjs rule after first rule
+      return `${prefix}${firstRule},\n      ${mjsRule}${suffix}`;
+    });
   }
 
-  // Add .mjs to extensions if missing
-  if (!hasMjsExtension && extensionsProperty && 'value' in extensionsProperty) {
-    const extensionsArray = extensionsProperty.value as recast.types.namedTypes.ArrayExpression;
-    extensionsArray.elements.push(builders.literal('.mjs'));
-    hasChanges = true;
-    additionsDebug("Added '.mjs' to resolve.extensions");
+  if (updated !== content) {
+    context.updateFile(configPath, updated);
+    additionsDebug('Added module rule for .mjs files in node_modules with resolve.fullySpecified: false');
   }
-
-  return hasChanges;
 }
 
 /**
@@ -471,18 +276,3 @@ function ensureMinGrafanaVersion(context: Context): void {
     additionsDebug(`Error updating ${PLUGIN_JSON_PATH}:`, error);
   }
 }
-
-export default function bundleGrafanaUI(context: Context, _options: BundleGrafanaUIOptions): Context {
-  additionsDebug('Running bundle-grafana-ui addition...');
-
-  // Ensure minimum Grafana version requirement
-  ensureMinGrafanaVersion(context);
-
-  // Update externals array using the shared utility
-  updateExternalsArray(context, createBundleGrafanaUIModifier());
-
-  // Update bundler resolve configuration to handle ESM imports
-  updateBundlerResolveConfig(context);
-
-  return context;
-}

package/src/codemods/utils.bundler-config.ts

@@ -0,0 +1,180 @@
+import * as recast from 'recast';
+import * as typeScriptParser from 'recast/parsers/typescript.js';
+
+import type { Context } from './context.js';
+import { additionsDebug } from './utils.js';
+
+const WEBPACK_CONFIG_PATH = '.config/webpack/webpack.config.ts';
+const RSPACK_CONFIG_PATH = '.config/rspack/rspack.config.ts';
+
+/**
+ * Type for a function that modifies a resolve object expression
+ * @param resolveObject - The AST node representing the resolve configuration
+ * @returns true if changes were made, false otherwise
+ */
+export type ResolveModifier = (resolveObject: recast.types.namedTypes.ObjectExpression) => boolean;
+
+/**
+ * Type for a function that modifies a module rules array
+ * @param moduleObject - The AST node representing the module configuration
+ * @returns true if changes were made, false otherwise
+ */
+export type ModuleRulesModifier = (moduleObject: recast.types.namedTypes.ObjectExpression) => boolean;
+
+/**
+ * Updates the bundler's resolve and module configuration.
+ *
+ * This utility handles both webpack and rspack configurations, preferring rspack when both exist.
+ *
+ * @param context - The codemod context
+ * @param resolveModifier - Optional function to modify the resolve configuration
+ * @param moduleRulesModifier - Optional function to modify the module rules configuration
+ */
+export function updateBundlerConfig(
+  context: Context,
+  resolveModifier?: ResolveModifier,
+  moduleRulesModifier?: ModuleRulesModifier
+): void {
+  if (!resolveModifier && !moduleRulesModifier) {
+    return;
+  }
+
+  // Try rspack config first (newer structure)
+  if (context.doesFileExist(RSPACK_CONFIG_PATH)) {
+    additionsDebug(`Found ${RSPACK_CONFIG_PATH}, updating bundler configuration...`);
+    const rspackContent = context.getFile(RSPACK_CONFIG_PATH);
+    if (rspackContent) {
+      try {
+        const ast = recast.parse(rspackContent, {
+          parser: typeScriptParser,
+        });
+
+        let hasChanges = false;
+
+        recast.visit(ast, {
+          visitObjectExpression(path) {
+            const { node } = path;
+            const properties = node.properties;
+
+            if (properties) {
+              for (const prop of properties) {
+                if (prop && (prop.type === 'Property' || prop.type === 'ObjectProperty')) {
+                  const key = 'key' in prop ? prop.key : null;
+                  const value = 'value' in prop ? prop.value : null;
+
+                  // Find the resolve property
+                  if (
+                    resolveModifier &&
+                    key &&
+                    key.type === 'Identifier' &&
+                    key.name === 'resolve' &&
+                    value &&
+                    value.type === 'ObjectExpression'
+                  ) {
+                    hasChanges = resolveModifier(value) || hasChanges;
+                  }
+
+                  // Find the module property
+                  if (
+                    moduleRulesModifier &&
+                    key &&
+                    key.type === 'Identifier' &&
+                    key.name === 'module' &&
+                    value &&
+                    value.type === 'ObjectExpression'
+                  ) {
+                    hasChanges = moduleRulesModifier(value) || hasChanges;
+                  }
+                }
+              }
+            }
+
+            return this.traverse(path);
+          },
+        });
+
+        if (hasChanges) {
+          const output = recast.print(ast, {
+            tabWidth: 2,
+            trailingComma: true,
+            lineTerminator: '\n',
+          });
+          context.updateFile(RSPACK_CONFIG_PATH, output.code);
+          additionsDebug(`Updated ${RSPACK_CONFIG_PATH}`);
+        }
+      } catch (error) {
+        additionsDebug(`Error updating ${RSPACK_CONFIG_PATH}:`, error);
+      }
+    }
+    return;
+  }
+
+  // Fall back to webpack config (legacy structure)
+  if (context.doesFileExist(WEBPACK_CONFIG_PATH)) {
+    additionsDebug(`Found ${WEBPACK_CONFIG_PATH}, updating bundler configuration...`);
+    const webpackContent = context.getFile(WEBPACK_CONFIG_PATH);
+    if (webpackContent) {
+      try {
+        const ast = recast.parse(webpackContent, {
+          parser: typeScriptParser,
+        });
+
+        let hasChanges = false;
+
+        recast.visit(ast, {
+          visitObjectExpression(path) {
+            const { node } = path;
+            const properties = node.properties;
+
+            if (properties) {
+              for (const prop of properties) {
+                if (prop && (prop.type === 'Property' || prop.type === 'ObjectProperty')) {
+                  const key = 'key' in prop ? prop.key : null;
+                  const value = 'value' in prop ? prop.value : null;
+
+                  // Find the resolve property
+                  if (
+                    resolveModifier &&
+                    key &&
+                    key.type === 'Identifier' &&
+                    key.name === 'resolve' &&
+                    value &&
+                    value.type === 'ObjectExpression'
+                  ) {
+                    hasChanges = resolveModifier(value) || hasChanges;
+                  }
+
+                  // Find the module property
+                  if (
+                    moduleRulesModifier &&
+                    key &&
+                    key.type === 'Identifier' &&
+                    key.name === 'module' &&
+                    value &&
+                    value.type === 'ObjectExpression'
+                  ) {
+                    hasChanges = moduleRulesModifier(value) || hasChanges;
+                  }
+                }
+              }
+            }
+
+            return this.traverse(path);
+          },
+        });
+
+        if (hasChanges) {
+          const output = recast.print(ast, {
+            tabWidth: 2,
+            trailingComma: true,
+            lineTerminator: '\n',
+          });
+          context.updateFile(WEBPACK_CONFIG_PATH, output.code);
+          additionsDebug(`Updated ${WEBPACK_CONFIG_PATH}`);
+        }
+      } catch (error) {
+        additionsDebug(`Error updating ${WEBPACK_CONFIG_PATH}:`, error);
+      }
+    }
+  }
+}

package/templates/common/.config/rspack/rspack.config.ts

@@ -21,7 +21,8 @@ import { externals } from '../bundler/externals';
 const { SubresourceIntegrityPlugin } = rspack.experiments;
 const pluginJson = getPluginJson();
 const cpVersion = getCPConfigVersion();
-
+const logoPaths = Array.from(new Set([pluginJson.info?.logos?.large, pluginJson.info?.logos?.small])).filter(Boolean);
+const screenshotPaths = pluginJson.info?.screenshots?.map((s: { path: string }) => s.path) || [];
 const virtualPublicPath = new RspackVirtualModulePlugin({
   'grafana-public-path': `
 import amdMetaModule from 'amd-module';
@@ -161,14 +162,13 @@ const config = async (env): Promise<Configuration> => {
           { from: 'plugin.json', to: '.' },
           { from: '../LICENSE', to: '.' },
           { from: '../CHANGELOG.md', to: '.', force: true },
-          { from: '**/*.json', to: '.' }, // TODO<Add an error for checking the basic structure of the repo>
-          { from: '**/*.svg', to: '.', noErrorOnMissing: true }, // Optional
-          { from: '**/*.png', to: '.', noErrorOnMissing: true }, // Optional
-          { from: '**/*.html', to: '.', noErrorOnMissing: true }, // Optional
-          { from: 'img/**/*', to: '.', noErrorOnMissing: true }, // Optional
-          { from: 'libs/**/*', to: '.', noErrorOnMissing: true }, // Optional
-          { from: 'static/**/*', to: '.', noErrorOnMissing: true }, // Optional
-          { from: '**/query_help.md', to: '.', noErrorOnMissing: true }, // Optional
+          { from: '**/*.json', to: '.' },
+          { from: '**/query_help.md', to: '.', noErrorOnMissing: true },
+          ...logoPaths.map((logoPath) => ({ from: logoPath, to: logoPath })),
+          ...screenshotPaths.map((screenshotPath) => ({
+            from: screenshotPath,
+            to: screenshotPath,
+          })),
         ],
       }),
       // Replace certain template-variables in the README and plugin.json

package/templates/common/.config/webpack/webpack.config.ts

@@ -24,7 +24,8 @@ import { externals } from '../bundler/externals.ts';
 const pluginJson = getPluginJson();
 const cpVersion = getCPConfigVersion();
 const pluginVersion = getPackageJson().version;
-
+const logoPaths = Array.from(new Set([pluginJson.info?.logos?.large, pluginJson.info?.logos?.small])).filter(Boolean);
+const screenshotPaths = pluginJson.info?.screenshots?.map((s: { path: string }) => s.path) || [];
 const virtualPublicPath = new VirtualModulesPlugin({
   'node_modules/grafana-public-path.js': `
 import amdMetaModule from 'amd-module';
@@ -174,13 +175,12 @@ const config = async (env: Env): Promise<Configuration> => {
           { from: '../LICENSE', to: '.' },
           { from: '../CHANGELOG.md', to: '.', force: true },
           { from: '**/*.json', to: '.' },
-          { from: '**/*.svg', to: '.', noErrorOnMissing: true },
-          { from: '**/*.png', to: '.', noErrorOnMissing: true },
-          { from: '**/*.html', to: '.', noErrorOnMissing: true },
-          { from: 'img/**/*', to: '.', noErrorOnMissing: true },
-          { from: 'libs/**/*', to: '.', noErrorOnMissing: true },
-          { from: 'static/**/*', to: '.', noErrorOnMissing: true },
           { from: '**/query_help.md', to: '.', noErrorOnMissing: true },
+          ...logoPaths.map((logoPath) => ({ from: logoPath, to: logoPath })),
+          ...screenshotPaths.map((screenshotPath) => ({
+            from: screenshotPath,
+            to: screenshotPath,
+          })),
         ],
       }),
       // Replace certain template-variables in the README and plugin.json