@tpitre/story-ui 2.8.0 → 3.0.0

package/dist/test-storybooks/angular-material-storybook/src/main.js

@@ -0,0 +1,66 @@
+var __esDecorate = (this && this.__esDecorate) || function (ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
+    function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; }
+    var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
+    var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
+    var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
+    var _, done = false;
+    for (var i = decorators.length - 1; i >= 0; i--) {
+        var context = {};
+        for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
+        for (var p in contextIn.access) context.access[p] = contextIn.access[p];
+        context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
+        var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
+        if (kind === "accessor") {
+            if (result === void 0) continue;
+            if (result === null || typeof result !== "object") throw new TypeError("Object expected");
+            if (_ = accept(result.get)) descriptor.get = _;
+            if (_ = accept(result.set)) descriptor.set = _;
+            if (_ = accept(result.init)) initializers.unshift(_);
+        }
+        else if (_ = accept(result)) {
+            if (kind === "field") initializers.unshift(_);
+            else descriptor[key] = _;
+        }
+    }
+    if (target) Object.defineProperty(target, contextIn.name, descriptor);
+    done = true;
+};
+var __runInitializers = (this && this.__runInitializers) || function (thisArg, initializers, value) {
+    var useValue = arguments.length > 2;
+    for (var i = 0; i < initializers.length; i++) {
+        value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
+    }
+    return useValue ? value : void 0;
+};
+var __setFunctionName = (this && this.__setFunctionName) || function (f, name, prefix) {
+    if (typeof name === "symbol") name = name.description ? "[".concat(name.description, "]") : "";
+    return Object.defineProperty(f, "name", { configurable: true, value: prefix ? "".concat(prefix, " ", name) : name });
+};
+import { bootstrapApplication } from '@angular/platform-browser';
+import { provideAnimations } from '@angular/platform-browser/animations';
+import { Component } from '@angular/core';
+let AppComponent = (() => {
+    let _classDecorators = [Component({
+            selector: 'app-root',
+            standalone: true,
+            template: '<h1>Angular Material Storybook</h1>',
+        })];
+    let _classDescriptor;
+    let _classExtraInitializers = [];
+    let _classThis;
+    var AppComponent = _classThis = class {
+    };
+    __setFunctionName(_classThis, "AppComponent");
+    (() => {
+        const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(null) : void 0;
+        __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+        AppComponent = _classThis = _classDescriptor.value;
+        if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+        __runInitializers(_classThis, _classExtraInitializers);
+    })();
+    return AppComponent = _classThis;
+})();
+export { AppComponent };
+bootstrapApplication(AppComponent, {
+    providers: [provideAnimations()],
+});

package/dist/test-storybooks/chakra-storybook/vite.config.js

@@ -0,0 +1,6 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+// https://vite.dev/config/
+export default defineConfig({
+    plugins: [react()],
+});

package/dist/test-storybooks/mantine-storybook/vite.config.js

