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

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

@@ -1,16 +1,21 @@
 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 { updateBundlerConfig } from '../../../utils.bundler-config.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";
+const schema = v.object({});
+function bundleGrafanaUI(context, _options) {
+  additionsDebug("Running bundle-grafana-ui addition...");
+  ensureMinGrafanaVersion(context);
+  updateExternalsArray(context, createBundleGrafanaUIModifier());
+  updateBundlerConfig(context, createResolveModifier(), createModuleRulesModifier());
+  return context;
+}
 function isGrafanaUiRegex(element) {
   if (element.type === "RegExpLiteral") {
     const regexNode = element;
@@ -33,7 +38,7 @@ function isGrafanaDataRegex(element) {
   }
   return false;
 }
-function modifyExternalsArray(externalsArray) {
+function removeGrafanaUiAndAddReactInlineSvg(externalsArray) {
   let hasChanges = false;
   let hasGrafanaUiExternal = false;
   let hasReactInlineSvg = false;
@@ -79,196 +84,109 @@ 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 createResolveModifier() {
+  return (resolveObject) => {
+    if (!resolveObject.properties) {
+      return false;
     }
-    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;
-                  }
-                }
-              }
+    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;
             }
-            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);
       }
     }
-  }
+    if (!hasMjsExtension && extensionsProperty && "value" in extensionsProperty) {
+      const extensionsArray = extensionsProperty.value;
+      extensionsArray.elements.push(builders.literal(".mjs"));
+      hasChanges = true;
+      additionsDebug("Added '.mjs' to resolve.extensions");
+    }
+    return hasChanges;
+  };
 }
-function updateModuleRules(moduleObject) {
-  if (!moduleObject.properties) {
-    return false;
-  }
-  let hasChanges = false;
-  let hasMjsRule = false;
-  let rulesProperty = null;
-  for (const prop of moduleObject.properties) {
-    if (!prop || prop.type !== "Property" && prop.type !== "ObjectProperty") {
-      continue;
+function createModuleRulesModifier() {
+  return (moduleObject) => {
+    if (!moduleObject.properties) {
+      return false;
     }
-    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;
+    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;
-    }
-  }
-  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;
-  }
-  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;
+          if (hasMjsRule) {
             break;
           }
         }
+        break;
       }
     }
-  }
-  if (!hasMjsExtension && extensionsProperty && "value" in extensionsProperty) {
-    const extensionsArray = extensionsProperty.value;
-    extensionsArray.elements.push(builders.literal(".mjs"));
-    hasChanges = true;
-    additionsDebug("Added '.mjs' to resolve.extensions");
-  }
-  return hasChanges;
+    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 ensureMinGrafanaVersion(context) {
   if (!context.doesFileExist(PLUGIN_JSON_PATH)) {
@@ -308,12 +226,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/dist/codemods/utils.bundler-config.js

@@ -0,0 +1,102 @@
+import * as recast from 'recast';
+import * as typeScriptParser from 'recast/parsers/typescript.js';
+import { additionsDebug } from './utils.js';
+
+const WEBPACK_CONFIG_PATH = ".config/webpack/webpack.config.ts";
+const RSPACK_CONFIG_PATH = ".config/rspack/rspack.config.ts";
+function updateBundlerConfig(context, resolveModifier, moduleRulesModifier) {
+  if (!resolveModifier && !moduleRulesModifier) {
+    return;
+  }
+  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;
+                  if (resolveModifier && key && key.type === "Identifier" && key.name === "resolve" && value && value.type === "ObjectExpression") {
+                    hasChanges = resolveModifier(value) || hasChanges;
+                  }
+                  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;
+  }
+  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;
+                  if (resolveModifier && key && key.type === "Identifier" && key.name === "resolve" && value && value.type === "ObjectExpression") {
+                    hasChanges = resolveModifier(value) || hasChanges;
+                  }
+                  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);
+      }
+    }
+  }
+}
+
+export { updateBundlerConfig };

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.20813734793.0",
   "repository": {
     "directory": "packages/create-plugin",
     "url": "https://github.com/grafana/plugin-tools"
@@ -55,5 +55,5 @@
   "engines": {
     "node": ">=20"
   },
-  "gitHead": "a1f3d6909efb7fabc801bc7cc221803fffe0cc2f"
+  "gitHead": "7dc0a04f78794e1d23d24b13fa2dfaa5a4312bc3"
 }

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

