@tpitre/story-ui 2.2.0 → 2.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (188) hide show
  1. package/.env.sample +82 -11
  2. package/README.md +89 -0
  3. package/dist/cli/deploy.d.ts +17 -0
  4. package/dist/cli/deploy.d.ts.map +1 -0
  5. package/dist/cli/deploy.js +696 -0
  6. package/dist/cli/index.d.ts +3 -0
  7. package/dist/cli/index.d.ts.map +1 -0
  8. package/dist/cli/index.js +26 -2
  9. package/dist/cli/setup.d.ts +11 -0
  10. package/dist/cli/setup.d.ts.map +1 -0
  11. package/dist/cli/setup.js +437 -110
  12. package/dist/mcp-server/index.d.ts +2 -0
  13. package/dist/mcp-server/index.d.ts.map +1 -0
  14. package/dist/mcp-server/index.js +120 -2
  15. package/dist/mcp-server/mcp-stdio-server.d.ts +3 -0
  16. package/dist/mcp-server/mcp-stdio-server.d.ts.map +1 -0
  17. package/dist/mcp-server/mcp-stdio-server.js +8 -1
  18. package/dist/mcp-server/routes/claude.d.ts +3 -0
  19. package/dist/mcp-server/routes/claude.d.ts.map +1 -0
  20. package/dist/mcp-server/routes/claude.js +60 -23
  21. package/dist/mcp-server/routes/components.d.ts +4 -0
  22. package/dist/mcp-server/routes/components.d.ts.map +1 -0
  23. package/dist/mcp-server/routes/frameworks.d.ts +38 -0
  24. package/dist/mcp-server/routes/frameworks.d.ts.map +1 -0
  25. package/dist/mcp-server/routes/frameworks.js +183 -0
  26. package/dist/mcp-server/routes/generateStory.d.ts +3 -0
  27. package/dist/mcp-server/routes/generateStory.d.ts.map +1 -0
  28. package/dist/mcp-server/routes/generateStory.js +160 -76
  29. package/dist/mcp-server/routes/generateStoryStream.d.ts +12 -0
  30. package/dist/mcp-server/routes/generateStoryStream.d.ts.map +1 -0
  31. package/dist/mcp-server/routes/generateStoryStream.js +947 -0
  32. package/dist/mcp-server/routes/hybridStories.d.ts +18 -0
  33. package/dist/mcp-server/routes/hybridStories.d.ts.map +1 -0
  34. package/dist/mcp-server/routes/mcpRemote.d.ts +14 -0
  35. package/dist/mcp-server/routes/mcpRemote.d.ts.map +1 -0
  36. package/dist/mcp-server/routes/mcpRemote.js +489 -0
  37. package/dist/mcp-server/routes/memoryStories.d.ts +26 -0
  38. package/dist/mcp-server/routes/memoryStories.d.ts.map +1 -0
  39. package/dist/mcp-server/routes/providers.d.ts +89 -0
  40. package/dist/mcp-server/routes/providers.d.ts.map +1 -0
  41. package/dist/mcp-server/routes/providers.js +369 -0
  42. package/dist/mcp-server/routes/storySync.d.ts +26 -0
  43. package/dist/mcp-server/routes/storySync.d.ts.map +1 -0
  44. package/dist/mcp-server/routes/streamTypes.d.ts +110 -0
  45. package/dist/mcp-server/routes/streamTypes.d.ts.map +1 -0
  46. package/dist/mcp-server/routes/streamTypes.js +18 -0
  47. package/dist/mcp-server/sessionManager.d.ts +50 -0
  48. package/dist/mcp-server/sessionManager.d.ts.map +1 -0
  49. package/dist/story-generator/componentBlacklist.d.ts +21 -0
  50. package/dist/story-generator/componentBlacklist.d.ts.map +1 -0
  51. package/dist/story-generator/componentDiscovery.d.ts +28 -0
  52. package/dist/story-generator/componentDiscovery.d.ts.map +1 -0
  53. package/dist/story-generator/componentRegistryGenerator.d.ts +49 -0
  54. package/dist/story-generator/componentRegistryGenerator.d.ts.map +1 -0
  55. package/dist/story-generator/componentRegistryGenerator.js +205 -0
  56. package/dist/story-generator/configLoader.d.ts +33 -0
  57. package/dist/story-generator/configLoader.d.ts.map +1 -0
  58. package/dist/story-generator/considerationsLoader.d.ts +32 -0
  59. package/dist/story-generator/considerationsLoader.d.ts.map +1 -0
  60. package/dist/story-generator/documentation-sources.d.ts +28 -0
  61. package/dist/story-generator/documentation-sources.d.ts.map +1 -0
  62. package/dist/story-generator/documentationLoader.d.ts +64 -0
  63. package/dist/story-generator/documentationLoader.d.ts.map +1 -0
  64. package/dist/story-generator/dynamicPackageDiscovery.d.ts +97 -0
  65. package/dist/story-generator/dynamicPackageDiscovery.d.ts.map +1 -0
  66. package/dist/story-generator/enhancedComponentDiscovery.d.ts +125 -0
  67. package/dist/story-generator/enhancedComponentDiscovery.d.ts.map +1 -0
  68. package/dist/story-generator/enhancedComponentDiscovery.js +111 -11
  69. package/dist/story-generator/framework-adapters/angular-adapter.d.ts +40 -0
  70. package/dist/story-generator/framework-adapters/angular-adapter.d.ts.map +1 -0
  71. package/dist/story-generator/framework-adapters/angular-adapter.js +427 -0
  72. package/dist/story-generator/framework-adapters/base-adapter.d.ts +75 -0
  73. package/dist/story-generator/framework-adapters/base-adapter.d.ts.map +1 -0
  74. package/dist/story-generator/framework-adapters/base-adapter.js +147 -0
  75. package/dist/story-generator/framework-adapters/framework-detector.d.ts +55 -0
  76. package/dist/story-generator/framework-adapters/framework-detector.d.ts.map +1 -0
  77. package/dist/story-generator/framework-adapters/framework-detector.js +323 -0
  78. package/dist/story-generator/framework-adapters/index.d.ts +97 -0
  79. package/dist/story-generator/framework-adapters/index.d.ts.map +1 -0
  80. package/dist/story-generator/framework-adapters/index.js +198 -0
  81. package/dist/story-generator/framework-adapters/react-adapter.d.ts +40 -0
  82. package/dist/story-generator/framework-adapters/react-adapter.d.ts.map +1 -0
  83. package/dist/story-generator/framework-adapters/react-adapter.js +316 -0
  84. package/dist/story-generator/framework-adapters/svelte-adapter.d.ts +40 -0
  85. package/dist/story-generator/framework-adapters/svelte-adapter.d.ts.map +1 -0
  86. package/dist/story-generator/framework-adapters/svelte-adapter.js +372 -0
  87. package/dist/story-generator/framework-adapters/types.d.ts +182 -0
  88. package/dist/story-generator/framework-adapters/types.d.ts.map +1 -0
  89. package/dist/story-generator/framework-adapters/types.js +8 -0
  90. package/dist/story-generator/framework-adapters/vue-adapter.d.ts +36 -0
  91. package/dist/story-generator/framework-adapters/vue-adapter.d.ts.map +1 -0
  92. package/dist/story-generator/framework-adapters/vue-adapter.js +336 -0
  93. package/dist/story-generator/framework-adapters/web-components-adapter.d.ts +54 -0
  94. package/dist/story-generator/framework-adapters/web-components-adapter.d.ts.map +1 -0
  95. package/dist/story-generator/framework-adapters/web-components-adapter.js +387 -0
  96. package/dist/story-generator/generateStory.d.ts +7 -0
  97. package/dist/story-generator/generateStory.d.ts.map +1 -0
  98. package/dist/story-generator/gitignoreManager.d.ts +50 -0
  99. package/dist/story-generator/gitignoreManager.d.ts.map +1 -0
  100. package/dist/story-generator/imageProcessor.d.ts +80 -0
  101. package/dist/story-generator/imageProcessor.d.ts.map +1 -0
  102. package/dist/story-generator/imageProcessor.js +391 -0
  103. package/dist/story-generator/inMemoryStoryService.d.ts +89 -0
  104. package/dist/story-generator/inMemoryStoryService.d.ts.map +1 -0
  105. package/dist/story-generator/llm-providers/base-provider.d.ts +36 -0
  106. package/dist/story-generator/llm-providers/base-provider.d.ts.map +1 -0
  107. package/dist/story-generator/llm-providers/base-provider.js +135 -0
  108. package/dist/story-generator/llm-providers/claude-provider.d.ts +23 -0
  109. package/dist/story-generator/llm-providers/claude-provider.d.ts.map +1 -0
  110. package/dist/story-generator/llm-providers/claude-provider.js +414 -0
  111. package/dist/story-generator/llm-providers/gemini-provider.d.ts +24 -0
  112. package/dist/story-generator/llm-providers/gemini-provider.d.ts.map +1 -0
  113. package/dist/story-generator/llm-providers/gemini-provider.js +406 -0
  114. package/dist/story-generator/llm-providers/index.d.ts +63 -0
  115. package/dist/story-generator/llm-providers/index.d.ts.map +1 -0
  116. package/dist/story-generator/llm-providers/index.js +169 -0
  117. package/dist/story-generator/llm-providers/openai-provider.d.ts +24 -0
  118. package/dist/story-generator/llm-providers/openai-provider.d.ts.map +1 -0
  119. package/dist/story-generator/llm-providers/openai-provider.js +458 -0
  120. package/dist/story-generator/llm-providers/settings-manager.d.ts +75 -0
  121. package/dist/story-generator/llm-providers/settings-manager.d.ts.map +1 -0
  122. package/dist/story-generator/llm-providers/settings-manager.js +173 -0
  123. package/dist/story-generator/llm-providers/story-llm-service.d.ts +79 -0
  124. package/dist/story-generator/llm-providers/story-llm-service.d.ts.map +1 -0
  125. package/dist/story-generator/llm-providers/story-llm-service.js +240 -0
  126. package/dist/story-generator/llm-providers/types.d.ts +153 -0
  127. package/dist/story-generator/llm-providers/types.d.ts.map +1 -0
  128. package/dist/story-generator/llm-providers/types.js +8 -0
  129. package/dist/story-generator/logger.d.ts +14 -0
  130. package/dist/story-generator/logger.d.ts.map +1 -0
  131. package/dist/story-generator/logger.js +96 -29
  132. package/dist/story-generator/postProcessStory.d.ts +6 -0
  133. package/dist/story-generator/postProcessStory.d.ts.map +1 -0
  134. package/dist/story-generator/productionGitignoreManager.d.ts +91 -0
  135. package/dist/story-generator/productionGitignoreManager.d.ts.map +1 -0
  136. package/dist/story-generator/promptGenerator.d.ts +48 -0
  137. package/dist/story-generator/promptGenerator.d.ts.map +1 -0
  138. package/dist/story-generator/promptGenerator.js +186 -1
  139. package/dist/story-generator/storyHistory.d.ts +44 -0
  140. package/dist/story-generator/storyHistory.d.ts.map +1 -0
  141. package/dist/story-generator/storySync.d.ts +68 -0
  142. package/dist/story-generator/storySync.d.ts.map +1 -0
  143. package/dist/story-generator/storyTracker.d.ts +48 -0
  144. package/dist/story-generator/storyTracker.d.ts.map +1 -0
  145. package/dist/story-generator/storyValidator.d.ts +6 -0
  146. package/dist/story-generator/storyValidator.d.ts.map +1 -0
  147. package/dist/story-generator/universalDesignSystemAdapter.d.ts +68 -0
  148. package/dist/story-generator/universalDesignSystemAdapter.d.ts.map +1 -0
  149. package/dist/story-generator/universalDesignSystemAdapter.js +138 -1
  150. package/dist/story-generator/urlRedirectService.d.ts +21 -0
  151. package/dist/story-generator/urlRedirectService.d.ts.map +1 -0
  152. package/dist/story-generator/validateStory.d.ts +19 -0
  153. package/dist/story-generator/validateStory.d.ts.map +1 -0
  154. package/dist/story-generator/validateStory.js +6 -2
  155. package/dist/story-generator/visionPrompts.d.ts +88 -0
  156. package/dist/story-generator/visionPrompts.d.ts.map +1 -0
  157. package/dist/story-generator/visionPrompts.js +462 -0
  158. package/dist/story-ui.config.d.ts +78 -0
  159. package/dist/story-ui.config.d.ts.map +1 -0
  160. package/dist/templates/StoryUI/StoryUIPanel.d.ts +4 -0
  161. package/dist/templates/StoryUI/StoryUIPanel.d.ts.map +1 -0
  162. package/dist/templates/StoryUI/StoryUIPanel.js +1874 -0
  163. package/dist/templates/StoryUI/StoryUIPanel.stories.d.ts +18 -0
  164. package/dist/templates/StoryUI/StoryUIPanel.stories.d.ts.map +1 -0
  165. package/dist/templates/StoryUI/StoryUIPanel.stories.js +37 -0
  166. package/dist/templates/StoryUI/index.d.ts +3 -0
  167. package/dist/templates/StoryUI/index.d.ts.map +1 -0
  168. package/dist/templates/StoryUI/index.js +2 -0
  169. package/package.json +17 -3
  170. package/templates/StoryUI/StoryUIPanel.tsx +1960 -384
  171. package/templates/StoryUI/index.tsx +1 -1
  172. package/templates/StoryUI/manager.tsx +264 -0
  173. package/templates/production-app/.env.example +11 -0
  174. package/templates/production-app/index.html +66 -0
  175. package/templates/production-app/package.json +30 -0
  176. package/templates/production-app/public/favicon.svg +5 -0
  177. package/templates/production-app/src/App.tsx +1560 -0
  178. package/templates/production-app/src/LivePreviewRenderer.tsx +420 -0
  179. package/templates/production-app/src/componentRegistry.ts +315 -0
  180. package/templates/production-app/src/considerations.ts +16 -0
  181. package/templates/production-app/src/index.css +284 -0
  182. package/templates/production-app/src/main.tsx +25 -0
  183. package/templates/production-app/tsconfig.json +32 -0
  184. package/templates/production-app/tsconfig.node.json +11 -0
  185. package/templates/production-app/vite.config.ts +83 -0
  186. package/templates/react-import-rule.json +2 -2
  187. package/dist/index.js +0 -12
  188. package/dist/story-ui.config.loader.js +0 -205
