Frontend: use custom conditions for development and build (#111685)

* build(frontend): enable custom condition for resolving source files during dev and build

* feat(packages): apply conditional name to export properties

* chore(packages): add standard exports to flamegraph and prometheus

* chore(packages): resolve main, module, types to built files

* build(packages): clean up prepare-npm-package for custom condition changes

* refactor(packages): reduce repetition in conditional exports

* build(storybook): add @grafana-app/source to conditionNames

* test(frontend): add grafana-app/source customCondition for jest tests

* refactor(frontend): remove nested package import paths

* chore(jest): use customExportConditions for source files and browser

* chore(i18n): use src for ./eslint-plugin export

* chore(packages): set packages tsconfigs to moduleResolution bundler

* chore(packages): fix rollup builds

* build(packages): build cjs as multiple files

* chore(sql): reference MonitoringLogger for moduleresolution bundler to pass typecheck

* chore(ui): add type refs for moduleresolution bundler to pass typecheck

* feat(schema): add exports for cleaner import paths

* refactor(frontend): clean up schema paths to point to exports instead of nested file paths

* build(storybook): hack the builder-manager for custom conditions to resolve

* build(decoupled-plugins): fix broken builds due to missing conditionNames

* chore(e2e): pass condition to playwright to resolve local packages

* build(frontend): fix failing build

* chore(select): fix typings

* style(frontend): clean up eslint suppressions

* chore(packages): fix type errors due to incorrect tsconfig settings

* build(generate-apis): use swc with ts-node and moduleResolution bundler

* chore(cypress): add conditionNames to resolve monorepo packages

* build(npm): update prepare to work with latest exports changes

* build(packages): fix prepare-npm-package script

* fix(e2e-selectors): update debugoverlay for data-testid change

* build(packages): stop editing package.json at pack n publish time

* rerun ci

* chore(api-clients): use moduleResolution: bundler for customConditions support

* chore(api-clients): fix generation

* build(packages): remove aliasing exports, remove exports with only customConditions

* Revert "refactor(frontend): clean up schema paths to point to exports instead of nested file paths"

This reverts commit 7949b6ea0e.

* revert(schema): remove exports from package so builds work

* build(api-clients): fix up api-clients exports and rollup config

* build(api-clients): Update generated package exports for api clients

* build(schema): add overrides to cjsOutput and esmOutput so built directory structure is correct

* fix(packages): use rootDirs to prevent types/src directories in built d.ts file paths

* build(packages): prevent empty exports added to package.json during pack

* docs(packages): update readme with custom conditions information

---------

Co-authored-by: Tom Ratcliffe <tom.ratcliffe@grafana.com>

.yarn/patches/@storybook-core-npm-8.6.2-8c752112c0.patch

@@ -0,0 +1,13 @@
+diff --git a/dist/builder-manager/index.js b/dist/builder-manager/index.js
+index 3d7f9b213dae1801bda62b31db31b9113e382ccd..212501c63d20146c29db63fb0f6300c6779eecb5 100644
+--- a/dist/builder-manager/index.js
++++ b/dist/builder-manager/index.js
+@@ -1970,7 +1970,7 @@ var pa = /^\/($|\?)/, G, C, xt = /* @__PURE__ */ o(async (e) => {
+     bundle: !0,
+     minify: !0,
+     sourcemap: !1,
+-    conditions: ["browser", "module", "default"],
++    conditions: ["@grafana-app/source", "browser", "module", "default"],
+     jsxFactory: "React.createElement",
+     jsxFragment: "React.Fragment",
+     jsx: "transform",

e2e/cypress/plugins/typescriptPreprocessor.js

@@ -18,6 +18,7 @@ const webpackOptions = {
   },
   resolve: {
     extensions: ['.ts', '.js'],
+    conditionNames: ['@grafana-app/source', '...'],
   },
 };
 

eslint-suppressions.json

@@ -4246,9 +4246,6 @@
     }
   },
   "public/app/plugins/panel/geomap/components/DebugOverlay.tsx": {
-    "@grafana/no-aria-label-selectors": {
-      "count": 1
-    },
     "react-prefer-function-component/react-prefer-function-component": {
       "count": 1
     }

jest.config.js

@@ -40,6 +40,9 @@ const esModules = [
 module.exports = {
   verbose: false,
   testEnvironment: 'jsdom',
+  testEnvironmentOptions: {
+    customExportConditions: ['@grafana-app/source', 'browser'],
+  },
   transform: {
     '^.+\\.(ts|tsx|js|jsx)$': [require.resolve('ts-jest')],
   },

package.json

@@ -26,10 +26,10 @@
     "e2e:enterprise": "./e2e/start-and-run-suite enterprise",
     "e2e:enterprise:dev": "./e2e/start-and-run-suite enterprise dev",
     "e2e:enterprise:debug": "./e2e/start-and-run-suite enterprise debug",
-    "e2e:playwright": "yarn playwright test --grep-invert @cloud-plugins",
-    "e2e:playwright:cloud-plugins": "yarn playwright test --grep @cloud-plugins",
-    "e2e:playwright:storybook": "yarn playwright test -c playwright.storybook.config.ts",
-    "e2e:acceptance": "yarn playwright test --grep @acceptance",
+    "e2e:playwright": "NODE_OPTIONS='-C @grafana-app/source' yarn playwright test --grep-invert @cloud-plugins",
+    "e2e:playwright:cloud-plugins": "NODE_OPTIONS='-C @grafana-app/source' yarn playwright test --grep @cloud-plugins",
+    "e2e:playwright:storybook": "NODE_OPTIONS='-C @grafana-app/source' yarn playwright test -c playwright.storybook.config.ts",
+    "e2e:acceptance": "NODE_OPTIONS='-C @grafana-app/source' yarn playwright test --grep @acceptance",
     "e2e:storybook": "PORT=9001 ./e2e/run-suite storybook true",
     "e2e:plugin:build": "nx run-many -t build --projects='@test-plugins/*'",
     "e2e:plugin:build:dev": "nx run-many -t dev --projects='@test-plugins/*' --maxParallel=100",
@@ -63,7 +63,7 @@
     "storybook": "yarn workspace @grafana/ui storybook --ci",
     "storybook:build": "yarn workspace @grafana/ui storybook:build",
     "themes-schema": "typescript-json-schema ./tsconfig.json NewThemeOptions --include 'packages/grafana-data/src/themes/createTheme.ts' --out public/app/features/theme-playground/schema.generated.json",
-    "themes-generate": "yarn themes-schema && esbuild --target=es6 ./scripts/cli/generateSassVariableFiles.ts --bundle --platform=node --tsconfig=./scripts/cli/tsconfig.json | node",
+    "themes-generate": "yarn themes-schema && esbuild --target=es6 ./scripts/cli/generateSassVariableFiles.ts --bundle --conditions=@grafana-app/source --platform=node --tsconfig=./scripts/cli/tsconfig.json | node",
     "themes:usage": "eslint . --ignore-pattern '*.test.ts*' --ignore-pattern '*.spec.ts*' --cache --plugin '@grafana' --rule '{ @grafana/theme-token-usage: \"error\" }'",
     "typecheck": "tsc --noEmit && yarn run packages:typecheck",
     "plugins:build-bundled": "echo 'bundled plugins are no longer supported'",
@@ -460,7 +460,8 @@
     "tmp@npm:^0.0.33": "~0.2.1",
     "js-yaml@npm:4.1.0": "^4.1.0",
     "js-yaml@npm:=4.1.0": "^4.1.0",
-    "nodemailer": "7.0.7"
+    "nodemailer": "7.0.7",
+    "@storybook/core@npm:8.6.2": "patch:@storybook/core@npm%3A8.6.2#~/.yarn/patches/@storybook-core-npm-8.6.2-8c752112c0.patch"
   },
   "workspaces": {
     "packages": [

packages/README.md

@@ -2,13 +2,32 @@
 
 ## Exporting code conventions
 
-`@grafana/ui`, `@grafana/data` and `@grafana/runtime` makes use of `exports` in package.json to define three entrypoints that Grafana core and Grafana plugins can access. Before exposing anything in these packages please consider the table below to better understand the use case of each export.
+All the `@grafana` packages in this repo (except `@grafana/schema`) make use of `exports` in package.json to define entrypoints that Grafana core and Grafana plugins can access. Exports can also be used to restrict access to internal files in packages.
 
-| Export Name  | Import Path            | Description                                                                                                                                                                     | Available to Grafana | Available to plugins |
-| ------------ | ---------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------- | -------------------- |
-| `./`         | `@grafana/ui`          | The public API entrypoint. If the code is stable and you want to share it everywhere, this is the place to export it.                                                           | ✅                   | ✅                   |
-| `./unstable` | `@grafana/ui/unstable` | The public API entrypoint for all experimental code. If you want to iterate and test code from Grafana and plugins, this is the place to export it.                             | ✅                   | ✅                   |
-| `./internal` | `@grafana/ui/internal` | The private API entrypoint for internal code shared with Grafana. If you need to import code in Grafana but don't want to expose it to plugins, this is the place to export it. | ✅                   | ❌                   |
+Package authors are free to create as many exports as they like but should consider the following points:
+
+1. Resolution of source code within this repo is handled by the [customCondition](https://www.typescriptlang.org/tsconfig/#customConditions) `@grafana-app/source`. This allows the frontend tooling in this repo to resolve to the source code preventing the need to build all the packages up front. When adding exports it is important to add an entry for the custom condition as the first item. All other entries should point to the built, bundled files. For example:
+
+   ```json
+   "exports": {
+     ".": {
+       "@grafana-app/source": "./src/index.ts",
+       "types": "./dist/types/index.d.ts",
+       "import": "./dist/esm/index.mjs",
+       "require": "./dist/cjs/index.cjs"
+     }
+   }
+   ```
+
+2. If you add exports to your package you must export the `package.json` file.
+
+3. Before exposing anything in these packages please consider the table below to better understand the conventions we have put in place for most of the packages in this repository.
+
+| Export Name  | Import Path            | Description                                                                                                                                                                                                           | Available to Grafana | Available to plugins |
+| ------------ | ---------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------- | -------------------- |
+| `./`         | `@grafana/ui`          | The public API entrypoint. If the code is stable and you want to share it everywhere, this is the place to export it.                                                                                                 | ✅                   | ✅                   |
+| `./unstable` | `@grafana/ui/unstable` | The public API entrypoint for all experimental code. If you want to iterate and test code from Grafana and plugins, this is the place to export it.                                                                   | ✅                   | ✅                   |
+| `./internal` | `@grafana/ui/internal` | The private API entrypoint for internal code shared with Grafana. If you want to co-locate code in a package with it's public API but only want the Grafana application to access it, this is the place to export it. | ✅                   | ❌                   |
 
 ## Versioning
 

packages/grafana-alerting/package.json

@@ -17,32 +17,34 @@
     "url": "http://github.com/grafana/grafana.git",
     "directory": "packages/grafana-alerting"
   },
-  "main": "src/index.ts",
-  "types": "src/index.ts",
-  "module": "src/index.ts",
+  "main": "./dist/cjs/index.cjs",
+  "module": "./dist/esm/index.mjs",
+  "types": "./dist/types/index.d.ts",
   "exports": {
     "./package.json": "./package.json",
     ".": {
-      "import": "./src/index.ts",
-      "require": "./src/index.ts"
-    },
-    "./internal": {
-      "import": "./src/internal.ts",
-      "require": "./src/internal.ts"
+      "@grafana-app/source": "./src/index.ts",
+      "types": "./dist/types/index.d.ts",
+      "import": "./dist/esm/index.mjs",
+      "require": "./dist/cjs/index.cjs"
     },
     "./unstable": {
-      "import": "./src/unstable.ts",
-      "require": "./src/unstable.ts"
+      "@grafana-app/source": "./src/unstable.ts",
+      "types": "./dist/types/unstable.d.ts",
+      "import": "./dist/esm/unstable.mjs",
+      "require": "./dist/cjs/unstable.cjs"
+    },
+    "./internal": {
+      "@grafana-app/source": "./src/internal.ts"
     },
     "./testing": {
-      "import": "./src/testing.ts",
-      "require": "./src/testing.ts"
+      "@grafana-app/source": "./src/testing.ts",
+      "types": "./dist/types/testing.d.ts",
+      "import": "./dist/esm/testing.mjs",
+      "require": "./dist/cjs/testing.cjs"
     }
   },
   "publishConfig": {
-    "main": "./dist/cjs/index.cjs",
-    "module": "./dist/esm/index.mjs",
-    "types": "./dist/types/index.d.ts",
     "access": "public"
   },
   "files": [
@@ -57,8 +59,8 @@
     "clean": "rimraf ./dist ./compiled ./unstable ./testing ./package.tgz",
     "typecheck": "tsc --emitDeclarationOnly false --noEmit",
     "codegen": "rtk-query-codegen-openapi ./scripts/codegen.ts",
-    "prepack": "cp package.json package.json.bak && ALIAS_PACKAGE_NAME=testing,unstable node ../../scripts/prepare-npm-package.js",
-    "postpack": "mv package.json.bak package.json && rimraf ./unstable ./testing",
+    "prepack": "cp package.json package.json.bak && node ../../scripts/prepare-npm-package.js",
+    "postpack": "mv package.json.bak package.json",
     "i18n-extract": "i18next-cli extract --sync-primary"
   },
   "devDependencies": {

packages/grafana-alerting/rollup.config.ts

@@ -9,19 +9,19 @@ export default [
   {
     input: entryPoint,
     plugins,
-    output: [cjsOutput(pkg), esmOutput(pkg, 'grafana-alerting')],
+    output: [cjsOutput(pkg, 'grafana-alerting'), esmOutput(pkg, 'grafana-alerting')],
     treeshake: false,
   },
   {
     input: 'src/unstable.ts',
     plugins,
-    output: [cjsOutput(pkg), esmOutput(pkg, 'grafana-alerting')],
+    output: [cjsOutput(pkg, 'grafana-alerting'), esmOutput(pkg, 'grafana-alerting')],
     treeshake: false,
   },
   {
     input: 'src/testing.ts',
     plugins,
-    output: [cjsOutput(pkg), esmOutput(pkg, 'grafana-alerting')],
+    output: [cjsOutput(pkg, 'grafana-alerting'), esmOutput(pkg, 'grafana-alerting')],
     treeshake: false,
   },
 ];

packages/grafana-api-clients/package.json

@@ -15,88 +15,121 @@
     "url": "https://github.com/grafana/grafana.git",
     "directory": "packages/grafana-api-clients"
   },
-  "main": "src/index.ts",
-  "module": "src/index.ts",
-  "types": "src/index.ts",
+  "main": "./dist/cjs/index.cjs",
+  "module": "./dist/esm/index.mjs",
+  "types": "./dist/types/index.d.ts",
   "exports": {
     "./package.json": "./package.json",
     ".": {
-      "import": "./src/index.ts",
-      "require": "./src/index.ts"
+      "@grafana-app/source": "./src/index.ts",
+      "types": "./dist/types/index.d.ts",
+      "import": "./dist/esm/index.mjs",
+      "require": "./dist/cjs/index.cjs"
     },
     "./rtkq": {
-      "import": "./src/clients/rtkq/index.ts",
-      "require": "./src/clients/rtkq/index.ts"
+      "@grafana-app/source": "./src/clients/rtkq/index.ts",
+      "types": "./dist/types/clients/rtkq/index.d.ts",
+      "import": "./dist/esm/clients/rtkq/index.mjs",
+      "require": "./dist/cjs/clients/rtkq/index.cjs"
     },
     "./rtkq/advisor/v0alpha1": {
-      "import": "./src/clients/rtkq/advisor/v0alpha1/index.ts",
-      "require": "./src/clients/rtkq/advisor/v0alpha1/index.ts"
-    },
-    "./rtkq/correlations/v0alpha1": {
-      "import": "./src/clients/rtkq/correlations/v0alpha1/index.ts",
-      "require": "./src/clients/rtkq/correlations/v0alpha1/index.ts"
-    },
-    "./rtkq/dashboard/v0alpha1": {
-      "import": "./src/clients/rtkq/dashboard/v0alpha1/index.ts",
-      "require": "./src/clients/rtkq/dashboard/v0alpha1/index.ts"
-    },
-    "./rtkq/folder/v1beta1": {
-      "import": "./src/clients/rtkq/folder/v1beta1/index.ts",
-      "require": "./src/clients/rtkq/folder/v1beta1/index.ts"
-    },
-    "./rtkq/iam/v0alpha1": {
-      "import": "./src/clients/rtkq/iam/v0alpha1/index.ts",
-      "require": "./src/clients/rtkq/iam/v0alpha1/index.ts"
-    },
-    "./rtkq/legacy": {
-      "import": "./src/clients/rtkq/legacy/index.ts",
-      "require": "./src/clients/rtkq/legacy/index.ts"
-    },
-    "./rtkq/legacy/migrate-to-cloud": {
-      "import": "./src/clients/rtkq/migrate-to-cloud/index.ts",
-      "require": "./src/clients/rtkq/migrate-to-cloud/index.ts"
-    },
-    "./rtkq/legacy/preferences": {
-      "import": "./src/clients/rtkq/preferences/user/index.ts",
-      "require": "./src/clients/rtkq/preferences/user/index.ts"
-    },
-    "./rtkq/legacy/user": {
-      "import": "./src/clients/rtkq/user/index.ts",
-      "require": "./src/clients/rtkq/user/index.ts"
-    },
-    "./rtkq/playlist/v0alpha1": {
-      "import": "./src/clients/rtkq/playlist/v0alpha1/index.ts",
-      "require": "./src/clients/rtkq/playlist/v0alpha1/index.ts"
-    },
-    "./rtkq/preferences/v1alpha1": {
-      "import": "./src/clients/rtkq/preferences/v1alpha1/index.ts",
-      "require": "./src/clients/rtkq/preferences/v1alpha1/index.ts"
+      "@grafana-app/source": "./src/clients/rtkq/advisor/v0alpha1/index.ts",
+      "types": "./dist/types/clients/rtkq/advisor/v0alpha1/index.d.ts",
+      "import": "./dist/esm/clients/rtkq/advisor/v0alpha1/index.mjs",
+      "require": "./dist/cjs/clients/rtkq/advisor/v0alpha1/index.cjs"
     },
     "./rtkq/collections/v1alpha1": {
-      "import": "./src/clients/rtkq/collections/v1alpha1/index.ts",
-      "require": "./src/clients/rtkq/collections/v1alpha1/index.ts"
+      "@grafana-app/source": "./src/clients/rtkq/collections/v1alpha1/index.ts",
+      "types": "./dist/types/clients/rtkq/collections/v1alpha1/index.d.ts",
+      "import": "./dist/esm/clients/rtkq/collections/v1alpha1/index.mjs",
+      "require": "./dist/cjs/clients/rtkq/collections/v1alpha1/index.cjs"
+    },
+    "./rtkq/correlations/v0alpha1": {
+      "@grafana-app/source": "./src/clients/rtkq/correlations/v0alpha1/index.ts",
+      "types": "./dist/types/clients/rtkq/correlations/v0alpha1/index.d.ts",
+      "import": "./dist/esm/clients/rtkq/correlations/v0alpha1/index.mjs",
+      "require": "./dist/cjs/clients/rtkq/correlations/v0alpha1/index.cjs"
+    },
+    "./rtkq/dashboard/v0alpha1": {
+      "@grafana-app/source": "./src/clients/rtkq/dashboard/v0alpha1/index.ts",
+      "types": "./dist/types/clients/rtkq/dashboard/v0alpha1/index.d.ts",
+      "import": "./dist/esm/clients/rtkq/dashboard/v0alpha1/index.mjs",
+      "require": "./dist/cjs/clients/rtkq/dashboard/v0alpha1/index.cjs"
+    },
+    "./rtkq/folder/v1beta1": {
+      "@grafana-app/source": "./src/clients/rtkq/folder/v1beta1/index.ts",
+      "types": "./dist/types/clients/rtkq/folder/v1beta1/index.d.ts",
+      "import": "./dist/esm/clients/rtkq/folder/v1beta1/index.mjs",
+      "require": "./dist/cjs/clients/rtkq/folder/v1beta1/index.cjs"
+    },
+    "./rtkq/iam/v0alpha1": {
+      "@grafana-app/source": "./src/clients/rtkq/iam/v0alpha1/index.ts",
+      "types": "./dist/types/clients/rtkq/iam/v0alpha1/index.d.ts",
+      "import": "./dist/esm/clients/rtkq/iam/v0alpha1/index.mjs",
+      "require": "./dist/cjs/clients/rtkq/iam/v0alpha1/index.cjs"
+    },
+    "./rtkq/legacy": {
+      "@grafana-app/source": "./src/clients/rtkq/legacy/index.ts",
+      "types": "./dist/types/clients/rtkq/legacy/index.d.ts",
+      "import": "./dist/esm/clients/rtkq/legacy/index.mjs",
+      "require": "./dist/cjs/clients/rtkq/legacy/index.cjs"
+    },
+    "./rtkq/legacy/migrate-to-cloud": {
+      "@grafana-app/source": "./src/clients/rtkq/migrate-to-cloud/index.ts",
+      "types": "./dist/types/clients/rtkq/migrate-to-cloud/index.d.ts",
+      "import": "./dist/esm/clients/rtkq/migrate-to-cloud/index.mjs",
+      "require": "./dist/cjs/clients/rtkq/migrate-to-cloud/index.cjs"
+    },
+    "./rtkq/legacy/preferences": {
+      "@grafana-app/source": "./src/clients/rtkq/preferences/user/index.ts",
+      "types": "./dist/types/clients/rtkq/preferences/user/index.d.ts",
+      "import": "./dist/esm/clients/rtkq/preferences/user/index.mjs",
+      "require": "./dist/cjs/clients/rtkq/preferences/user/index.cjs"
+    },
+    "./rtkq/legacy/user": {
+      "@grafana-app/source": "./src/clients/rtkq/user/index.ts",
+      "types": "./dist/types/clients/rtkq/user/index.d.ts",
+      "import": "./dist/esm/clients/rtkq/user/index.mjs",
+      "require": "./dist/cjs/clients/rtkq/user/index.cjs"
+    },
+    "./rtkq/playlist/v0alpha1": {
+      "@grafana-app/source": "./src/clients/rtkq/playlist/v0alpha1/index.ts",
+      "types": "./dist/types/clients/rtkq/playlist/v0alpha1/index.d.ts",
+      "import": "./dist/esm/clients/rtkq/playlist/v0alpha1/index.mjs",
+      "require": "./dist/cjs/clients/rtkq/playlist/v0alpha1/index.cjs"
+    },
+    "./rtkq/preferences/v1alpha1": {
+      "@grafana-app/source": "./src/clients/rtkq/preferences/v1alpha1/index.ts",
+      "types": "./dist/types/clients/rtkq/preferences/v1alpha1/index.d.ts",
+      "import": "./dist/esm/clients/rtkq/preferences/v1alpha1/index.mjs",
+      "require": "./dist/cjs/clients/rtkq/preferences/v1alpha1/index.cjs"
     },
     "./rtkq/provisioning/v0alpha1": {
-      "import": "./src/clients/rtkq/provisioning/v0alpha1/index.ts",
-      "require": "./src/clients/rtkq/provisioning/v0alpha1/index.ts"
+      "@grafana-app/source": "./src/clients/rtkq/provisioning/v0alpha1/index.ts",
+      "types": "./dist/types/clients/rtkq/provisioning/v0alpha1/index.d.ts",
+      "import": "./dist/esm/clients/rtkq/provisioning/v0alpha1/index.mjs",
+      "require": "./dist/cjs/clients/rtkq/provisioning/v0alpha1/index.cjs"
     },
     "./rtkq/shorturl/v1beta1": {
-      "import": "./src/clients/rtkq/shorturl/v1beta1/index.ts",
-      "require": "./src/clients/rtkq/shorturl/v1beta1/index.ts"
+      "@grafana-app/source": "./src/clients/rtkq/shorturl/v1beta1/index.ts",
+      "types": "./dist/types/clients/rtkq/shorturl/v1beta1/index.d.ts",
+      "import": "./dist/esm/clients/rtkq/shorturl/v1beta1/index.mjs",
+      "require": "./dist/cjs/clients/rtkq/shorturl/v1beta1/index.cjs"
     },
     "./rtkq/historian.alerting/v0alpha1": {
-      "import": "./src/clients/rtkq/historian.alerting/v0alpha1/index.ts",
-      "require": "./src/clients/rtkq/historian.alerting/v0alpha1/index.ts"
+      "@grafana-app/source": "./src/clients/rtkq/historian.alerting/v0alpha1/index.ts",
+      "types": "./dist/types/clients/rtkq/historian.alerting/v0alpha1/index.d.ts",
+      "import": "./dist/esm/clients/rtkq/historian.alerting/v0alpha1/index.mjs",
+      "require": "./dist/cjs/clients/rtkq/historian.alerting/v0alpha1/index.cjs"
     },
     "./rtkq/logsdrilldown/v1alpha1": {
-      "import": "./src/clients/rtkq/logsdrilldown/v1alpha1/index.ts",
-      "require": "./src/clients/rtkq/logsdrilldown/v1alpha1/index.ts"
+      "@grafana-app/source": "./src/clients/rtkq/logsdrilldown/v1alpha1/index.ts",
+      "types": "./dist/types/clients/rtkq/logsdrilldown/v1alpha1/index.d.ts",
+      "import": "./dist/esm/clients/rtkq/logsdrilldown/v1alpha1/index.mjs",
+      "require": "./dist/cjs/clients/rtkq/logsdrilldown/v1alpha1/index.cjs"
     }
   },
   "publishConfig": {
-    "main": "./dist/cjs/index.cjs",
-    "module": "./dist/esm/index.mjs",
-    "types": "./dist/types/index.d.ts",
     "access": "public"
   },
   "files": [

packages/grafana-api-clients/rollup.config.ts

@@ -5,35 +5,17 @@ import { cjsOutput, entryPoint, esmOutput, plugins } from '../rollup.config.part
 const rq = createRequire(import.meta.url);
 const pkg = rq('./package.json');
 
-const apiClients = Object.entries<{ import: string; require: string }>(pkg.exports).filter(([key]) =>
-  key.startsWith('./rtkq/')
-);
-
-const apiClientConfigs = apiClients.map(([name, { import: importPath }]) => {
-  const baseCjsOutput = cjsOutput(pkg);
-  const entryFileNames = name.replace('./', '') + '.cjs';
-  const cjsOutputConfig = { ...baseCjsOutput, entryFileNames };
-  return {
-    input: importPath.replace('./', ''),
-
-    plugins,
-    output: [cjsOutputConfig, esmOutput(pkg, 'grafana-api-clients')],
-    treeshake: false,
-  };
-});
-
 export default [
   {
     input: entryPoint,
     plugins,
-    output: [cjsOutput(pkg), esmOutput(pkg, 'grafana-api-clients')],
+    output: [cjsOutput(pkg, 'grafana-api-clients'), esmOutput(pkg, 'grafana-api-clients')],
     treeshake: false,
   },
   {
     input: 'src/clients/rtkq/index.ts',
     plugins,
-    output: [cjsOutput(pkg), esmOutput(pkg, 'grafana-api-clients')],
+    output: [cjsOutput(pkg, 'grafana-api-clients'), esmOutput(pkg, 'grafana-api-clients')],
     treeshake: false,
   },
-  ...apiClientConfigs,
 ];

packages/grafana-api-clients/src/generator/helpers.ts

@@ -143,8 +143,10 @@ export const updatePackageJsonExports =
       // Create the new export entry
       const newExportKey = `./rtkq/${groupName}/${version}`;
       const newExportValue = {
-        import: `./src/clients/rtkq/${groupName}/${version}/index.ts`,
-        require: `./src/clients/rtkq/${groupName}/${version}/index.ts`,
+        '@grafana-app/source': `./src/clients/rtkq/${groupName}/${version}/index.ts`,
+        types: `./dist/types/clients/rtkq/${groupName}/${version}/index.d.ts`,
+        import: `./dist/esm/clients/rtkq/${groupName}/${version}/index.mjs`,
+        require: `./dist/cjs/clients/rtkq/${groupName}/${version}/index.cjs`,
       };
 
       // Check if export already exists

packages/grafana-api-clients/tsconfig.json

@@ -8,7 +8,8 @@
     "emitDeclarationOnly": true,
     "isolatedModules": true,
     "rootDirs": ["."],
-    "allowImportingTsExtensions": true
+    "allowImportingTsExtensions": true,
+    "moduleResolution": "bundler"
   },
   "exclude": ["dist/**/*"],
   "include": [
@@ -17,5 +18,12 @@
     "../grafana-ui/src/types/*.d.ts",
     "../grafana-i18n/src/types/*.d.ts",
     "src/**/*.ts*"
-  ]
+  ],
+  "ts-node": {
+    "swc": true,
+    "compilerOptions": {
+      "module": "es2020",
+      "moduleResolution": "Bundler"
+    }
+  }
 }

packages/grafana-data/package.json

@@ -13,32 +13,31 @@
     "url": "http://github.com/grafana/grafana.git",
     "directory": "packages/grafana-data"
   },
-  "main": "src/index.ts",
-  "types": "src/index.ts",
-  "module": "src/index.ts",
+  "main": "./dist/cjs/index.cjs",
+  "module": "./dist/esm/index.mjs",
+  "types": "./dist/types/index.d.ts",
   "exports": {
     "./package.json": "./package.json",
     ".": {
-      "import": "./src/index.ts",
-      "require": "./src/index.ts"
-    },
-    "./internal": {
-      "import": "./src/internal/index.ts",
-      "require": "./src/internal/index.ts"
+      "@grafana-app/source": "./src/index.ts",
+      "types": "./dist/types/index.d.ts",
+      "import": "./dist/esm/index.mjs",
+      "require": "./dist/cjs/index.cjs"
     },
     "./unstable": {
-      "import": "./src/unstable.ts",
-      "require": "./src/unstable.ts"
+      "@grafana-app/source": "./src/unstable.ts",
+      "types": "./dist/types/unstable.d.ts",
+      "import": "./dist/esm/unstable.mjs",
+      "require": "./dist/cjs/unstable.cjs"
+    },
+    "./internal": {
+      "@grafana-app/source": "./src/internal/index.ts"
     },
     "./test": {
-      "import": "./test/index.ts",
-      "require": "./test/index.ts"
+      "@grafana-app/source": "./test/index.ts"
     }
   },
   "publishConfig": {
-    "main": "./dist/cjs/index.cjs",
-    "module": "./dist/esm/index.mjs",
-    "types": "./dist/types/index.d.ts",
     "access": "public"
   },
   "files": [
@@ -51,8 +50,8 @@
     "build": "tsc -p ./tsconfig.build.json && rollup -c rollup.config.ts --configPlugin esbuild",
     "clean": "rimraf ./dist ./compiled ./unstable ./package.tgz",
     "typecheck": "tsc --emitDeclarationOnly false --noEmit",
-    "prepack": "cp package.json package.json.bak && ALIAS_PACKAGE_NAME=unstable node ../../scripts/prepare-npm-package.js",
-    "postpack": "mv package.json.bak package.json && rimraf ./unstable"
+    "prepack": "cp package.json package.json.bak && node ../../scripts/prepare-npm-package.js",
+    "postpack": "mv package.json.bak package.json"
   },
   "dependencies": {
     "@braintree/sanitize-url": "7.0.1",

packages/grafana-data/rollup.config.ts

@@ -9,13 +9,13 @@ export default [
   {
     input: entryPoint,
     plugins,
-    output: [cjsOutput(pkg), esmOutput(pkg, 'grafana-data')],
+    output: [cjsOutput(pkg, 'grafana-data'), esmOutput(pkg, 'grafana-data')],
     treeshake: false,
   },
   {
     input: 'src/unstable.ts',
     plugins,
-    output: [cjsOutput(pkg), esmOutput(pkg, 'grafana-data')],
+    output: [cjsOutput(pkg, 'grafana-data'), esmOutput(pkg, 'grafana-data')],
     treeshake: false,
   },
 ];

packages/grafana-data/tsconfig.json

@@ -3,10 +3,12 @@
   "compilerOptions": {
     "declaration": true,
     "jsx": "react-jsx",
+    "baseUrl": "./",
     "declarationDir": "./dist/types",
     "emitDeclarationOnly": true,
     "isolatedModules": true,
-    "rootDirs": ["."]
+    "rootDirs": ["."],
+    "moduleResolution": "bundler"
   },
   "exclude": ["dist/**/*"],
   "include": [

packages/grafana-e2e-selectors/package.json

@@ -16,12 +16,19 @@
     "url": "http://github.com/grafana/grafana.git",
     "directory": "packages/grafana-e2e-selectors"
   },
-  "main": "src/index.ts",
-  "types": "src/index.ts",
+  "main": "./dist/cjs/index.cjs",
+  "module": "./dist/esm/index.mjs",
+  "types": "./dist/types/index.d.ts",
+  "exports": {
+    "./package.json": "./package.json",
+    ".": {
+      "@grafana-app/source": "./src/index.ts",
+      "types": "./dist/types/index.d.ts",
+      "import": "./dist/esm/index.mjs",
+      "require": "./dist/cjs/index.cjs"
+    }
+  },
   "publishConfig": {
-    "main": "./dist/cjs/index.cjs",
-    "module": "./dist/esm/index.mjs",
-    "types": "./dist/types/index.d.ts",
     "access": "public"
   },
   "files": [

packages/grafana-e2e-selectors/rollup.config.ts

@@ -9,7 +9,7 @@ export default [
   {
     input: entryPoint,
     plugins,
-    output: [cjsOutput(pkg), esmOutput(pkg, 'grafana-e2e-selectors')],
+    output: [cjsOutput(pkg, 'grafana-e2e-selectors'), esmOutput(pkg, 'grafana-e2e-selectors')],
     treeshake: false,
   },
 ];

packages/grafana-e2e-selectors/src/selectors/components.ts

@@ -1332,6 +1332,7 @@ export const versionedComponents = {
   },
   DebugOverlay: {
     wrapper: {
+      '12.3.0': 'data-testid debug-overlay-wrapper',
       '9.2.0': 'debug-overlay',
     },
   },

packages/grafana-e2e-selectors/tsconfig.json

@@ -5,7 +5,8 @@
     "declarationDir": "./dist/types",
     "emitDeclarationOnly": true,
     "isolatedModules": true,
-    "rootDirs": ["."]
+    "rootDirs": ["."],
+    "moduleResolution": "bundler"
   },
   "exclude": ["dist/**/*"],
   "include": ["src/**/*.ts"]

packages/grafana-flamegraph/package.json

@@ -16,12 +16,19 @@
     "url": "http://github.com/grafana/grafana.git",
     "directory": "packages/grafana-flamegraph"
   },
-  "main": "src/index.ts",
-  "types": "src/index.ts",
+  "main": "./dist/cjs/index.cjs",
+  "module": "./dist/esm/index.mjs",
+  "types": "./dist/types/index.d.ts",
+  "exports": {
+    "./package.json": "./package.json",
+    ".": {
+      "@grafana-app/source": "./src/index.ts",
+      "types": "./dist/types/index.d.ts",
+      "import": "./dist/esm/index.mjs",
+      "require": "./dist/cjs/index.cjs"
+    }
+  },
   "publishConfig": {
-    "main": "./dist/cjs/index.cjs",
-    "module": "./dist/esm/index.mjs",
-    "types": "./dist/types/index.d.ts",
     "access": "public"
   },
   "files": [

packages/grafana-flamegraph/rollup.config.ts

@@ -9,7 +9,7 @@ export default [
   {
     input: entryPoint,
     plugins,
-    output: [cjsOutput(pkg), esmOutput(pkg, 'grafana-flamegraph')],
+    output: [cjsOutput(pkg, 'grafana-flamegraph'), esmOutput(pkg, 'grafana-flamegraph')],
     treeshake: false,
   },
 ];

packages/grafana-flamegraph/tsconfig.json

@@ -7,7 +7,8 @@
     "declarationDir": "./dist/types",
     "emitDeclarationOnly": true,
     "isolatedModules": true,
-    "rootDirs": ["."]
+    "rootDirs": ["."],
+    "moduleResolution": "bundler"
   },
   "exclude": ["dist/**/*"],
   "include": ["src/**/*.ts*", "../../public/app/types/*.d.ts", "../grafana-ui/src/types/*.d.ts"]

packages/grafana-i18n/package.json

@@ -14,33 +14,32 @@
     "url": "http://github.com/grafana/grafana.git",
     "directory": "packages/grafana-i18n"
   },
