diff --git a/examples/official-storybook/stories/addon-docs/addon-docs.stories.js b/examples/official-storybook/stories/addon-docs/addon-docs.stories.js index c82415db5022..81e99d1aecd7 100644 --- a/examples/official-storybook/stories/addon-docs/addon-docs.stories.js +++ b/examples/official-storybook/stories/addon-docs/addon-docs.stories.js @@ -3,8 +3,10 @@ import notes from '../notes/notes.md'; import mdxNotes from '../notes/notes.mdx'; import { DocgenButton } from '../../components/DocgenButton'; +const docsTitle = title => `Docs/${title}`; + export default { - title: 'Addons/Docs/stories', + title: `Addons/${docsTitle('stories')}`, component: DocgenButton, }; diff --git a/lib/source-loader/src/server/abstract-syntax-tree/traverse-helpers.js b/lib/source-loader/src/server/abstract-syntax-tree/traverse-helpers.js index 744e8dc5f76e..be8ba1096008 100644 --- a/lib/source-loader/src/server/abstract-syntax-tree/traverse-helpers.js +++ b/lib/source-loader/src/server/abstract-syntax-tree/traverse-helpers.js @@ -96,31 +96,40 @@ export function findExportsMap(ast) { if (!titleProperty) { return { addsMap, idsToFrameworks }; } - const title = titleProperty.value.value; - - estraverse.traverse(ast, { - fallback: 'iteration', - enter: node => { - patchNode(node); - if ( - node.type === 'ExportNamedDeclaration' && - node.declaration && - node.declaration.declarations && - node.declaration.declarations.length === 1 && - node.declaration.declarations[0].type === 'VariableDeclarator' && - node.declaration.declarations[0].id && - node.declaration.declarations[0].id.name && - node.declaration.declarations[0].init && - ['CallExpression', 'ArrowFunctionExpression', 'FunctionExpression'].includes( - node.declaration.declarations[0].init.type - ) - ) { - const storyName = storyNameFromExport(node.declaration.declarations[0].id.name); - const toAdd = handleExportedName(title, storyName, node.declaration.declarations[0].init); - Object.assign(addsMap, toAdd); - } - }, - }); + const titleValue = titleProperty.value; + let title; + if (titleValue.type === 'TemplateLiteral' && titleValue.quasis.length > 0) { + // if a tagged template string. + title = titleValue.quasis[0].value.raw; + } else { + // if title is string: 'StringLiteral' + title = titleProperty.value.value; + } + if (title) { + estraverse.traverse(ast, { + fallback: 'iteration', + enter: node => { + patchNode(node); + if ( + node.type === 'ExportNamedDeclaration' && + node.declaration && + node.declaration.declarations && + node.declaration.declarations.length === 1 && + node.declaration.declarations[0].type === 'VariableDeclarator' && + node.declaration.declarations[0].id && + node.declaration.declarations[0].id.name && + node.declaration.declarations[0].init && + ['CallExpression', 'ArrowFunctionExpression', 'FunctionExpression'].includes( + node.declaration.declarations[0].init.type + ) + ) { + const storyName = storyNameFromExport(node.declaration.declarations[0].id.name); + const toAdd = handleExportedName(title, storyName, node.declaration.declarations[0].init); + Object.assign(addsMap, toAdd); + } + }, + }); + } return { addsMap, idsToFrameworks }; }