@@ -0,0 +1,48 @@
1
+ import { StoryUIConfig } from '../story-ui.config.js';
2
+ export interface StoryMapping {
3
+ title: string;
4
+ fileName: string;
5
+ storyId: string;
6
+ hash: string;
7
+ createdAt: string;
8
+ updatedAt: string;
9
+ prompt: string;
10
+ }
11
+ export declare class StoryTracker {
12
+ private mappingFile;
13
+ private mappings;
14
+ constructor(config: StoryUIConfig);
15
+ /**
16
+ * Load existing mappings from disk
17
+ */
18
+ private loadMappings;
19
+ /**
20
+ * Save mappings to disk
21
+ */
22
+ private saveMappings;
23
+ /**
24
+ * Find an existing story by title
25
+ */
26
+ findByTitle(title: string): StoryMapping | undefined;
27
+ /**
28
+ * Find an existing story by prompt similarity
29
+ */
30
+ findByPrompt(prompt: string): StoryMapping | undefined;
31
+ /**
32
+ * Register a new or updated story
33
+ */
34
+ registerStory(mapping: StoryMapping): void;
35
+ /**
36
+ * Remove a story mapping
37
+ */
38
+ removeStory(titleOrFileName: string): boolean;
39
+ /**
40
+ * Get all story mappings
41
+ */
42
+ getAllMappings(): StoryMapping[];
43
+ /**
44
+ * Clean up orphaned mappings (stories that no longer exist)
45
+ */
46
+ cleanupOrphaned(generatedStoriesPath: string): number;
47
+ }
48
+ //# sourceMappingURL=storyTracker.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"storyTracker.d.ts","sourceRoot":"","sources":["../../story-generator/storyTracker.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAEtD,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,qBAAa,YAAY;IACvB,OAAO,CAAC,WAAW,CAAS;IAC5B,OAAO,CAAC,QAAQ,CAA4B;gBAEhC,MAAM,EAAE,aAAa;IAMjC;;OAEG;IACH,OAAO,CAAC,YAAY;IAgBpB;;OAEG;IACH,OAAO,CAAC,YAAY;IASpB;;OAEG;IACH,WAAW,CAAC,KAAK,EAAE,MAAM,GAAG,YAAY,GAAG,SAAS;IAkBpD;;OAEG;IACH,YAAY,CAAC,MAAM,EAAE,MAAM,GAAG,YAAY,GAAG,SAAS;IA4CtD;;OAEG;IACH,aAAa,CAAC,OAAO,EAAE,YAAY,GAAG,IAAI;IAwB1C;;OAEG;IACH,WAAW,CAAC,eAAe,EAAE,MAAM,GAAG,OAAO;IAqB7C;;OAEG;IACH,cAAc,IAAI,YAAY,EAAE;IAIhC;;OAEG;IACH,eAAe,CAAC,oBAAoB,EAAE,MAAM,GAAG,MAAM;CAiBtD"}
@@ -0,0 +1,6 @@
1
+ export interface ValidationError {
2
+ message: string;
3
+ line: number;
4
+ }
5
+ export declare function validateStory(storyContent: string): ValidationError[];
6
+ //# sourceMappingURL=storyValidator.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"storyValidator.d.ts","sourceRoot":"","sources":["../../story-generator/storyValidator.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,eAAe;IAC9B,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;CACd;AAED,wBAAgB,aAAa,CAAC,YAAY,EAAE,MAAM,GAAG,eAAe,EAAE,CA2CrE"}
@@ -0,0 +1,68 @@
1
+ import { StoryUIConfig } from '../story-ui.config.js';
2
+ export interface DesignSystemInfo {
3
+ name: string;
4
+ type: 'chakra-ui' | 'antd' | 'mantine' | 'shadcn' | 'generic';
5
+ scope?: string;
6
+ primaryPackage: string;
7
+ commonComponents: string[];
8
+ layoutComponents: string[];
9
+ formComponents: string[];
10
+ importPatterns: {
11
+ default: string[];
12
+ named: string[];
13
+ };
14
+ designTokens?: {
15
+ spacing?: string;
16
+ colors?: string;
17
+ typography?: string;
18
+ };
19
+ /** For shadcn/ui: parsed components.json configuration */
20
+ shadcnConfig?: {
21
+ style?: string;
22
+ aliases?: {
23
+ components?: string;
24
+ utils?: string;
25
+ ui?: string;
26
+ };
27
+ tailwind?: {
28
+ cssVariables?: boolean;
29
+ baseColor?: string;
30
+ };
31
+ };
32
+ }
33
+ /**
34
+ * Universal adapter to make Story UI work with any React design system
35
+ */
36
+ export declare class UniversalDesignSystemAdapter {
37
+ private projectRoot;
38
+ private detectedSystems;
39
+ constructor(projectRoot?: string);
40
+ /**
41
+ * Auto-detect which design systems are available in the project
42
+ */
43
+ detectDesignSystems(): Promise<DesignSystemInfo[]>;
44
+ /**
45
+ * Generate optimal Story UI config for detected design systems
46
+ */
47
+ generateOptimalConfig(): Partial<StoryUIConfig>;
48
+ /**
49
+ * Detect shadcn/ui by checking for components.json config file
50
+ * and common shadcn dependencies (class-variance-authority, tailwind-merge, etc.)
51
+ */
52
+ private checkForShadcn;
53
+ /**
54
+ * Discover which shadcn components are actually installed in the project
55
+ */
56
+ private discoverShadcnComponents;
57
+ private checkForChakraUI;
58
+ private checkForAntDesign;
59
+ private checkForMantine;
60
+ private checkForGenericReactComponents;
61
+ private getPrimaryDesignSystem;
62
+ private getShadcnConfig;
63
+ private getChakraUIConfig;
64
+ private getAntDesignConfig;
65
+ private getMantineConfig;
66
+ private getGenericReactConfig;
67
+ }
68
+ //# sourceMappingURL=universalDesignSystemAdapter.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"universalDesignSystemAdapter.d.ts","sourceRoot":"","sources":["../../story-generator/universalDesignSystemAdapter.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAEtD,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,WAAW,GAAG,MAAM,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;IAC9D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,cAAc,EAAE,MAAM,CAAC;IACvB,gBAAgB,EAAE,MAAM,EAAE,CAAC;IAC3B,gBAAgB,EAAE,MAAM,EAAE,CAAC;IAC3B,cAAc,EAAE,MAAM,EAAE,CAAC;IACzB,cAAc,EAAE;QACd,OAAO,EAAE,MAAM,EAAE,CAAC;QAClB,KAAK,EAAE,MAAM,EAAE,CAAC;KACjB,CAAC;IACF,YAAY,CAAC,EAAE;QACb,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,MAAM,CAAC,EAAE,MAAM,CAAC;QAChB,UAAU,CAAC,EAAE,MAAM,CAAC;KACrB,CAAC;IACF,0DAA0D;IAC1D,YAAY,CAAC,EAAE;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,OAAO,CAAC,EAAE;YACR,UAAU,CAAC,EAAE,MAAM,CAAC;YACpB,KAAK,CAAC,EAAE,MAAM,CAAC;YACf,EAAE,CAAC,EAAE,MAAM,CAAC;SACb,CAAC;QACF,QAAQ,CAAC,EAAE;YACT,YAAY,CAAC,EAAE,OAAO,CAAC;YACvB,SAAS,CAAC,EAAE,MAAM,CAAC;SACpB,CAAC;KACH,CAAC;CACH;AAED;;GAEG;AACH,qBAAa,4BAA4B;IACvC,OAAO,CAAC,WAAW,CAAS;IAC5B,OAAO,CAAC,eAAe,CAA0B;gBAErC,WAAW,GAAE,MAAsB;IAI/C;;OAEG;IACG,mBAAmB,IAAI,OAAO,CAAC,gBAAgB,EAAE,CAAC;IA8BxD;;OAEG;IACH,qBAAqB,IAAI,OAAO,CAAC,aAAa,CAAC;IAuB/C;;;OAGG;IACH,OAAO,CAAC,cAAc;IAwEtB;;OAEG;IACH,OAAO,CAAC,wBAAwB;IAuChC,OAAO,CAAC,gBAAgB;IAsBxB,OAAO,CAAC,iBAAiB;IAkBzB,OAAO,CAAC,eAAe;IAmBvB,OAAO,CAAC,8BAA8B;IA8BtC,OAAO,CAAC,sBAAsB;IAa9B,OAAO,CAAC,eAAe;IA8BvB,OAAO,CAAC,iBAAiB;IAkBzB,OAAO,CAAC,kBAAkB;IAkB1B,OAAO,CAAC,gBAAgB;IAcxB,OAAO,CAAC,qBAAqB;CAiB9B"}
@@ -26,6 +26,7 @@ export class UniversalDesignSystemAdapter {
26
26
  };
