@pure-ds/storybook 0.1.16 → 0.3.8

package/.storybook/main.js

@@ -16,7 +16,9 @@ const normalizePath = (path) => path.replace(/\\/g, '/');
 /** @type { import('@storybook/web-components-vite').StorybookConfig } */
 const config = {
   stories: [
-    '../stories/**/*.stories.@(js|jsx|mjs|ts|tsx)',
+    process.env.PDS_STORIES_PATH 
+      ? normalizePath(resolve(process.env.PDS_STORIES_PATH, '**/*.stories.@(js|jsx|mjs|ts|tsx)'))
+      : '../stories/**/*.stories.@(js|jsx|mjs|ts|tsx)',
     // Include user stories from the project root, but only if we are NOT running in the package itself
     ...(process.cwd() === resolve(__dirname, '..') ? [] : [
       normalizePath(resolve(process.cwd(), 'stories/**/*.stories.@(js|jsx|mjs|ts|tsx)')),
@@ -45,12 +47,20 @@ const config = {
   },
   viteFinal: async (config) => {
     // Ensure Lit import alias is resolved
-    config.resolve.alias = {
+    const aliases = {
       ...config.resolve.alias,
       '#pds/lit': 'lit',
-      '@pds-src': pdsSrcPath,
     };
 
+    // In monorepo, pds-configurator is in a separate package, not in src/js
+    // This must be defined BEFORE @pds-src to take precedence
+    if (!isPackage) {
+       aliases['@pds-src/js/pds-configurator'] = resolve(currentDirname, '../../../packages/pds-configurator/src');
+    }
+
+    aliases['@pds-src'] = pdsSrcPath;
+    config.resolve.alias = aliases;
+
     // Alias for relative paths to src (handles ../../../src in stories)
     // This allows stories to work in both monorepo (where ../../../src is valid)
     // and package (where it needs to be mapped to the local src folder)

package/bin/index.js

@@ -3,6 +3,7 @@
 import { spawn } from 'child_process';
 import { fileURLToPath } from 'url';
 import { dirname, join } from 'path';
+import fs from 'fs';
 
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = dirname(__filename);
@@ -23,6 +24,54 @@ if (command !== 'build' && !args.includes('-p') && !args.includes('--port')) {
   storybookArgs.push('-p', '6006');
 }
 
+// Check if running in custom mode (consumer project)
+if (process.cwd() !== packageRoot) {
+  try {
+    const cacheDir = join(process.cwd(), 'node_modules', '.cache', 'pds-storybook', 'stories');
+    const srcStoriesDir = join(packageRoot, 'stories');
+    
+    console.log(`Preparing PDS stories in ${cacheDir}...`);
+    
+    if (fs.existsSync(cacheDir)) {
+      fs.rmSync(cacheDir, { recursive: true, force: true });
+    }
+    fs.mkdirSync(cacheDir, { recursive: true });
+    
+    const copyAndTransform = (src, dest) => {
+      if (!fs.existsSync(src)) return;
+      
+      const entries = fs.readdirSync(src, { withFileTypes: true });
+      for (const entry of entries) {
+        const srcPath = join(src, entry.name);
+        const destPath = join(dest, entry.name);
+        
+        if (entry.isDirectory()) {
+          fs.mkdirSync(destPath, { recursive: true });
+          copyAndTransform(srcPath, destPath);
+        } else if (entry.isFile()) {
+          if (entry.name.endsWith('.stories.js') || entry.name.endsWith('.stories.ts') || entry.name.endsWith('.stories.mjs')) {
+            let content = fs.readFileSync(srcPath, 'utf-8');
+            // Prepend PDS/ to title
+            content = content.replace(/(title:\s*['"])(.+?)(['"])/, (match, prefix, title, suffix) => {
+              if (title.startsWith('PDS/')) return match;
+              return `${prefix}PDS/${title}${suffix}`;
+            });
+            fs.writeFileSync(destPath, content);
+          } else {
+            fs.copyFileSync(srcPath, destPath);
+          }
+        }
+      }
+    };
+    
+    copyAndTransform(srcStoriesDir, cacheDir);
+    process.env.PDS_STORIES_PATH = cacheDir.replace(/\\/g, '/');
+    
+  } catch (err) {
+    console.error('Error preparing PDS stories:', err);
+  }
+}
+
 console.log(`Running Storybook with config: ${configDir}`);
 
 const child = spawn('npx', ['storybook', ...storybookArgs], {

package/dist/pds-reference.json

@@ -1,5 +1,5 @@
 {
-  "generatedAt": "2025-12-16T13:39:44.048Z",
+  "generatedAt": "2025-12-18T09:21:39.368Z",
   "sources": {
     "customElements": "custom-elements.json",
     "ontology": "src\\js\\pds-core\\pds-ontology.js",
@@ -114,12 +114,18 @@
     "pds-drawer": {
       "tag": "pds-drawer",
       "className": "anonymous_0",
-      "displayName": "pds-drawer",
-      "storyTitle": "PDS/Components/pds-drawer",
-      "category": "PDS/Components",
+      "displayName": "Pds Drawer",
+      "storyTitle": "Components/Pds Drawer",
+      "category": "Components",
       "description": null,
       "docsDescription": "Slide-out panels from any edge",
-      "pdsTags": [],
+      "pdsTags": [
+        "autodocs",
+        "grouping",
+        "interaction",
+        "layout",
+        "navigation"
+      ],
       "ontology": {
         "id": "pds-drawer",
         "name": "Drawer",
@@ -131,7 +137,7 @@
         {
           "exportName": "Default",
           "name": "Default",
-          "id": "pds-components-pds-drawer--default",
+          "id": "components-pds-drawer--default",
           "tags": [],
           "description": null,
           "source": "stories\\components\\PdsDrawer.stories.js"
@@ -307,18 +313,24 @@
     "pds-icon": {
       "tag": "pds-icon",
       "className": "SvgIcon",
-      "displayName": "pds-icon",
-      "storyTitle": "PDS/Components/pds-icon",
-      "category": "PDS/Components",
+      "displayName": "Pds Icon",
+      "storyTitle": "Components/Pds Icon",
+      "category": "Components",
       "description": "SVG Icon Web Component",
       "docsDescription": "SVG sprite icons with fallbacks",
-      "pdsTags": [],
+      "pdsTags": [
+        "autodocs",
+        "buttons",
+        "icons",
+        "sprite",
+        "svg"
+      ],
       "ontology": null,
       "stories": [
         {
           "exportName": "Default",
           "name": "Default",
-          "id": "pds-components-pds-icon--default",
+          "id": "components-pds-icon--default",
           "tags": [],
           "description": null,
           "source": "stories\\components\\PdsIcon.stories.js"
@@ -1420,12 +1432,17 @@
     "pds-tabstrip": {
       "tag": "pds-tabstrip",
       "className": "TabStrip",
-      "displayName": "pds-tabstrip",
-      "storyTitle": "PDS/Components/pds-tabstrip",
-      "category": "PDS/Components",
+      "displayName": "Pds Tabstrip",
+      "storyTitle": "Components/Pds Tabstrip",
+      "category": "Components",
       "description": "Tab navigation component that pairs anchors with `pds-tabpanel` children.",
       "docsDescription": "Accessible tab interface with keyboard navigation",
-      "pdsTags": [],
+      "pdsTags": [
+        "autodocs",
+        "grouping",
+        "layout",
+        "navigation"
+      ],
       "ontology": {
         "id": "pds-tabstrip",
         "name": "Tab Strip",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pure-ds/storybook",
-  "version": "0.1.16",
+  "version": "0.3.8",
   "description": "Storybook showcase for Pure Design System with live configuration",
   "type": "module",
   "private": false,