@@ -0,0 +1,93 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+import fs from 'fs';
+import path from 'path';
+// Custom plugin to serve raw source files for Visual Builder
+function rawSourcePlugin() {
+    return {
+        name: 'raw-source-plugin',
+        configureServer(server) {
+            server.middlewares.use('/api/raw-source', (req, res) => {
+                const url = new URL(req.url, `http://${req.headers.host}`);
+                const fileName = url.searchParams.get('file');
+                const isEdited = url.searchParams.get('isEdited') === 'true';
+                if (!fileName) {
+                    res.statusCode = 400;
+                    res.end(JSON.stringify({ error: 'File parameter is required' }));
+                    return;
+                }
+                console.log(`[Vite Plugin] Loading story: ${fileName}, isEdited: ${isEdited}`);
+                try {
+                    let filePath;
+                    let sourceCode;
+                    // Priority-based file lookup: edited stories get priority in edited/ directory
+                    if (isEdited) {
+                        // For edited stories, check edited/ directory first
+                        const editedPath = path.join(process.cwd(), 'src', 'stories', 'edited', `${fileName}.stories.tsx`);
+                        const generatedPath = path.join(process.cwd(), 'src', 'stories', 'generated', `${fileName}.stories.tsx`);
+                        if (fs.existsSync(editedPath)) {
+                            filePath = editedPath;
+                            sourceCode = fs.readFileSync(filePath, 'utf-8');
+                        }
+                        else if (fs.existsSync(generatedPath)) {
+                            filePath = generatedPath;
+                            sourceCode = fs.readFileSync(filePath, 'utf-8');
+                        }
+                        else {
+                            res.statusCode = 404;
+                            res.end(JSON.stringify({
+                                error: `File not found: ${fileName}`,
+                                searched: ['edited/', 'generated/']
+                            }));
+                            return;
+                        }
+                    }
+                    else {
+                        // For generated stories, check generated/ directory first
+                        const generatedPath = path.join(process.cwd(), 'src', 'stories', 'generated', `${fileName}.stories.tsx`);
+                        const editedPath = path.join(process.cwd(), 'src', 'stories', 'edited', `${fileName}.stories.tsx`);
+                        if (fs.existsSync(generatedPath)) {
+                            filePath = generatedPath;
+                            sourceCode = fs.readFileSync(filePath, 'utf-8');
+                        }
+                        else if (fs.existsSync(editedPath)) {
+                            filePath = editedPath;
+                            sourceCode = fs.readFileSync(filePath, 'utf-8');
+                        }
+                        else {
+                            res.statusCode = 404;
+                            res.end(JSON.stringify({
+                                error: `File not found: ${fileName}`,
+                                searched: ['generated/', 'edited/']
+                            }));
+                            return;
+                        }
+                    }
+                    console.log(`[Vite Plugin] Successfully loaded from: ${filePath}`);
+                    res.setHeader('Content-Type', 'application/json');
+                    res.setHeader('Access-Control-Allow-Origin', '*');
+                    res.setHeader('Access-Control-Allow-Methods', 'GET');
+                    res.setHeader('Access-Control-Allow-Headers', 'Content-Type');
+                    res.end(JSON.stringify({
+                        success: true,
+                        fileName: fileName,
+                        source: sourceCode,
+                        loadedFrom: filePath
+                    }));
+                }
+                catch (error) {
+                    console.error('Error reading source file:', error);
+                    res.statusCode = 500;
+                    res.end(JSON.stringify({
+                        error: 'Failed to read source file',
+                        details: error instanceof Error ? error.message : 'Unknown error'
+                    }));
+                }
+            });
+        }
+    };
+}
+// https://vite.dev/config/
+export default defineConfig({
+    plugins: [react(), rawSourcePlugin()],
+});

package/dist/test-storybooks/web-components-shoelace/vite.config.js

@@ -0,0 +1,9 @@
+import { defineConfig } from 'vite';
+export default defineConfig({
+    build: {
+        target: 'esnext',
+    },
+    server: {
+        port: 5173,
+    },
+});

package/dist/tsconfig.tsbuildinfo