-  "main": "src/index.ts",
-  "types": "src/index.ts",
-  "module": "src/index.ts",
+  "main": "./dist/cjs/index.cjs",
+  "module": "./dist/esm/index.mjs",
+  "types": "./dist/types/index.d.ts",
   "exports": {
     "./package.json": "./package.json",
     ".": {
-      "import": "./src/index.ts",
-      "require": "./src/index.ts"
+      "@grafana-app/source": "./src/index.ts",
+      "types": "./dist/types/index.d.ts",
+      "import": "./dist/esm/index.mjs",
+      "require": "./dist/cjs/index.cjs"
     },
     "./internal": {
-      "import": "./src/internal/index.ts",
-      "require": "./src/internal/index.ts"
+      "@grafana-app/source": "./src/internal/index.ts"
     },
     "./eslint-plugin": {
+      "@grafana-app/source": "./src/eslint/index.cjs",
       "types": "./src/eslint/index.d.ts",
-      "import": "./src/eslint/index.cjs",
-      "require": "./src/eslint/index.cjs"
+      "default": "./src/eslint/index.cjs"
     }
   },
   "publishConfig": {
-    "main": "./dist/cjs/index.cjs",
-    "module": "./dist/esm/index.mjs",
-    "types": "./dist/types/index.d.ts",
     "access": "public"
   },
   "files": [
     "dist",
+    "src/eslint/**/*",
     "./README.md",
     "./CHANGELOG.md",
     "LICENSE_APACHE2"

packages/grafana-i18n/rollup.config.ts

@@ -1,5 +1,4 @@
 import { createRequire } from 'node:module';
-import copy from 'rollup-plugin-copy';
 
 import { entryPoint, plugins, esmOutput, cjsOutput } from '../rollup.config.parts';
 
@@ -9,13 +8,8 @@ const pkg = rq('./package.json');
 export default [
   {
     input: entryPoint,
-    plugins: [
-      ...plugins,
-      copy({
-        targets: [{ src: 'src/eslint', dest: 'dist' }],
-      }),
-    ],
-    output: [cjsOutput(pkg), esmOutput(pkg, 'grafana-i18n')],
+    plugins,
+    output: [cjsOutput(pkg, 'grafana-i18n'), esmOutput(pkg, 'grafana-i18n')],
     treeshake: false,
   },
 ];

packages/grafana-i18n/tsconfig.json

@@ -6,7 +6,8 @@
     "declarationDir": "./dist/types",
     "emitDeclarationOnly": true,
     "isolatedModules": true,
-    "rootDirs": ["."]
+    "rootDirs": ["."],
+    "moduleResolution": "bundler"
   },
   "exclude": ["dist/**/*"],
   "include": ["src/**/*.ts*"]

