Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Addon-docs: Switch Meta block to receive all module exports #18514

Merged
merged 4 commits into from
Jun 20, 2022
Merged

Addon-docs: Switch Meta block to receive all module exports #18514

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
f5ebdde
Switch `<Meta of={}>` to expect full exports
tmeasday Jun 20, 2022
11568f7
Use `<Stories>` component in `MetaOf`
tmeasday Jun 20, 2022
a6c6869
Fixes from CI
tmeasday Jun 20, 2022
3dae5e2
Update addons/docs/src/blocks/DocsContainer.tsx
shilman Jun 20, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Fixes from CI
  • Loading branch information
@tmeasday
tmeasday committed Jun 20, 2022
commit a6c6869265fc54d6cdfd534699e2f3a8336938d0
1 change: 1 addition & 0 deletions addons/docs/src/blocks/DocsContainer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,7 @@ export const DocsContainer: FunctionComponent<DocsContainerProps> = ({ context,
const { id: storyId, type, storyById } = context;
const allComponents = { ...defaultComponents };
let theme = ensureTheme(null);
console.log(context);
if (type === 'legacy') {
const {
parameters: { options = {}, docs = {} },
Expand Down
2 changes: 1 addition & 1 deletion addons/docs/src/blocks/DocsRenderer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import { DocsRenderFunction } from '@storybook/preview-web';

import { DocsContainer } from './DocsContainer';
import { DocsPage } from './DocsPage';
import { DocsContext, DocsContextProps } from './DocsContext';
import { DocsContextProps } from './DocsContext';

export class DocsRenderer<TFramework extends AnyFramework> {
public render: DocsRenderFunction<TFramework>;
Expand Down
21 changes: 14 additions & 7 deletions addons/docs/src/blocks/ExternalPreview.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import { StoryId } from '@storybook/csf';
import { ExternalPreview } from './ExternalPreview';

const projectAnnotations = { render: jest.fn(), renderToDOM: jest.fn() };
Expand All @@ -18,7 +19,10 @@ describe('ExternalPreview', () => {
it('handles csf files with titles', async () => {
const preview = new ExternalPreview(projectAnnotations);

const storyId = preview.storyIdByModuleExport(csfFileWithTitle.one, csfFileWithTitle.default);
const storyId = preview.storyIdByModuleExport(
csfFileWithTitle.one,
csfFileWithTitle
) as StoryId;
const story = preview.storyById(storyId);

expect(story).toMatchObject({
Expand All @@ -30,10 +34,13 @@ describe('ExternalPreview', () => {
it('returns consistent story ids and objects', () => {
const preview = new ExternalPreview(projectAnnotations);

const storyId = preview.storyIdByModuleExport(csfFileWithTitle.one, csfFileWithTitle.default);
const storyId = preview.storyIdByModuleExport(
csfFileWithTitle.one,
csfFileWithTitle
) as StoryId;
const story = preview.storyById(storyId);

expect(preview.storyIdByModuleExport(csfFileWithTitle.one, csfFileWithTitle.default)).toEqual(
expect(preview.storyIdByModuleExport(csfFileWithTitle.one, csfFileWithTitle)).toEqual(
storyId
);
expect(preview.storyById(storyId)).toBe(story);
Expand All @@ -43,11 +50,11 @@ describe('ExternalPreview', () => {
const preview = new ExternalPreview(projectAnnotations);

preview.storyById(
preview.storyIdByModuleExport(csfFileWithTitle.one, csfFileWithTitle.default)
preview.storyIdByModuleExport(csfFileWithTitle.one, csfFileWithTitle) as StoryId
);

const story = preview.storyById(
preview.storyIdByModuleExport(csfFileWithTitle.two, csfFileWithTitle.default)
preview.storyIdByModuleExport(csfFileWithTitle.two, csfFileWithTitle) as StoryId
);
expect(story).toMatchObject({
title: 'Component',
Expand All @@ -60,8 +67,8 @@ describe('ExternalPreview', () => {

const storyId = preview.storyIdByModuleExport(
csfFileWithoutTitle.one,
csfFileWithoutTitle.default
);
csfFileWithoutTitle
) as StoryId;
const story = preview.storyById(storyId);

expect(story).toMatchObject({
Expand Down
2 changes: 1 addition & 1 deletion addons/docs/src/blocks/ExternalPreview.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ export class ExternalPreview<TFramework extends AnyFramework> extends Preview<TF
const importPath = this.importPaths.get(meta);
this.moduleExportsByImportPath[importPath] = meta;

const title = meta.title || this.titles.get(meta);
const title = meta.default.title || this.titles.get(meta);

const exportEntry = Object.entries(meta).find(
([_, moduleExport]) => moduleExport === storyExport
Expand Down
1 change: 1 addition & 0 deletions examples/official-storybook/stories/addon-docs/mdx.stories.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,7 @@ DarkModeDocs.decorators = [
(storyFn) => (
<DocsContainer
context={{
type: 'legacy',
componentStories: () => [],
storyById: () => ({ parameters: { docs: { theme: themes.dark } } }),
}}
Expand Down