|
| 1 | +/* eslint-disable @typescript-eslint/no-unsafe-return */ |
| 2 | + |
| 3 | +import { execSync } from 'child_process'; |
| 4 | +import fs from 'fs'; |
| 5 | +import path from 'path'; |
| 6 | + |
| 7 | +const ROOT_DIR = process.cwd(); |
| 8 | +const STORIES_GLOB_EXT = '.stories.tsx'; |
| 9 | +const OUTPUT_DIR = process.env.STORYBOOK_OUTPUT_DIR || '.out-reorder'; |
| 10 | + |
| 11 | +// Fixed replacements |
| 12 | +const MDX_META_REPLACEMENTS = { |
| 13 | + 'docs/ReadMeAI.mdx': 'ui5-webcomponents-ai-react', |
| 14 | + 'docs/ReadMeCharts.mdx': 'ui5-webcomponents-react-charts', |
| 15 | + 'docs/ReadMeCompat.mdx': 'ui5-webcomponents-react-compat', |
| 16 | + 'packages/main/src/components/AnalyticalTable/PluginAnnounceEmptyCells.mdx': 'ui5-webcomponents-react', |
| 17 | + 'packages/main/src/components/AnalyticalTable/PluginDisableRowSelection.mdx': 'ui5-webcomponents-react', |
| 18 | + 'packages/main/src/components/AnalyticalTable/PluginIndeterminateRowSelection.mdx': 'ui5-webcomponents-react', |
| 19 | + 'packages/main/src/components/AnalyticalTable/PluginManualRowSelect.mdx': 'ui5-webcomponents-react', |
| 20 | + 'packages/main/src/components/AnalyticalTable/PluginOnColumnResize.mdx': 'ui5-webcomponents-react', |
| 21 | + 'packages/main/src/components/AnalyticalTable/PluginOrderedMultiSort.mdx': 'ui5-webcomponents-react', |
| 22 | + 'packages/main/src/components/AnalyticalTable/Recipes.mdx': 'ui5-webcomponents-react', |
| 23 | +}; |
| 24 | + |
| 25 | +function getStoryFiles(dir) { |
| 26 | + if (!fs.existsSync(dir)) return []; |
| 27 | + let files = []; |
| 28 | + for (const file of fs.readdirSync(dir)) { |
| 29 | + const fullPath = path.join(dir, file); |
| 30 | + const stat = fs.statSync(fullPath); |
| 31 | + if (stat.isDirectory()) { |
| 32 | + files = files.concat(getStoryFiles(fullPath)); |
| 33 | + } else if (file.endsWith(STORIES_GLOB_EXT)) { |
| 34 | + files.push(fullPath); |
| 35 | + } |
| 36 | + } |
| 37 | + return files; |
| 38 | +} |
| 39 | + |
| 40 | +// Extract package name from tags (e.g.: ['package:@ui5/webcomponents']) |
| 41 | +function getPackageName(content) { |
| 42 | + const match = content.match(/['"`]package:([^'"`]+)['"`]/); |
| 43 | + return match ? match[1] : null; |
| 44 | +} |
| 45 | + |
| 46 | +function resolveFirstSegment(packageName, titleParts) { |
| 47 | + const clean = packageName.replace(/^@ui5\//, 'ui5-'); |
| 48 | + |
| 49 | + switch (packageName) { |
| 50 | + case '@ui5/webcomponents': |
| 51 | + case '@ui5/webcomponents-fiori': { |
| 52 | + return ['ui5-webcomponents-react', clean, ...titleParts].join(' / '); |
| 53 | + } |
| 54 | + default: { |
| 55 | + // replace first segment if multiple, else prepend |
| 56 | + if (titleParts.length > 1) { |
| 57 | + return [clean, ...titleParts.slice(1)].join(' / '); |
| 58 | + } else { |
| 59 | + return [clean, ...titleParts].join(' / '); |
| 60 | + } |
| 61 | + } |
| 62 | + } |
| 63 | +} |
| 64 | + |
| 65 | +// Replace first segment in Storybook `title:` |
| 66 | +function adjustStoryTitle(content, packageName) { |
| 67 | + return content.replace(/title:\s*(['"`])([^'"`]+)\1/, (_, quote, title) => { |
| 68 | + const parts = title.split(' / '); |
| 69 | + const newTitle = resolveFirstSegment(packageName, parts); |
| 70 | + return `title: ${quote}${newTitle}${quote}`; |
| 71 | + }); |
| 72 | +} |
| 73 | + |
| 74 | +// Adjust <Meta title="..."/> |
| 75 | +function adjustMdxMetaTitle(content, newFirstSegment) { |
| 76 | + return content.replace(/<Meta\s+title\s*=\s*(['"`])([^'"`]+)\1\s*\/>/, (m, quote, title) => { |
| 77 | + const parts = title.split(' / '); |
| 78 | + const newTitle = |
| 79 | + parts.length > 1 ? [newFirstSegment, ...parts.slice(1)].join(' / ') : `${newFirstSegment} / ${title}`; |
| 80 | + return `<Meta title=${quote}${newTitle}${quote} />`; |
| 81 | + }); |
| 82 | +} |
| 83 | + |
| 84 | +function main() { |
| 85 | + const storyFiles = getStoryFiles(ROOT_DIR); |
| 86 | + const mdxFiles = Object.keys(MDX_META_REPLACEMENTS) |
| 87 | + .map((rel) => path.join(ROOT_DIR, rel)) |
| 88 | + .filter((p) => fs.existsSync(p)); |
| 89 | + |
| 90 | + const allFiles = [...storyFiles, ...mdxFiles]; |
| 91 | + |
| 92 | + if (!allFiles.length) { |
| 93 | + console.log('No story or MDX files found.'); |
| 94 | + return; |
| 95 | + } |
| 96 | + |
| 97 | + // Backup originals |
| 98 | + const backups = allFiles.map((file) => ({ |
| 99 | + file, |
| 100 | + content: fs.readFileSync(file, 'utf-8'), |
| 101 | + })); |
| 102 | + |
| 103 | + // Update stories |
| 104 | + storyFiles.forEach((file) => { |
| 105 | + const original = backups.find((b) => b.file === file).content; |
| 106 | + const packageName = getPackageName(original); |
| 107 | + if (!packageName) return; // skip if no package tag |
| 108 | + const updated = adjustStoryTitle(original, packageName); |
| 109 | + fs.writeFileSync(file, updated, 'utf-8'); |
| 110 | + }); |
| 111 | + |
| 112 | + // Update mdx |
| 113 | + mdxFiles.forEach((absPath) => { |
| 114 | + const original = backups.find((b) => b.file === absPath).content; |
| 115 | + const rel = path.relative(ROOT_DIR, absPath).replace(/\\/g, '/'); |
| 116 | + const newFirstSegment = MDX_META_REPLACEMENTS[rel]; |
| 117 | + const updated = adjustMdxMetaTitle(original, newFirstSegment); |
| 118 | + fs.writeFileSync(absPath, updated, 'utf-8'); |
| 119 | + }); |
| 120 | + |
| 121 | + // Build Sb |
| 122 | + execSync(`npx storybook build -o ${OUTPUT_DIR}`, { stdio: 'inherit' }); |
| 123 | + |
| 124 | + // Restore originals |
| 125 | + backups.forEach((b) => fs.writeFileSync(b.file, b.content, 'utf-8')); |
| 126 | + |
| 127 | + console.log(`Storybook built in '${OUTPUT_DIR}' and source files restored.`); |
| 128 | +} |
| 129 | + |
| 130 | +main(); |
0 commit comments