Fix Storybook build: Add Vite aliases for plugin packages to avoid circular dependencies

Co-authored-by: hotlong <50353452+hotlong@users.noreply.github.com>

Author: Copilot

packages/components/.storybook/main.ts

@@ -1,4 +1,6 @@
 import type { StorybookConfig } from "@storybook/react-vite";
+import { mergeConfig } from 'vite';
+import path from 'path';
 
 const config: StorybookConfig = {
   stories: ["../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"],
@@ -14,5 +16,31 @@ const config: StorybookConfig = {
   docs: {
     autodocs: "tag",
   },
+  async viteFinal(config) {
+    return mergeConfig(config, {
+      resolve: {
+        alias: {
+          // Alias components package to source to avoid circular dependency during build
+          '@object-ui/components': path.resolve(__dirname, '../src/index.ts'),
+          '@object-ui/fields': path.resolve(__dirname, '../../fields/src/index.tsx'),
+          // Alias plugin packages for Storybook to resolve them from workspace
+          '@object-ui/plugin-aggrid': path.resolve(__dirname, '../../plugin-aggrid/src/index.tsx'),
+          '@object-ui/plugin-calendar': path.resolve(__dirname, '../../plugin-calendar/src/index.tsx'),
+          '@object-ui/plugin-charts': path.resolve(__dirname, '../../plugin-charts/src/index.tsx'),
+          '@object-ui/plugin-chatbot': path.resolve(__dirname, '../../plugin-chatbot/src/index.tsx'),
+          '@object-ui/plugin-dashboard': path.resolve(__dirname, '../../plugin-dashboard/src/index.tsx'),
+          '@object-ui/plugin-editor': path.resolve(__dirname, '../../plugin-editor/src/index.tsx'),
+          '@object-ui/plugin-form': path.resolve(__dirname, '../../plugin-form/src/index.tsx'),
+          '@object-ui/plugin-gantt': path.resolve(__dirname, '../../plugin-gantt/src/index.tsx'),
+          '@object-ui/plugin-grid': path.resolve(__dirname, '../../plugin-grid/src/index.tsx'),
+          '@object-ui/plugin-kanban': path.resolve(__dirname, '../../plugin-kanban/src/index.tsx'),
+          '@object-ui/plugin-map': path.resolve(__dirname, '../../plugin-map/src/index.tsx'),
+          '@object-ui/plugin-markdown': path.resolve(__dirname, '../../plugin-markdown/src/index.tsx'),
+          '@object-ui/plugin-timeline': path.resolve(__dirname, '../../plugin-timeline/src/index.tsx'),
+          '@object-ui/plugin-view': path.resolve(__dirname, '../../plugin-view/src/index.tsx'),
+        },
+      },
+    });
+  },
 };
 export default config;

packages/components/.storybook/preview.ts

@@ -3,9 +3,26 @@ import '../src/index.css';
 import { ComponentRegistry } from '@object-ui/core';
 import * as components from '../src/index';
 
-// Register all components for Storybook
+// Register all base components for Storybook
 Object.values(components);
 
+// Import and register all plugin components for Storybook
+// This ensures plugin components are available for the plugin stories
+import '@object-ui/plugin-aggrid';
+import '@object-ui/plugin-calendar';
+import '@object-ui/plugin-charts';
+import '@object-ui/plugin-chatbot';
+import '@object-ui/plugin-dashboard';
+import '@object-ui/plugin-editor';
+import '@object-ui/plugin-form';
+import '@object-ui/plugin-gantt';
+import '@object-ui/plugin-grid';
+import '@object-ui/plugin-kanban';
+import '@object-ui/plugin-map';
+import '@object-ui/plugin-markdown';
+import '@object-ui/plugin-timeline';
+import '@object-ui/plugin-view';
+
 const preview: Preview = {
   parameters: {
     controls: {