packages/grafana-o11y-ds-frontend/tsconfig.json

@@ -8,7 +8,8 @@
     "emitDeclarationOnly": true,
     "isolatedModules": true,
     "allowJs": true,
-    "rootDirs": ["."]
+    "rootDirs": ["."],
+    "moduleResolution": "bundler"
   },
   "exclude": ["dist/**/*"],
   "include": [

packages/grafana-plugin-configs/jest/jest.config.js

@@ -17,6 +17,9 @@ export default {
   setupFiles: ['jest-canvas-mock'],
   setupFilesAfterEnv: ['<rootDir>/jest-setup.js'],
   testEnvironment: 'jsdom',
+  testEnvironmentOptions: {
+    customExportConditions: ['@grafana-app/source', 'browser'],
+  },
   testMatch: ['<rootDir>/**/__tests__/**/*.{js,jsx,ts,tsx}', '<rootDir>/**/*.{spec,test,jest}.{js,jsx,ts,tsx}'],
   transform: {
     '^.+\\.(t|j)sx?$': [

packages/grafana-plugin-configs/tsconfig.json

@@ -1,12 +1,13 @@
 {
   "compilerOptions": {
-    "jsx": "react-jsx",
+    "allowImportingTsExtensions": true,
     "alwaysStrict": true,
+    "customConditions": ["@grafana-app/source"],
     "declaration": false,
-    "resolveJsonModule": true,
+    "jsx": "react-jsx",
     "moduleResolution": "bundler",
     "noEmit": true,
-    "allowImportingTsExtensions": true
+    "resolveJsonModule": true
   },
   "extends": "@grafana/tsconfig",
   "exclude": ["**/*.test.ts", "**/*.test.tsx", "**/*.spec.ts", "**/*.spec.tsx"],

packages/grafana-plugin-configs/webpack.config.ts

@@ -312,6 +312,7 @@ const config = async (env: Env): Promise<Configuration> => {
 
     resolve: {
       extensions: ['.ts', '.tsx', '.js', '.jsx'],
+      conditionNames: ['@grafana-app/source', '...'],
       unsafeCache: true,
     },
 

packages/grafana-prometheus/package.json

@@ -15,8 +15,18 @@
     "url": "http://github.com/grafana/grafana.git",
     "directory": "packages/grafana-prometheus"
   },
-  "main": "src/index.ts",
-  "types": "src/index.ts",
+  "main": "./dist/cjs/index.cjs",
+  "module": "./dist/esm/index.mjs",
+  "types": "./dist/types/index.d.ts",
+  "exports": {
+    "./package.json": "./package.json",
+    ".": {
+      "@grafana-app/source": "./src/index.ts",
+      "types": "./dist/types/index.d.ts",
+      "import": "./dist/esm/index.mjs",
+      "require": "./dist/cjs/index.cjs"
+    }
+  },
   "files": [
     "./dist",
     "./README.md",
@@ -24,9 +34,6 @@
     "./LICENSE_AGPL"
   ],
   "publishConfig": {
-    "main": "./dist/cjs/index.cjs",
-    "module": "./dist/esm/index.mjs",
-    "types": "./dist/types/index.d.ts",
     "access": "public"
   },
   "scripts": {

packages/grafana-prometheus/rollup.config.ts

@@ -12,7 +12,7 @@ export default [
   {
     input: entryPoint,
     plugins: [...plugins, image(), json(), dynamicImportVars()],
-    output: [cjsOutput(pkg), esmOutput(pkg, 'grafana-prometheus')],
+    output: [cjsOutput(pkg, 'grafana-prometheus'), esmOutput(pkg, 'grafana-prometheus')],
     treeshake: false,
   },
 ];

packages/grafana-runtime/package.json

@@ -14,28 +14,28 @@
     "url": "http://github.com/grafana/grafana.git",
     "directory": "packages/grafana-runtime"
   },
-  "main": "src/index.ts",
-  "types": "src/index.ts",
-  "module": "src/index.ts",
+  "main": "./dist/cjs/index.cjs",
+  "module": "./dist/esm/index.mjs",
+  "types": "./dist/types/index.d.ts",
   "exports": {
     "./package.json": "./package.json",
     ".": {
-      "import": "./src/index.ts",
-      "require": "./src/index.ts"
-    },
-    "./internal": {
-      "import": "./src/internal/index.ts",
-      "require": "./src/internal/index.ts"
+      "@grafana-app/source": "./src/index.ts",
+      "types": "./dist/types/index.d.ts",
+      "import": "./dist/esm/index.mjs",
+      "require": "./dist/cjs/index.cjs"
     },
     "./unstable": {
-      "import": "./src/unstable.ts",
-      "require": "./src/unstable.ts"
+      "@grafana-app/source": "./src/unstable.ts",
+      "types": "./dist/types/unstable.d.ts",
+      "import": "./dist/esm/unstable.mjs",
+      "require": "./dist/cjs/unstable.cjs"
+    },
+    "./internal": {
+      "@grafana-app/source": "./src/internal/index.ts"
     }
   },
   "publishConfig": {
-    "main": "./dist/cjs/index.cjs",
-    "module": "./dist/esm/index.mjs",
-    "types": "./dist/types/index.d.ts",
     "access": "public"
   },
   "files": [
@@ -49,8 +49,8 @@
     "bundle": "rollup -c rollup.config.ts --configPlugin esbuild",
     "clean": "rimraf ./dist ./compiled ./unstable ./package.tgz",
     "typecheck": "tsc --emitDeclarationOnly false --noEmit",
-    "prepack": "cp package.json package.json.bak && ALIAS_PACKAGE_NAME=unstable node ../../scripts/prepare-npm-package.js",
-    "postpack": "mv package.json.bak package.json && rimraf ./unstable"
+    "prepack": "cp package.json package.json.bak && node ../../scripts/prepare-npm-package.js",
+    "postpack": "mv package.json.bak package.json"
   },
   "dependencies": {
     "@grafana/data": "12.4.0-pre",

packages/grafana-runtime/rollup.config.ts

@@ -9,13 +9,13 @@ export default [
   {
     input: entryPoint,
     plugins,
-    output: [cjsOutput(pkg), esmOutput(pkg, 'grafana-runtime')],
+    output: [cjsOutput(pkg, 'grafana-runtime'), esmOutput(pkg, 'grafana-runtime')],
     treeshake: false,
   },
   {
     input: 'src/unstable.ts',
     plugins,
-    output: [cjsOutput(pkg), esmOutput(pkg, 'grafana-runtime')],
+    output: [cjsOutput(pkg, 'grafana-runtime'), esmOutput(pkg, 'grafana-runtime')],
     treeshake: false,
   },
 ];

packages/grafana-runtime/src/index.ts

@@ -9,7 +9,15 @@ export * from './analytics/types';
 export { loadPluginCss, type PluginCssOptions, setPluginImportUtils, getPluginImportUtils } from './utils/plugin';
 export { reportMetaAnalytics, reportInteraction, reportPageview, reportExperimentView } from './analytics/utils';
 export { featureEnabled } from './utils/licensing';
-export { logInfo, logDebug, logWarning, logError, createMonitoringLogger, logMeasurement } from './utils/logging';
+export {
+  logInfo,
+  logDebug,
+  logWarning,
+  logError,
+  createMonitoringLogger,
+  logMeasurement,
+  type MonitoringLogger,
+} from './utils/logging';
 export {
   DataSourceWithBackend,
   HealthCheckError,

packages/grafana-runtime/tsconfig.json

@@ -8,7 +8,8 @@
     "emitDeclarationOnly": true,
     "isolatedModules": true,
     "allowJs": true,
-    "rootDirs": ["."]
+    "rootDirs": ["."],
+    "moduleResolution": "bundler"
   },
   "exclude": ["dist/**/*"],
   "include": [

packages/grafana-schema/package.json

@@ -13,13 +13,14 @@
     "url": "http://github.com/grafana/grafana.git",
     "directory": "packages/grafana-schema"
   },
-  "main": "src/index.ts",
-  "types": "src/index.ts",
+  "main": "./src/index.ts",
+  "module": "./src/index.ts",
+  "types": "./src/index.ts",
   "publishConfig": {
+    "access": "public",
     "main": "./dist/cjs/index.cjs",
     "module": "./dist/esm/index.mjs",
-    "types": "./dist/types/index.d.ts",
-    "access": "public"
+    "types": "./dist/types/index.d.ts"
   },
   "files": [
     "dist",

packages/grafana-schema/rollup.config.ts

@@ -15,7 +15,12 @@ export default [
   {
     input: entryPoint,
     plugins,
-    output: [cjsOutput(pkg), esmOutput(pkg, 'grafana-schema')],
+    output: [
+      // Schema still uses publishConfig to define output directory.
+      // TODO: Migrate this package to use exports.
+      cjsOutput(pkg, 'grafana-schema', { dir: path.dirname(pkg.publishConfig.main) }),
+      esmOutput(pkg, 'grafana-schema', { dir: path.dirname(pkg.publishConfig.module) }),
+    ],
     treeshake: false,
   },
   {

packages/grafana-schema/tsconfig.json

@@ -3,10 +3,12 @@
   "compilerOptions": {
     "declaration": true,
     "jsx": "react-jsx",
+    "baseUrl": "./",
     "declarationDir": "./dist/types",
     "emitDeclarationOnly": true,
     "isolatedModules": true,
-    "rootDirs": ["."]
+    "rootDirs": ["."],
+    "moduleResolution": "bundler"
   },
   "exclude": ["dist/**/*"],
   "include": ["src/**/*.ts*"]

packages/grafana-sql/src/utils/logging.ts

@@ -1,3 +1,3 @@
-import { createMonitoringLogger } from '@grafana/runtime';
+import { createMonitoringLogger, MonitoringLogger } from '@grafana/runtime';
 
-export const sqlPluginLogger = createMonitoringLogger('features.plugins.sql');
+export const sqlPluginLogger: MonitoringLogger = createMonitoringLogger('features.plugins.sql');

packages/grafana-sql/tsconfig.json

@@ -8,7 +8,8 @@
     "emitDeclarationOnly": true,
     "isolatedModules": true,
     "strict": true,
-    "rootDirs": ["."]
+    "rootDirs": ["."],
+    "moduleResolution": "bundler"
   },
   "exclude": ["dist/**/*"],
   "include": ["src/**/*.ts*", "../../public/app/types/*.d.ts", "../grafana-ui/src/types/*.d.ts"]

packages/grafana-ui/.storybook/main.ts

@@ -95,6 +95,16 @@ const mainConfig: StorybookConfig = {
       },
     });
 
+    // Tell storybook to resolve imports with the @grafana-app/source condition for
+    // the packages in this repo.
+    if (config && config.resolve) {
+      if (Array.isArray(config.resolve.conditionNames)) {
+        config.resolve.conditionNames.unshift('@grafana-app/source');
+      } else {
+        config.resolve.conditionNames = ['@grafana-app/source', '...'];
+      }
+    }
+
     return config;
   },
 };

packages/grafana-ui/.storybook/tsconfig.json

@@ -1,8 +1,7 @@
 {
   "compilerOptions": {
     "declarationDir": "dist",
-    "noUnusedLocals": false,
-    "outDir": "compiled"
+    "noUnusedLocals": false
   },
   "extends": "../tsconfig.json",
   "include": ["../src/**/*.ts*", "../../../public/app/types/svg.d.ts"]

packages/grafana-ui/package.json

@@ -16,28 +16,28 @@
     "url": "http://github.com/grafana/grafana.git",
     "directory": "packages/grafana-ui"
   },
-  "main": "src/index.ts",
-  "types": "src/index.ts",
-  "module": "src/index.ts",
+  "main": "./dist/cjs/index.cjs",
+  "module": "./dist/esm/index.mjs",
+  "types": "./dist/types/index.d.ts",
   "exports": {
     "./package.json": "./package.json",
     ".": {
-      "import": "./src/index.ts",
-      "require": "./src/index.ts"
-    },
-    "./internal": {
-      "import": "./src/internal/index.ts",
-      "require": "./src/internal/index.ts"
+      "@grafana-app/source": "./src/index.ts",
+      "types": "./dist/types/index.d.ts",
+      "import": "./dist/esm/index.mjs",
+      "require": "./dist/cjs/index.cjs"
     },
     "./unstable": {
-      "import": "./src/unstable.ts",
-      "require": "./src/unstable.ts"
+      "@grafana-app/source": "./src/unstable.ts",
+      "types": "./dist/types/unstable.d.ts",
+      "import": "./dist/esm/unstable.mjs",
+      "require": "./dist/cjs/unstable.cjs"
+    },
+    "./internal": {
+      "@grafana-app/source": "./src/internal/index.ts"
     }
   },
   "publishConfig": {
-    "main": "./dist/cjs/index.cjs",
-    "module": "./dist/esm/index.mjs",
-    "types": "./dist/types/index.d.ts",
     "access": "public"
   },
   "files": [
@@ -55,8 +55,8 @@
     "storybook:build": "storybook build -o ./dist/storybook -c .storybook",
     "storybook:test": "test-storybook --url http://localhost:9001",
     "typecheck": "tsc --emitDeclarationOnly false --noEmit",
-    "prepack": "cp package.json package.json.bak && ALIAS_PACKAGE_NAME=unstable node ../../scripts/prepare-npm-package.js",
-    "postpack": "mv package.json.bak package.json && rimraf ./unstable"
+    "prepack": "cp package.json package.json.bak && node ../../scripts/prepare-npm-package.js",
+    "postpack": "mv package.json.bak package.json"
   },
   "browserslist": [
     "defaults",

packages/grafana-ui/rollup.config.ts

@@ -24,7 +24,7 @@ export default [
         flatten: false,
       }),
     ],
-    output: [cjsOutput(pkg), esmOutput(pkg, 'grafana-ui')],
+    output: [cjsOutput(pkg, 'grafana-ui'), esmOutput(pkg, 'grafana-ui')],
     treeshake: false,
   },
   {
@@ -37,7 +37,7 @@ export default [
         flatten: false,
       }),
     ],
-    output: [cjsOutput(pkg), esmOutput(pkg, 'grafana-ui')],
+    output: [cjsOutput(pkg, 'grafana-ui'), esmOutput(pkg, 'grafana-ui')],
     treeshake: false,
   },
 ];