@@ -1,22 +1,34 @@
 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';
 import { additionsDebug } from '../../../utils.js';
+import { updateBundlerConfig, type ModuleRulesModifier, type ResolveModifier } from '../../../utils.bundler-config.js';
 import { updateExternalsArray, type ExternalsArrayModifier } from '../../../utils.externals.js';
 
 const { builders } = recast.types;
 
-export const schema = v.object({});
+const PLUGIN_JSON_PATH = 'src/plugin.json';
+const MIN_GRAFANA_VERSION = '10.2.0';
 
+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';
+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
+  updateBundlerConfig(context, createResolveModifier(), createModuleRulesModifier());
+
+  return context;
+}
 
 /**
  * Checks if an AST node is a regex matching @grafana/ui
@@ -58,7 +70,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;
@@ -128,302 +140,163 @@ 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
+ * Creates a modifier function for updateBundlerConfig that adds '.mjs' to resolve.extensions
  */
-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 createResolveModifier(): ResolveModifier {
+  return (resolveObject: recast.types.namedTypes.ObjectExpression): boolean => {
+    if (!resolveObject.properties) {
+      return false;
     }
-    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;
-                  }
+    let hasChanges = false;
+    let hasMjsExtension = false;
+    let extensionsProperty: recast.types.namedTypes.Property | null = null;
 
-                  // 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);
+    // Check current state
+    for (const prop of resolveObject.properties) {
+      if (!prop || (prop.type !== 'Property' && prop.type !== 'ObjectProperty')) {
+        continue;
       }
-    }
-  }
-}
 
-/**
- * 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;
-  }
+      const key = 'key' in prop ? prop.key : null;
+      const value = 'value' in prop ? prop.value : null;
 
-  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 (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 (
-              ruleProp &&
-              (ruleProp.type === 'Property' || ruleProp.type === 'ObjectProperty') &&
-              'key' in ruleProp &&
-              ruleProp.key.type === 'Identifier' &&
-              ruleProp.key.name === 'test'
+              element &&
+              (element.type === 'Literal' || element.type === 'StringLiteral') &&
+              'value' in element &&
+              element.value === '.mjs'
             ) {
-              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;
-                }
-              }
+              hasMjsExtension = true;
+              break;
             }
           }
         }
-        if (hasMjsRule) {
-          break;
-        }
       }
-      break;
     }
-  }
 
-  // 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');
-  }
+    // 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");
+    }
 
-  return hasChanges;
+    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
+ * Creates a modifier function for updateBundlerConfig that adds a module rule for .mjs files
+ * in node_modules with resolve.fullySpecified: false
  */
-function updateResolveObject(resolveObject: recast.types.namedTypes.ObjectExpression): boolean {
-  if (!resolveObject.properties) {
-    return false;
-  }
+function createModuleRulesModifier(): ModuleRulesModifier {
+  return (moduleObject: recast.types.namedTypes.ObjectExpression): boolean => {
+    if (!moduleObject.properties) {
+      return false;
+    }
 
-  let hasChanges = false;
-  let hasMjsExtension = false;
-  let extensionsProperty: recast.types.namedTypes.Property | null = null;
+    let hasChanges = false;
+    let hasMjsRule = false;
+    let rulesProperty: recast.types.namedTypes.Property | null = null;
 
-  // Check current state
-  for (const prop of resolveObject.properties) {
-    if (!prop || (prop.type !== 'Property' && prop.type !== 'ObjectProperty')) {
-      continue;
-    }
+    // 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;
+      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
+      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 === 'Literal' || element.type === 'StringLiteral') &&
-            'value' in element &&
-            element.value === '.mjs'
-          ) {
-            hasMjsExtension = true;
+          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 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");
-  }
+    // 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');
+    }
 
-  return hasChanges;
+    return hasChanges;
+  };
 }
 
 /**
@@ -471,18 +344,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);
+      }
+    }
+  }
+}