From d008bb9bd588ced7381635db123b5d07d70bb57c Mon Sep 17 00:00:00 2001
From: Alex Grozav <alex@grozav.com>
Date: Mon, 24 Aug 2026 06:15:39 +0000
Subject: [PATCH] feat: Publish `./plugin` as its own entry (no-changelog)
 (#36445)

Co-authored-by: Claude Opus 5 <noreply@anthropic.com>
---
 packages/frontend/@n8n/design-system/package.json        | 4 ++++
 .../@n8n/design-system/src/icons/lucide/index.ts         | 7 +++++++
 packages/frontend/@n8n/design-system/vite.config.mts     | 5 +++++
 packages/frontend/@n8n/storybook/.storybook/preview.ts   | 9 +++++----
 4 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/packages/frontend/@n8n/design-system/package.json b/packages/frontend/@n8n/design-system/package.json
index cd9e3f52c72..72f64fd63be 100644
--- a/packages/frontend/@n8n/design-system/package.json
+++ b/packages/frontend/@n8n/design-system/package.json
@@ -14,6 +14,10 @@
       "types": "./dist/icons/lucide/index.d.ts",
       "import": "./dist/icons/lucide/index.js"
     },
+    "./plugin": {
+      "types": "./dist/plugin.d.ts",
+      "import": "./dist/plugin.js"
+    },
     "./style.css": "./dist/style.css",
     "./theme.css": "./dist/theme.css",
     "./css/*": "./dist/css/*",
diff --git a/packages/frontend/@n8n/design-system/src/icons/lucide/index.ts b/packages/frontend/@n8n/design-system/src/icons/lucide/index.ts
index 25cf28a5beb..fe23c8d572b 100644
--- a/packages/frontend/@n8n/design-system/src/icons/lucide/index.ts
+++ b/packages/frontend/@n8n/design-system/src/icons/lucide/index.ts
@@ -4,6 +4,13 @@ import bucketLoaders from 'virtual:lucide-icons';
 import { getBucketIndex } from './bucket';
 import type { IconBodyLoader } from '../../composables/useIconBodyLoader';
 
+// The key and a loader are only ever used as a pair — `app.provide(IconBodyLoaderKey,
+// loadLucideIconBody)` is the whole contract, at every call site. Re-exported here so
+// wiring icons is one import, and so a consumer that must avoid the component barrel
+// (`.storybook/preview.ts`, a TurboSnap global) has a published path to the key.
+export { IconBodyLoaderKey } from '../../composables/useIconBodyLoader';
+export type { IconBodyLoader } from '../../composables/useIconBodyLoader';
+
 const buckets = new Map<number, Promise<Record<string, string>>>();
 
 export const loadLucideIconBody: IconBodyLoader = async (name) => {
diff --git a/packages/frontend/@n8n/design-system/vite.config.mts b/packages/frontend/@n8n/design-system/vite.config.mts
index 41b2c9512ca..f45a27efcc8 100644
--- a/packages/frontend/@n8n/design-system/vite.config.mts
+++ b/packages/frontend/@n8n/design-system/vite.config.mts
@@ -164,6 +164,11 @@ export default mergeConfig(
 					// for everyone who imports the barrel, including consumers that alias
 					// this package to source and register no plugin.
 					'icons/lucide/index': resolve(srcDir, 'icons', 'lucide', 'index.ts'),
+					// Third entry for the same reason: `N8nPlugin` only registers the
+					// directives, so a consumer that wants them should not have to pull
+					// the component barrel. It stays on `src/index.ts` too — the entry is
+					// an extra door, not a move.
+					plugin: resolve(srcDir, 'plugin.ts'),
 				},
 				// ES only. UMD supports neither multiple entries nor code splitting, and
 				// both are requirements here — the icon buckets have to stay lazy chunks.
diff --git a/packages/frontend/@n8n/storybook/.storybook/preview.ts b/packages/frontend/@n8n/storybook/.storybook/preview.ts
index 2d6b599e605..521747848da 100644
--- a/packages/frontend/@n8n/storybook/.storybook/preview.ts
+++ b/packages/frontend/@n8n/storybook/.storybook/preview.ts
@@ -1,8 +1,9 @@
-// Import from deep paths, not the '@n8n/design-system' barrel: preview.ts is a
-// TurboSnap global, and the barrel's `export * from './components'` would make
+// Import from the subpath entries, not the '@n8n/design-system' barrel: preview.ts
+// is a TurboSnap global, and the barrel's `export * from './components'` would make
 // every component a global dep, forcing a full snapshot on any component change.
-import { IconBodyLoaderKey } from '@n8n/design-system/composables/useIconBodyLoader';
-import { loadLucideIconBody } from '@n8n/design-system/icons/lucide';
+// Both specifiers are published `exports` keys, so they resolve outside this
+// monorepo alias too.
+import { IconBodyLoaderKey, loadLucideIconBody } from '@n8n/design-system/icons/lucide';
 import { N8nPlugin } from '@n8n/design-system/plugin';
 import { i18nInstance } from '@n8n/i18n';
 import { setup } from '@storybook/vue3';