packages/grafana-ui/src/components/Forms/Legacy/Select/SelectOptionGroup.tsx

@@ -94,4 +94,5 @@ class UnthemedSelectOptionGroup extends PureComponent<ExtendedGroupProps, State>
   }
 }
 
-export const SelectOptionGroup = withTheme2(UnthemedSelectOptionGroup);
+// TODO: type this properly
+export const SelectOptionGroup: React.FC<ExtendedGroupProps> = withTheme2(UnthemedSelectOptionGroup);

packages/grafana-ui/src/components/Select/ValueContainer.tsx

@@ -76,4 +76,5 @@ class UnthemedValueContainer<Option, isMulti extends boolean, Group extends Grou
   }
 }
 
-export const ValueContainer = withTheme2(UnthemedValueContainer);
+export const ValueContainer: React.FC<ValueContainerProps<unknown, boolean, GroupBase<unknown>>> =
+  withTheme2(UnthemedValueContainer);

packages/grafana-ui/tsconfig.json

@@ -8,7 +8,8 @@
     "emitDeclarationOnly": true,
     "isolatedModules": true,
     "allowJs": true,
-    "rootDirs": ["."]
+    "rootDirs": ["."],
+    "moduleResolution": "bundler"
   },
   "exclude": ["dist/**/*"],
   "include": ["../../public/test/setupTests.ts", "../../public/app/types/*.d.ts", "src/**/*.ts*"],