27
27
  this.detectedSystems = [];
28
28
  // Check for known design systems
29
+ this.checkForShadcn(allDeps);
29
30
  this.checkForChakraUI(allDeps);
30
31
  this.checkForAntDesign(allDeps);
31
32
  this.checkForMantine(allDeps);
@@ -42,6 +43,8 @@ export class UniversalDesignSystemAdapter {
42
43
  return this.getGenericReactConfig();
43
44
  }
44
45
  switch (primarySystem.type) {
46
+ case 'shadcn':
47
+ return this.getShadcnConfig(primarySystem);
45
48
  case 'chakra-ui':
46
49
  return this.getChakraUIConfig();
47
50
  case 'antd':
@@ -53,6 +56,111 @@ export class UniversalDesignSystemAdapter {
53
56
  }
54
57
  }
55
58
  // Design system detection methods
59
+ /**
60
+ * Detect shadcn/ui by checking for components.json config file
61
+ * and common shadcn dependencies (class-variance-authority, tailwind-merge, etc.)
62
+ */
63
+ checkForShadcn(deps) {
64
+ const componentsJsonPath = path.join(this.projectRoot, 'components.json');
65
+ const hasShadcnConfig = fs.existsSync(componentsJsonPath);
66
+ // Check for common shadcn/ui dependencies
67
+ const shadcnIndicators = [
68
+ 'class-variance-authority',
69
+ 'tailwind-merge',
70
+ 'clsx',
71
+ '@radix-ui/react-slot',
72
+ '@radix-ui/react-dialog',
73
+ '@radix-ui/react-dropdown-menu',
74
+ '@radix-ui/react-select',
75
+ 'lucide-react'
76
+ ];
77
+ const foundIndicators = shadcnIndicators.filter(pkg => deps[pkg]);
78
+ const hasStrongIndicators = foundIndicators.length >= 3;
79
+ if (hasShadcnConfig || hasStrongIndicators) {
80
+ let shadcnConfig = undefined;
81
+ let componentPath = '@/components/ui';
82
+ let utilsPath = '@/lib/utils';
83
+ // Parse components.json if it exists
84
+ if (hasShadcnConfig) {
85
+ try {
86
+ const configContent = fs.readFileSync(componentsJsonPath, 'utf-8');
87
+ const config = JSON.parse(configContent);
88
+ shadcnConfig = {
89
+ style: config.style,
90
+ aliases: config.aliases,
91
+ tailwind: config.tailwind ? {
92
+ cssVariables: config.tailwind.cssVariables,
93
+ baseColor: config.tailwind.baseColor
94
+ } : undefined
95
+ };
96
+ // Use configured paths
97
+ componentPath = config.aliases?.ui || config.aliases?.components || '@/components/ui';
98
+ utilsPath = config.aliases?.utils || '@/lib/utils';
99
+ logger.log(`📦 Found shadcn/ui config: style=${config.style}, components=${componentPath}`);
100
+ }
101
+ catch (error) {
102
+ logger.log('⚠️ Could not parse components.json, using defaults');
103
+ }
104
+ }
105
+ // Scan for actual shadcn components in the project
106
+ const discoveredComponents = this.discoverShadcnComponents();
107
+ this.detectedSystems.push({
108
+ name: 'shadcn/ui',
109
+ type: 'shadcn',
110
+ primaryPackage: componentPath,
111
+ commonComponents: discoveredComponents.length > 0
112
+ ? discoveredComponents
113
+ : ['Button', 'Card', 'Input', 'Dialog', 'Select', 'Checkbox', 'Label', 'Badge'],
114
+ layoutComponents: ['Card', 'Separator', 'Sheet', 'Tabs'],
115
+ formComponents: ['Input', 'Button', 'Select', 'Checkbox', 'RadioGroup', 'Switch', 'Textarea', 'Label'],
116
+ importPatterns: {
117
+ default: [],
118
+ named: ['cn'] // utility function
119
+ },
120
+ shadcnConfig
121
+ });
122
+ logger.log(`✨ Detected shadcn/ui with ${discoveredComponents.length || 'default'} components`);
123
+ }
124
+ }
125
+ /**
126
+ * Discover which shadcn components are actually installed in the project
127
+ */
128
+ discoverShadcnComponents() {
129
+ const components = [];
130
+ // Common paths where shadcn components might be located
131
+ const possiblePaths = [
132
+ path.join(this.projectRoot, 'components', 'ui'),
133
+ path.join(this.projectRoot, 'src', 'components', 'ui'),
134
+ path.join(this.projectRoot, 'app', 'components', 'ui'),
135
+ ];
136
+ for (const uiPath of possiblePaths) {
137
+ if (fs.existsSync(uiPath)) {
138
+ try {
139
+ const files = fs.readdirSync(uiPath);
140
+ for (const file of files) {
141
+ // Extract component name from file (button.tsx -> Button)
142
+ const match = file.match(/^([a-z-]+)\.(tsx|ts|jsx|js)$/i);
143
+ if (match) {
144
+ // Convert kebab-case to PascalCase (e.g., date-picker -> DatePicker)
145
+ const componentName = match[1]
146
+ .split('-')
147
+ .map(part => part.charAt(0).toUpperCase() + part.slice(1))
148
+ .join('');
149
+ components.push(componentName);
150
+ }
151
+ }
152
+ if (components.length > 0) {
153
+ logger.log(`📁 Found ${components.length} shadcn components in ${uiPath}`);
154
+ break;
155
+ }
156
+ }
157
+ catch (error) {
158
+ // Continue checking other paths
159
+ }
160
+ }
161
+ }
162
+ return components;
163
+ }
56
164
  checkForChakraUI(deps) {
57
165
  if (deps['@chakra-ui/react']) {
58
166
  this.detectedSystems.push({
@@ -136,7 +244,8 @@ export class UniversalDesignSystemAdapter {
136
244
  // Configuration generators
137
245
  getPrimaryDesignSystem() {
138
246
  // Prioritize based on completeness and popularity
139
- const priorities = ['chakra-ui', 'antd', 'mantine', 'generic'];
247
+ // shadcn first since it's explicitly configured in the project
248
+ const priorities = ['shadcn', 'chakra-ui', 'antd', 'mantine', 'generic'];
140
249
  for (const priority of priorities) {
141
250
  const system = this.detectedSystems.find(ds => ds.type === priority);
142
251
  if (system)
@@ -144,6 +253,34 @@ export class UniversalDesignSystemAdapter {
144
253
  }
145
254
  return this.detectedSystems[0] || null;
146
255
  }
256
+ getShadcnConfig(system) {
257
+ const componentPath = system.primaryPackage || '@/components/ui';
258
+ const utilsPath = system.shadcnConfig?.aliases?.utils || '@/lib/utils';
259
+ return {
260
+ designSystemGuidelines: {
261
+ name: "shadcn/ui",
262
+ preferredComponents: {
263
+ layout: componentPath,
264
+ buttons: componentPath,
265
+ forms: componentPath
266
+ },
267
+ // shadcn-specific guidelines for AI generation
268
+ additionalNotes: `
269
+ shadcn/ui components are locally installed in the project.
270
+ - Import components from "${componentPath}" (e.g., import { Button } from "${componentPath}/button")
271
+ - Use the cn() utility from "${utilsPath}" for conditional classes
272
+ - Components use Tailwind CSS for styling
273
+ - Use CSS variables for theming (--primary, --secondary, --muted, etc.)
274
+ - Prefer composition over configuration
275
+ `.trim()
276
+ },
277
+ layoutRules: {
278
+ multiColumnWrapper: "div",
279
+ columnComponent: "div",
280
+ containerComponent: "div"
281
+ }
282
+ };
283
+ }
147
284
  getChakraUIConfig() {
148
285
  return {
149
286
  designSystemGuidelines: {
@@ -0,0 +1,21 @@
1
+ export interface UrlRedirect {
2
+ oldUrl: string;
3
+ newUrl: string;
4
+ oldTitle: string;
5
+ newTitle: string;
6
+ timestamp: string;
7
+ storyId: string;
8
+ }
9
+ export declare class UrlRedirectService {
10
+ private redirectsPath;
11
+ private redirects;
12
+ constructor(storageDir: string);
13
+ private ensureDirectoryExists;
14
+ private loadRedirects;
15
+ private saveRedirects;
16
+ addRedirect(oldUrl: string, newUrl: string, oldTitle: string, newTitle: string, storyId: string): void;
17
+ getRedirect(oldUrl: string): UrlRedirect | null;
18
+ getAllRedirects(): UrlRedirect[];
19
+ getRedirectScript(): string;
20
+ }
21
+ //# sourceMappingURL=urlRedirectService.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"urlRedirectService.d.ts","sourceRoot":"","sources":["../../story-generator/urlRedirectService.ts"],"names":[],"mappings":"AAIA,MAAM,WAAW,WAAW;IAC1B,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,qBAAa,kBAAkB;IAC7B,OAAO,CAAC,aAAa,CAAS;IAC9B,OAAO,CAAC,SAAS,CAAuC;gBAE5C,UAAU,EAAE,MAAM;IAK9B,OAAO,CAAC,qBAAqB;IAO7B,OAAO,CAAC,aAAa;IAcrB,OAAO,CAAC,aAAa;IAWrB,WAAW,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM;IA8B/F,WAAW,CAAC,MAAM,EAAE,MAAM,GAAG,WAAW,GAAG,IAAI;IAI/C,eAAe,IAAI,WAAW,EAAE;IAKhC,iBAAiB,IAAI,MAAM;CAsE5B"}
@@ -0,0 +1,19 @@
1
+ export interface ValidationResult {
2
+ isValid: boolean;
3
+ errors: string[];
4
+ warnings: string[];
5
+ fixedCode?: string;
6
+ }
7
+ /**
8
+ * Validates TypeScript code syntax and attempts to fix common issues
9
+ */
10
+ export declare function validateStoryCode(code: string, fileName?: string, config?: any): ValidationResult;
11
+ /**
12
+ * Extracts and validates code blocks from AI responses
13
+ */
14
+ export declare function extractAndValidateCodeBlock(aiResponse: string, config?: any): ValidationResult;
15
+ /**
16
+ * Creates a fallback story template when generation fails
17
+ */
18
+ export declare function createFallbackStory(prompt: string, config: any): string;
19
+ //# sourceMappingURL=validateStory.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"validateStory.d.ts","sourceRoot":"","sources":["../../story-generator/validateStory.ts"],"names":[],"mappings":"AAKA,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,QAAQ,EAAE,MAAM,EAAE,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,GAAE,MAAoB,EAAE,MAAM,CAAC,EAAE,GAAG,GAAG,gBAAgB,CAgG9G;AAoYD;;GAEG;AACH,wBAAgB,2BAA2B,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,GAAG,GAAG,gBAAgB,CAqC9F;AAED;;GAEG;AACH,wBAAgB,mBAAmB,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,GAAG,MAAM,CA+BvE"}
@@ -50,10 +50,14 @@ export function validateStoryCode(code, fileName = 'story.tsx', config) {
50
50
  // Additional semantic checks
51
51
  const semanticErrors = performSemanticChecks(sourceFile, config);
52
52
  result.errors.push(...semanticErrors);
53
- // Check for React import
53
+ // Check for React import - but only for React-based frameworks
54
+ const framework = config?.framework || 'react';
55
+ const isReactFramework = framework === 'react' || framework.includes('react');
54
56
  const hasJSX = code.includes('<') || code.includes('/>');
55
57
  const hasReactImport = code.includes('import React from \'react\';');
56
- if (hasJSX && !hasReactImport) {
58
+ const hasLitHtml = code.includes('import { html }') || code.includes('from \'lit\'');
59
+ // Only require React import for React frameworks, and skip for web-components/angular/vue/svelte
60
+ if (hasJSX && !hasReactImport && isReactFramework && !hasLitHtml) {
57
61
  result.errors.push('Missing React import - add "import React from \'react\';" at the top of the file');
58
62
  result.isValid = false;
59
63
  }
@@ -0,0 +1,88 @@
1
+ /**
2
+ * Vision Prompts Module
3
+ *
4
+ * Provides specialized prompt templates for image-to-story generation using vision-capable LLMs.
5
+ * These prompts guide the AI to analyze UI screenshots, design mockups, and component layouts,
6
+ * then generate accurate Storybook CSF 3.0 stories.
7
+ *
8
+ * Critical Success Factors:
9
+ * - Precise visual-to-code mapping instructions
10
+ * - Explicit output format requirements
11
+ * - Edge case handling (unclear images, partial views)
12
+ * - Framework and design system awareness
13
+ */
14
+ /**
15
+ * Vision prompt types for different image analysis scenarios
16
+ */
17
+ export declare enum VisionPromptType {
18
+ /** Convert a UI screenshot to a complete Storybook story */
19
+ SCREENSHOT_TO_STORY = "screenshot_to_story",
20
+ /** Convert a design mockup (Figma, Sketch, etc.) to a story */
21
+ DESIGN_TO_STORY = "design_to_story",
22
+ /** Analyze and identify components present in an image */
23
+ COMPONENT_ANALYSIS = "component_analysis",
24
+ /** Analyze layout structure, spacing, and responsive behavior */
25
+ LAYOUT_ANALYSIS = "layout_analysis"
26
+ }
27
+ /**
28
+ * Options for building vision-aware prompts
29
+ */
30
+ export interface VisionPromptOptions {
31
+ /** Type of vision analysis to perform */
32
+ promptType: VisionPromptType;
33
+ /** User's description of what they want to achieve */
34
+ userDescription?: string;
35
+ /** Available components from the design system */
36
+ availableComponents?: string[];
37
+ /** Target framework (react, vue, angular, svelte) */
38
+ framework?: string;
39
+ /** Design system being used (chakra-ui, mantine, material-ui, ant-design) */
40
+ designSystem?: string;
41
+ /** Additional context or constraints */
42
+ additionalContext?: string;
43
+ }
44
+ /**
45
+ * Generate system prompt for vision-based story generation
46
+ *
47
+ * This prompt establishes the AI's role, capabilities, and expected output format.
48
+ * It's crucial for consistent, high-quality story generation from images.
49
+ */
50
+ export declare function getVisionSystemPrompt(type: VisionPromptType, availableComponents?: string[]): string;
51
+ /**
52
+ * Generate user prompt to accompany the image
53
+ *
54
+ * This is the direct instruction sent with the image to the LLM.
55
+ */
56
+ export declare function getVisionUserPrompt(type: VisionPromptType, additionalContext?: string): string;
57
+ /**
58
+ * Build a complete vision-aware prompt combining system and user prompts
59
+ *
60
+ * This is the main entry point for generating vision prompts with full context.
61
+ */
62
+ export declare function buildVisionAwarePrompt(options: VisionPromptOptions): {
63
+ systemPrompt: string;
64
+ userPrompt: string;
65
+ };
66
+ /**
67
+ * Helper function to validate image input for vision analysis
68
+ *
69
+ * Checks that the image is in a supported format and provides guidance if not.
70
+ */
71
+ export declare function validateImageInput(imagePath: string): {
72
+ valid: boolean;
73
+ error?: string;
74
+ suggestions?: string[];
75
+ };
76
+ /**
77
+ * Helper function to suggest optimal image quality for vision analysis
78
+ */
79
+ export declare function getImageQualityGuidelines(): string[];
80
+ /**
81
+ * Extract framework-specific import patterns for generated stories
82
+ */
83
+ export declare function getFrameworkImports(framework: string): string;
84
+ /**
85
+ * Get design system specific import hints
86
+ */
87
+ export declare function getDesignSystemImports(designSystem: string): string[];
88
+ //# sourceMappingURL=visionPrompts.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"visionPrompts.d.ts","sourceRoot":"","sources":["../../story-generator/visionPrompts.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AAEH;;GAEG;AACH,oBAAY,gBAAgB;IAC1B,4DAA4D;IAC5D,mBAAmB,wBAAwB;IAE3C,+DAA+D;IAC/D,eAAe,oBAAoB;IAEnC,0DAA0D;IAC1D,kBAAkB,uBAAuB;IAEzC,iEAAiE;IACjE,eAAe,oBAAoB;CACpC;AAED;;GAEG;AACH,MAAM,WAAW,mBAAmB;IAClC,yCAAyC;IACzC,UAAU,EAAE,gBAAgB,CAAC;IAE7B,sDAAsD;IACtD,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,kDAAkD;IAClD,mBAAmB,CAAC,EAAE,MAAM,EAAE,CAAC;IAE/B,qDAAqD;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,6EAA6E;IAC7E,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,wCAAwC;IACxC,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED;;;;;GAKG;AACH,wBAAgB,qBAAqB,CACnC,IAAI,EAAE,gBAAgB,EACtB,mBAAmB,CAAC,EAAE,MAAM,EAAE,GAC7B,MAAM,CAwCR;AA6MD;;;;GAIG;AACH,wBAAgB,mBAAmB,CACjC,IAAI,EAAE,gBAAgB,EACtB,iBAAiB,CAAC,EAAE,MAAM,GACzB,MAAM,CAkFR;AAED;;;;GAIG;AACH,wBAAgB,sBAAsB,CAAC,OAAO,EAAE,mBAAmB,GAAG;IACpE,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;CACpB,CAwCA;AAED;;;;GAIG;AACH,wBAAgB,kBAAkB,CAAC,SAAS,EAAE,MAAM,GAAG;IACrD,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;CACxB,CAiBA;AAED;;GAEG;AACH,wBAAgB,yBAAyB,IAAI,MAAM,EAAE,CAWpD;AAED;;GAEG;AACH,wBAAgB,mBAAmB,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM,CAW7D;AAED;;GAEG;AACH,wBAAgB,sBAAsB,CAAC,YAAY,EAAE,MAAM,GAAG,MAAM,EAAE,CAyBrE"}