@@ -0,0 +1 @@
+{"root":["../index.ts","../story-ui.config.loader.ts","../story-ui.config.ts","../cli/index.ts","../cli/setup.ts","../mcp-server/index.ts","../mcp-server/mcp-stdio-server.ts","../mcp-server/sessionmanager.ts","../mcp-server/routes/claude.ts","../mcp-server/routes/components.ts","../mcp-server/routes/generatestory.ts","../mcp-server/routes/hybridstories.ts","../mcp-server/routes/memorystories.ts","../mcp-server/routes/storysync.ts","../playground/index.ts","../playground/styles.d.ts","../playground/components/canvas/index.ts","../playground/components/componentpalette/index.ts","../playground/components/layouthelpers/index.ts","../playground/components/propertiespanel/index.ts","../playground/components/propertyeditors/index.ts","../playground/components/treeview/index.ts","../playground/config/propertydefinitions.ts","../playground/hooks/usekeyboardshortcuts.ts","../playground/services/codegenerator.ts","../playground/services/dragdropmanager.ts","../playground/services/storyparser.ts","../playground/store/playgroundstore.ts","../playground/types/index.ts","../story-generator/componentblacklist.ts","../story-generator/componentdiscovery.ts","../story-generator/configloader.ts","../story-generator/considerationsloader.ts","../story-generator/documentation-sources.ts","../story-generator/documentationloader.ts","../story-generator/dynamicpackagediscovery.ts","../story-generator/enhancedcomponentdiscovery.ts","../story-generator/generatestory.ts","../story-generator/gitignoremanager.ts","../story-generator/inmemorystoryservice.ts","../story-generator/logger.ts","../story-generator/postprocessstory.ts","../story-generator/productiongitignoremanager.ts","../story-generator/promptgenerator.ts","../story-generator/storyhistory.ts","../story-generator/storysync.ts","../story-generator/storytracker.ts","../story-generator/storyvalidator.ts","../story-generator/universaldesignsystemadapter.ts","../story-generator/urlredirectservice.ts","../story-generator/validatestory.ts","../playground/components/aiassistant/aiassistant.tsx","../playground/components/canvas/canvas.tsx","../playground/components/canvas/canvaswithdnd.tsx","../playground/components/canvas/componentrenderer.tsx","../playground/components/canvas/draggablecomponent.tsx","../playground/components/codeview/codeview.tsx","../playground/components/componentpalette/componentpalette.tsx","../playground/components/dropzone/dropzone.tsx","../playground/components/exportdialog/exportdialog.tsx","../playground/components/layouthelpers/layouthelpers.tsx","../playground/components/playground/playground.tsx","../playground/components/propertiespanel/propertiespanel.tsx","../playground/components/propertyeditors/booleaneditor.tsx","../playground/components/propertyeditors/coloreditor.tsx","../playground/components/propertyeditors/iconeditor.tsx","../playground/components/propertyeditors/numbereditor.tsx","../playground/components/propertyeditors/selecteditor.tsx","../playground/components/propertyeditors/spacingeditor.tsx","../playground/components/propertyeditors/texteditor.tsx","../playground/components/propertyeditors/tokeneditor.tsx","../playground/components/treeview/treeview.tsx","../playground/stories/playgrounddragdrop.stories.tsx","../playground/stories/playgroundphase4.stories.tsx","../playground/stories/playgroundphase5.stories.tsx","../playground/stories/playgroundproperties.stories.tsx","../templates/storyui/storyuipanel.stories.tsx","../templates/storyui/storyuipanel.tsx","../templates/storyui/index.tsx"],"version":"5.8.3"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tpitre/story-ui",
-  "version": "2.8.0",
+  "version": "3.0.0",
   "description": "AI-powered Storybook story generator with dynamic component discovery",
   "type": "module",
   "main": "dist/index.js",

package/templates/StoryUI/StoryUIPanel.tsx

@@ -284,6 +284,30 @@ const isEdgeMode = () => {
          baseUrl.startsWith('https://') && !baseUrl.includes('localhost');
 };
 
+// Helper to convert story title to Storybook URL format
+// e.g., "Simple Card With Image" -> "generated-simple-card-with-image--default"
+const titleToStoryPath = (title: string): string => {
+  const kebabTitle = title.toLowerCase().replace(/[^a-z0-9]+/g, '-').replace(/^-|-$/g, '');
+  return `generated-${kebabTitle}--default`;
+};
+
+// Helper to navigate to a newly created story after generation completes
+// In dev mode with HMR, this prevents the "Couldn't find story after HMR" error
+// In all modes, this provides a better UX by auto-navigating to the new story
+const navigateToNewStory = (title: string, delayMs: number = 4000) => {
+  const storyPath = titleToStoryPath(title);
+  console.log(`[Story UI] Will navigate to story "${storyPath}" in ${delayMs}ms...`);
+
+  setTimeout(() => {
+    // Navigate the TOP window (parent Storybook UI), not the iframe
+    // The Story UI panel runs inside an iframe, so we need window.top to escape it
+    const topWindow = window.top || window;
+    const newUrl = `${topWindow.location.origin}/?path=/story/${storyPath}`;
+    console.log(`[Story UI] Navigating parent window to: ${newUrl}`);
+    topWindow.location.href = newUrl;
+  }, delayMs);
+};
+
 // Legacy helper for backwards compatibility
 const getApiPort = () => {
   const baseUrl = getApiBaseUrl();
@@ -1899,6 +1923,11 @@ function StoryUIPanel() {
       }
       saveChats(chats);
       setRecentChats(chats);
+
+      // Auto-navigate to the newly created story after HMR processes the file
+      // This prevents the "Couldn't find story after HMR" error by refreshing
+      // after the file system has been updated and HMR has processed the change
+      navigateToNewStory(chatTitle);
     }
   }, [activeChatId, activeTitle, conversation.length]);
 
@@ -2091,11 +2120,12 @@ function StoryUIPanel() {
             setRecentChats(chats);
           } else {
             const chatId = data.storyId || data.fileName || Date.now().toString();
+            const chatTitle = data.title || userInput;
             setActiveChatId(chatId);
-            setActiveTitle(data.title || userInput);
+            setActiveTitle(chatTitle);
             const newSession: ChatSession = {
               id: chatId,
-              title: data.title || userInput,
+              title: chatTitle,
               fileName: data.fileName || '',
               conversation: updatedConversation,
               lastUpdated: Date.now(),
@@ -2105,6 +2135,9 @@ function StoryUIPanel() {
             if (chats.length > MAX_RECENT_CHATS) chats.splice(MAX_RECENT_CHATS);
             saveChats(chats);
             setRecentChats(chats);
+
+            // Auto-navigate to the newly created story
+            navigateToNewStory(chatTitle);
           }
         } catch (fallbackErr: unknown) {
           const errorMessage = fallbackErr instanceof Error ? fallbackErr.message : 'Unknown error';