packages/rollup.config.parts.ts

@@ -23,25 +23,29 @@ export const plugins = [
 ];
 
 // Generates a rollup configuration for commonjs output.
-export function cjsOutput(pkg) {
+export function cjsOutput(pkg, pkgName, overrides = {}) {
   return {
     format: 'cjs',
     sourcemap: true,
-    dir: dirname(pkg.publishConfig.main),
+    dir: dirname(pkg.main),
     entryFileNames: '[name].cjs',
+    preserveModules: true,
+    preserveModulesRoot: resolve(projectCwd, `packages/${pkgName}/src`),
     esModule: true,
     interop: 'compat',
+    ...overrides,
   };
 }
 
 // Generate a rollup configuration for es module output.
-export function esmOutput(pkg, pkgName) {
+export function esmOutput(pkg, pkgName, overrides = {}) {
   return {
     format: 'esm',
     sourcemap: true,
-    dir: dirname(pkg.publishConfig.module),
+    dir: dirname(pkg.module),
     entryFileNames: '[name].mjs',
     preserveModules: true,
     preserveModulesRoot: resolve(projectCwd, `packages/${pkgName}/src`),
+    ...overrides,
   };
 }

project.json

@@ -39,7 +39,8 @@
       "inputs": [
         "{workspaceRoot}/scripts/cli/generateSassVariableFiles.ts",
         "{workspaceRoot}/packages/grafana-data/src/themes/**",
-        "{workspaceRoot}/packages/grafana-ui/src/themes/**"
+        "{workspaceRoot}/packages/grafana-ui/src/themes/**",
+        "{workspaceRoot}/package.json"
       ],
       "outputs": [
         "{workspaceRoot}/public/sass/_variables.generated.scss",

public/app/features/admin/UserListAdminPage.tsx

@@ -3,7 +3,7 @@ import { ComponentType, useEffect } from 'react';
 import { connect, ConnectedProps } from 'react-redux';
 
 import { GrafanaTheme2 } from '@grafana/data';
-import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
+import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
 import { Trans, t } from '@grafana/i18n';
 import { LinkButton, RadioButtonGroup, useStyles2, FilterInput, EmptyState } from '@grafana/ui';
 import { Page } from 'app/core/components/Page/Page';

public/app/features/admin/UserListAnonymousPage.tsx

@@ -3,7 +3,7 @@ import { useEffect } from 'react';
 import { connect, ConnectedProps } from 'react-redux';
 
 import { GrafanaTheme2 } from '@grafana/data';
-import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
+import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
 import { t } from '@grafana/i18n';
 import { RadioButtonGroup, useStyles2, FilterInput } from '@grafana/ui';
 import { Page } from 'app/core/components/Page/Page';

public/app/features/admin/UserListPage.test.tsx

@@ -1,7 +1,7 @@
 import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 
-import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
+import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
 import { GrafanaBootConfig } from '@grafana/runtime';
 import config from 'app/core/config';
 

public/app/features/admin/UserListPublicDashboardPage/DashboardsListModalButton.tsx

@@ -1,7 +1,7 @@
 import { css, cx } from '@emotion/css';
 
 import { GrafanaTheme2 } from '@grafana/data';
-import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
+import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
 import { Trans, t } from '@grafana/i18n';
 import { Button, LoadingPlaceholder, Modal, ModalsController, useStyles2 } from '@grafana/ui';
 import {

public/app/features/admin/UserListPublicDashboardPage/UserListPublicDashboardPage.tsx

@@ -1,4 +1,4 @@
-import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
+import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
 import { Trans, t } from '@grafana/i18n';
 import { Icon, Stack, Tag, Tooltip } from '@grafana/ui';
 import { Page } from 'app/core/components/Page/Page';

public/app/features/dashboard-scene/inspect/InspectJsonTab.tsx

@@ -16,7 +16,7 @@ import {
   sceneUtils,
   VizPanel,
 } from '@grafana/scenes';
-import { LibraryPanel } from '@grafana/schema/';
+import { LibraryPanel } from '@grafana/schema';
 import { Alert, Button, CodeEditor, Field, Select, useStyles2 } from '@grafana/ui';
 import { isDashboardV2Spec } from 'app/features/dashboard/api/utils';
 import { getPanelDataFrames } from 'app/features/dashboard/components/HelpWizard/utils';

public/app/features/dashboard-scene/scene/layout-auto-grid/AutoGridItemRenderer.tsx

@@ -1,7 +1,7 @@
 import { css, cx } from '@emotion/css';
 import { memo, useMemo } from 'react';
 
-import { GrafanaTheme2 } from '@grafana/data/';
+import { GrafanaTheme2 } from '@grafana/data';
 import { LazyLoader, SceneComponentProps, VizPanel } from '@grafana/scenes';
 import { useStyles2 } from '@grafana/ui';
 

public/app/features/dashboard/components/DashNav/ShareButton.tsx

@@ -1,4 +1,4 @@
-import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
+import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
 import { Trans } from '@grafana/i18n';
 import { locationService } from '@grafana/runtime';
 import { Button } from '@grafana/ui';

public/app/features/dashboard/components/PublicDashboardNotAvailable/PublicDashboardNotAvailable.tsx

@@ -1,7 +1,7 @@
 import { css, cx } from '@emotion/css';
 
 import { GrafanaTheme2 } from '@grafana/data';
-import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
+import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
 import { Trans, t } from '@grafana/i18n';
 import { useStyles2 } from '@grafana/ui';
 

public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ConfigPublicDashboard/ConfigPublicDashboard.tsx

@@ -2,7 +2,7 @@ import { css } from '@emotion/css';
 import { useForm } from 'react-hook-form';
 
 import { GrafanaTheme2, TimeRange } from '@grafana/data';
-import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
+import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
 import { Trans, t } from '@grafana/i18n';
 import { Button, ClipboardButton, Field, Input, Stack, Label, ModalsController, Switch, useStyles2 } from '@grafana/ui';
 import {

public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ConfigPublicDashboard/Configuration.tsx

@@ -1,7 +1,7 @@
 import { UseFormRegister } from 'react-hook-form';
 
 import { TimeRange } from '@grafana/data';
-import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
+import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
 import { Trans, t } from '@grafana/i18n';
 import { FieldSet, Label, Switch, TimeRangeInput, Stack } from '@grafana/ui';
 import { DashboardInteractions } from 'app/features/dashboard-scene/utils/interactions';

public/app/features/dashboard/components/ShareModal/SharePublicDashboard/CreatePublicDashboard/AcknowledgeCheckboxes.tsx

@@ -2,7 +2,7 @@ import { css } from '@emotion/css';
 import { UseFormRegister } from 'react-hook-form';
 
 import { GrafanaTheme2 } from '@grafana/data';
-import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
+import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
 import { Trans, t } from '@grafana/i18n';
 import { Checkbox, FieldSet, LinkButton, useStyles2, Stack } from '@grafana/ui';
 

public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ModalAlerts/NoUpsertPermissionsAlert.tsx

@@ -1,4 +1,4 @@
-import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
+import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
 import { Trans, t } from '@grafana/i18n';
 import { Alert } from '@grafana/ui';
 

public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ModalAlerts/UnsupportedDataSourcesAlert.tsx

@@ -2,7 +2,7 @@ import { css } from '@emotion/css';
 import cx from 'classnames';
 
 import { GrafanaTheme2 } from '@grafana/data';
-import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
+import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
 import { Trans, t } from '@grafana/i18n';
 import { Alert, useStyles2 } from '@grafana/ui';
 

public/app/features/dashboard/components/ShareModal/SharePublicDashboard/ModalAlerts/UnsupportedTemplateVariablesAlert.tsx

@@ -1,4 +1,4 @@
-import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
+import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
 import { Trans, t } from '@grafana/i18n';
 import { Alert } from '@grafana/ui';
 

public/app/features/dashboard/components/ShareModal/SharePublicDashboard/SharePublicDashboard.test.tsx

@@ -4,7 +4,7 @@ import { http, HttpResponse } from 'msw';
 import { setupServer } from 'msw/node';
 
 import { BootData, DataQuery } from '@grafana/data';
-import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
+import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
 import { reportInteraction, setEchoSrv } from '@grafana/runtime';
 import { Panel } from '@grafana/schema';
 import config from 'app/core/config';

public/app/features/dashboard/containers/PublicDashboardPage.test.tsx

@@ -5,7 +5,7 @@ import { useEffectOnce } from 'react-use';
 import { Props as AutoSizerProps } from 'react-virtualized-auto-sizer';
 import { render } from 'test/test-utils';
 
-import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
+import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
 import { Dashboard, DashboardCursorSync, FieldConfigSource, Panel, ThresholdsMode } from '@grafana/schema/src';
 import { getRouteComponentProps } from 'app/core/navigation/mocks/routeProps';
 import { DashboardInitPhase, DashboardMeta, DashboardRoutes } from 'app/types/dashboard';

public/app/features/dashboard/containers/PublicDashboardPage.tsx

@@ -4,7 +4,7 @@ import { useLocation, useParams } from 'react-router-dom-v5-compat';
 import { usePrevious } from 'react-use';
 
 import { GrafanaTheme2, PageLayoutType, TimeZone } from '@grafana/data';
-import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
+import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
 import { PageToolbar, useStyles2 } from '@grafana/ui';
 import { Page } from 'app/core/components/Page/Page';
 import { useGrafana } from 'app/core/context/GrafanaContext';

public/app/features/explore/PrometheusListView/RawListItem.tsx

@@ -3,7 +3,7 @@ import { useCopyToClipboard } from 'react-use';
 
 import { Field, GrafanaTheme2 } from '@grafana/data';
 import { t } from '@grafana/i18n';
-import { isValidLegacyName, utf8Support } from '@grafana/prometheus/src/utf8_support';
+import { isValidLegacyName, utf8Support } from '@grafana/prometheus';
 import { reportInteraction } from '@grafana/runtime';
 import { IconButton, useStyles2 } from '@grafana/ui';
 

public/app/features/logs/components/panel/LogListControls.tsx

@@ -5,13 +5,13 @@ import { MouseEvent, useCallback, useMemo } from 'react';
 import {
   CoreApp,
   EventBus,
+  GrafanaTheme2,
   LogLevel,
   LogsDedupDescription,
   LogsDedupStrategy,
   LogsSortOrder,
   store,
 } from '@grafana/data';
-import { GrafanaTheme2 } from '@grafana/data/';
 import { t } from '@grafana/i18n';
 import { config, reportInteraction } from '@grafana/runtime';
 import { Dropdown, Menu, useStyles2 } from '@grafana/ui';

public/app/features/manage-dashboards/components/PublicDashboardListTable/PublicDashboardListTable.test.tsx

@@ -3,7 +3,7 @@ import { http, HttpResponse } from 'msw';
 import { setupServer } from 'msw/node';
 import { render } from 'test/test-utils';
 
-import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
+import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
 import { backendSrv } from 'app/core/services/backend_srv';
 import { contextSrv } from 'app/core/services/context_srv';
 

public/app/features/manage-dashboards/components/PublicDashboardListTable/PublicDashboardListTable.tsx

@@ -3,7 +3,7 @@ import { useMemo, useState } from 'react';
 import { useMedia } from 'react-use';
 
 import { GrafanaTheme2 } from '@grafana/data';
-import { selectors as e2eSelectors } from '@grafana/e2e-selectors/src';
+import { selectors as e2eSelectors } from '@grafana/e2e-selectors';
 import { Trans, t } from '@grafana/i18n';
 import { reportInteraction } from '@grafana/runtime';
 import {

public/app/plugins/panel/geomap/components/DebugOverlay.tsx

@@ -6,7 +6,7 @@ import { PureComponent } from 'react';
 import tinycolor from 'tinycolor2';
 
 import { GrafanaTheme2 } from '@grafana/data';
-import { selectors } from '@grafana/e2e-selectors/src';
+import { selectors } from '@grafana/e2e-selectors';
 import { Trans } from '@grafana/i18n';
 import { config } from 'app/core/config';
 
@@ -44,7 +44,7 @@ export class DebugOverlay extends PureComponent<Props, State> {
     const { zoom, center } = this.state;
 
     return (
-      <div className={this.style.infoWrap} aria-label={selectors.components.DebugOverlay.wrapper}>
+      <div className={this.style.infoWrap} data-testid={selectors.components.DebugOverlay.wrapper}>
         <table>
           <tbody>
             <tr>

scripts/cli/tsconfig.json

@@ -1,7 +1,7 @@
 {
   "compilerOptions": {
-    "moduleResolution": "node",
-    "module": "commonjs"
+    "moduleResolution": "nodenext",
+    "module": "NodeNext"
   },
   "extends": "../../tsconfig.json",
   "ts-node": {

scripts/prepare-npm-package.js

@@ -1,108 +1,35 @@
+//@ts-check
 import PackageJson from '@npmcli/package-json';
-import { mkdir } from 'node:fs/promises';
 
 const cwd = process.cwd();
 
 try {
   const pkgJson = await PackageJson.load(cwd);
-  const cjsIndex = pkgJson.content.publishConfig?.main ?? pkgJson.content.main;
-  const esmIndex = pkgJson.content.publishConfig?.module ?? pkgJson.content.module;
-  const typesIndex = pkgJson.content.publishConfig?.types ?? pkgJson.content.types;
+  const pkgJsonExports = pkgJson.content.exports;
 
-  const exports = {
-    './package.json': './package.json',
-    '.': {
-      import: {
-        types: typesIndex,
-        default: esmIndex,
-      },
-      require: {
-        types: typesIndex,
-        default: cjsIndex,
-      },
-    },
-  };
-  // Fix so scenes can access `@grafana/schema` nested dist import paths e.g.
-  // import {} from '@grafana/schema/dist/esm/raw/composable/bargauge/panelcfg/x/BarGaugePanelCfg_types.gen'
-  if (pkgJson.content.name === '@grafana/schema') {
-    exports['./dist/*'] = {
-      types: './dist/*',
-      default: './dist/*',
-    };
-  }
-
-  // Fix for @grafana/i18n so eslint-plugin can be imported by consumers
-  if (pkgJson.content.name === '@grafana/i18n') {
-    exports['./eslint-plugin'] = {
-      types: './dist/eslint/index.d.ts',
-      import: './dist/eslint/index.cjs',
-      require: './dist/eslint/index.cjs',
-    };
-  }
-
-  pkgJson.update({
-    main: cjsIndex,
-    types: typesIndex,
-    module: esmIndex,
-    exports,
-  });
-
-  await pkgJson.save();
-
-  // If an alias package name is provided we add an exports entry for the alias
-  // then generate an additional "nested" package.json for typescript resolution that
-  // doesn't use the exports property in package.json.
-  if (process.env.ALIAS_PACKAGE_NAME) {
-    const aliasNames = process.env.ALIAS_PACKAGE_NAME.split(',');
-
-    const additionalExports = aliasNames.reduce((acc, alias) => {
-      acc[`./${alias}`] = {
-        import: {
-          types: typesIndex.replace('index', alias),
-          default: esmIndex.replace('index', alias),
-        },
-        require: {
-          types: typesIndex.replace('index', alias),
-          default: cjsIndex.replace('index', alias),
-        },
-      };
-      return acc;
-    }, {});
+  // skip packages without exports otherwise consumers cannot import anything from the package
+  if (pkgJsonExports && typeof pkgJsonExports === 'object') {
+    // Remove all exports that only contain a single key '@grafana-app/source'
+    // as these will not resolve when validating packages with attw because the
+    // source code is not available in the tarball.
+    for (const [key, val] of Object.entries(pkgJsonExports)) {
+      if (
+        val !== null &&
+        typeof val === 'object' &&
+        Object.keys(val).length === 1 &&
+        Object.keys(val)[0] === '@grafana-app/source'
+      ) {
+        delete pkgJsonExports[key];
+      }
+    }
 
     pkgJson.update({
-      exports: {
-        ...pkgJson.content.exports,
-        ...additionalExports,
-      },
-      files: [...pkgJson.content.files, ...aliasNames],
+      exports: pkgJsonExports,
     });
-    await pkgJson.save();
 
-    for await (const aliasName of aliasNames) {
-      await createAliasPackageJsonFiles(pkgJson.content, aliasName);
-    }
+    await pkgJson.save();
   }
 } catch (e) {
   console.error(e);
   process.exit(1);
 }
-
-async function createAliasPackageJsonFiles(packageJsonContent, aliasName) {
-  const pkgName = `${packageJsonContent.name}/${aliasName}`;
-  try {
-    console.log(`📦 Writing alias package.json for ${pkgName}.`);
-    const pkgJsonPath = `${cwd}/${aliasName}`;
-    await mkdir(pkgJsonPath, { recursive: true });
-    const pkgJson = await PackageJson.create(pkgJsonPath, {
-      data: {
-        name: pkgName,
-        types: `../dist/types/${aliasName}.d.ts`,
-        main: `../dist/cjs/${aliasName}.cjs`,
-        module: `../dist/esm/${aliasName}.mjs`,
-      },
-    });
-    await pkgJson.save();
-  } catch (error) {
-    throw new Error(`Error generating package.json for ${pkgName}`, error);
-  }
-}

scripts/tsconfig.base.json

@@ -4,6 +4,7 @@
     "alwaysStrict": true,
     "strict": true,
     "allowSyntheticDefaultImports": true,
+    "customConditions": ["@grafana-app/source"],
     "downlevelIteration": true,
     "esModuleInterop": true,
     "experimentalDecorators": true,

scripts/validate-npm-packages.sh

@@ -17,7 +17,7 @@ for file in "$ARTIFACTS_DIR"/*.tgz; do
   fi
 
   # shellcheck disable=SC2086
-  if ! yarn attw "$file" --ignore-rules "false-cjs" $ATTW_FLAGS; then
+  if ! NODE_OPTIONS="-C @grafana-app/source" yarn attw "$file" --ignore-rules "false-cjs" $ATTW_FLAGS; then
     echo "attw check failed for $file"
     echo ""
     failed_checks+=("$file - yarn attw")

scripts/webpack/webpack.common.js

@@ -22,6 +22,7 @@ module.exports = {
     publicPath: 'public/build/',
   },
   resolve: {
+    conditionNames: ['@grafana-app/source', '...'],
     extensions: ['.ts', '.tsx', '.es6', '.js', '.json', '.svg'],
     alias: {
       // some of data source plugins use global Prism object to add the language definition

tsconfig.json

@@ -18,9 +18,10 @@
     }
   },
   "ts-node": {
+    "swc": true,
     "compilerOptions": {
       "module": "ESNext",
-      "moduleResolution": "Node"
+      "moduleResolution": "Bundler"
     }
   },
   "include": [

yarn.lock

@@ -8290,6 +8290,30 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@storybook/core@patch:@storybook/core@npm%3A8.6.2#~/.yarn/patches/@storybook-core-npm-8.6.2-8c752112c0.patch":
+  version: 8.6.2
+  resolution: "@storybook/core@patch:@storybook/core@npm%3A8.6.2#~/.yarn/patches/@storybook-core-npm-8.6.2-8c752112c0.patch::version=8.6.2&hash=f4cc1f"
+  dependencies:
+    "@storybook/theming": "npm:8.6.2"
+    better-opn: "npm:^3.0.2"
+    browser-assert: "npm:^1.2.1"
+    esbuild: "npm:^0.18.0 || ^0.19.0 || ^0.20.0 || ^0.21.0 || ^0.22.0 || ^0.23.0 || ^0.24.0 || ^0.25.0"
+    esbuild-register: "npm:^3.5.0"
+    jsdoc-type-pratt-parser: "npm:^4.0.0"
+    process: "npm:^0.11.10"
+    recast: "npm:^0.23.5"
+    semver: "npm:^7.6.2"
+    util: "npm:^0.12.5"
+    ws: "npm:^8.2.3"
+  peerDependencies:
+    prettier: ^2 || ^3
+  peerDependenciesMeta:
+    prettier:
+      optional: true
+  checksum: 10/cd95a51437135dd3c4333b14acefd528d8064b2cea7789f859ba80783c115c92ed4be51d4a7bd6236888fdd5f46f488a379e0c71bc1a712ffe6dc1353fb4e648
+  languageName: node
+  linkType: hard
+
 "@storybook/csf-plugin@npm:8.6.2":
   version: 8.6.2
   resolution: "@storybook/csf-plugin@npm:8.6.2"