@storybook/addon-docs 7.0.0-alpha.46 → 7.0.0-alpha.48

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 (7) hide show
  1. package/README.md +2 -2
  2. package/dist/cjs/preset.js +18 -20
  3. package/dist/esm/preset.js +19 -20
  4. package/dist/types/preset.d.ts +4 -1
  5. package/jest-transform-mdx.js +2 -2
  6. package/package.json +18 -18
  7. package/mdx-compiler-plugin.js +0 -1
package/README.md CHANGED
@@ -142,7 +142,7 @@ module.exports = {
142
142
  options: {
143
143
  configureJSX: true,
144
144
  babelOptions: {},
145
- sourceLoaderOptions: null,
145
+ csfPluginOptions: null,
146
146
  transcludeMarkdown: true,
147
147
  },
148
148
  },
@@ -152,7 +152,7 @@ module.exports = {
152
152
 
153
153
  The `configureJSX` option is useful when you're writing your docs in MDX and your project's babel config isn't already set up to handle JSX files. `babelOptions` is a way to further configure the babel processor when you're using `configureJSX`.
154
154
 
155
- `sourceLoaderOptions` is an object for configuring `@storybook/source-loader`. When set to `null` it tells docs not to run the `source-loader` at all, which can be used as an optimization, or if you're already using `source-loader` in your `main.js`.
155
+ `csfPluginOptions` is an object for configuring `@storybook/csf-plugin`. When set to `null` it tells docs not to run the `csf-plugin` at all, which can be used as an optimization, or if you're already using `csf-plugin` in your `main.js`.
156
156
 
157
157
  The `transcludeMarkdown` option enables mdx files to import `.md` files and render them as a component.
158
158
 
package/dist/cjs/preset.js CHANGED
@@ -12,7 +12,7 @@ var _remarkSlug = _interopRequireDefault(require("remark-slug"));
12
12
 
13
13
  var _remarkExternalLinks = _interopRequireDefault(require("remark-external-links"));
14
14
 
15
- var _nodeLogger = require("@storybook/node-logger");
15
+ var _tsDedent = require("ts-dedent");
16
16
 
17
17
  var _csfTools = require("@storybook/csf-tools");
18
18
 
@@ -62,9 +62,8 @@ async function webpack(webpackConfig = {}, options) {
62
62
  babelOptions,
63
63
  mdxBabelOptions,
64
64
  configureJSX = true,
65
- sourceLoaderOptions = {
66
- injectStoryParameters: true
67
- },
65
+ csfPluginOptions = {},
66
+ sourceLoaderOptions = null,
68
67
  transcludeMarkdown = false
69
68
  } = options;
70
69
  const mdxLoaderOptions = {
@@ -73,19 +72,18 @@ async function webpack(webpackConfig = {}, options) {
73
72
  remarkPlugins: [_remarkSlug.default, _remarkExternalLinks.default]
74
73
  };
75
74
 
76
- _nodeLogger.logger.info(`Addon-docs: using MDX2`);
75
+ if (sourceLoaderOptions) {
76
+ throw new Error((0, _tsDedent.dedent)`
77
+ Addon-docs no longer uses source-loader in 7.0.
77
78
 
78
- const mdxLoader = require.resolve('@storybook/mdx2-csf/loader'); // set `sourceLoaderOptions` to `null` to disable for manual configuration
79
+ To update your configuration, please see migration instructions here:
79
80
 
81
+ https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#dropped-source-loader--storiesof-static-snippets
82
+ `);
83
+ }
84
+
85
+ const mdxLoader = require.resolve('@storybook/mdx2-csf/loader');
80
86
 
81
- const sourceLoader = sourceLoaderOptions ? [{
82
- test: /\.(stories|story)\.[tj]sx?$/,
83
- loader: require.resolve('@storybook/source-loader'),
84
- options: Object.assign({}, sourceLoaderOptions, {
85
- inspectLocalDependencies: true
86
- }),
87
- enforce: 'pre'
88
- }] : [];
89
87
  let rules = module.rules || [];
90
88
 
91
89
  if (transcludeMarkdown) {
@@ -110,6 +108,8 @@ async function webpack(webpackConfig = {}, options) {
110
108
  }
111
109
 
112
110
  const result = Object.assign({}, webpackConfig, {
111
+ plugins: [...(webpackConfig.plugins || []), // eslint-disable-next-line global-require
112
+ ...(csfPluginOptions ? [require('@storybook/csf-plugin').webpack(csfPluginOptions)] : [])],
113
113
  module: Object.assign({}, module, {
114
114
  rules: [...rules, {
115
115
  test: /(stories|story)\.mdx$/,
@@ -140,16 +140,15 @@ async function webpack(webpackConfig = {}, options) {
140
140
  loader: mdxLoader,
141
141
  options: mdxLoaderOptions
142
142
  }]
143
- }, ...sourceLoader]
143
+ }]
144
144
  })
145
145
  });
146
146
  return result;
147
147
  }
148
148
 
149
- const storyIndexers = async indexers => {
149
+ const storyIndexers = indexers => {
150
150
  const mdxIndexer = async (fileName, opts) => {
151
- let code = (await _fsExtra.default.readFile(fileName, 'utf-8')).toString(); // @ts-expect-error (Converted from ts-ignore)
152
-
151
+ let code = (await _fsExtra.default.readFile(fileName, 'utf-8')).toString();
153
152
  const {
154
153
  compile
155
154
  } = await Promise.resolve().then(() => _interopRequireWildcard(require('@storybook/mdx2-csf')));
@@ -161,8 +160,7 @@ const storyIndexers = async indexers => {
161
160
 
162
161
  return [{
163
162
  test: /(stories|story)\.mdx$/,
164
- indexer: mdxIndexer,
165
- addDocsTemplate: true
163
+ indexer: mdxIndexer
166
164
  }, ...(indexers || [])];
167
165
  };
168
166
 
package/dist/esm/preset.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import fs from 'fs-extra';
2
2
  import remarkSlug from 'remark-slug';
3
3
  import remarkExternalLinks from 'remark-external-links';
4
- import { logger } from '@storybook/node-logger';
4
+ import { dedent } from 'ts-dedent';
5
5
  import { loadCsf } from '@storybook/csf-tools'; // for frameworks that are not working with react, we need to configure
6
6
  // the jsx to transpile mdx, for now there will be a flag for that
7
7
  // for more complex solutions we can find alone that we need to add '@babel/plugin-transform-react-jsx'
@@ -46,9 +46,8 @@ export async function webpack(webpackConfig = {}, options) {
46
46
  babelOptions,
47
47
  mdxBabelOptions,
48
48
  configureJSX = true,
49
- sourceLoaderOptions = {
50
- injectStoryParameters: true
51
- },
49
+ csfPluginOptions = {},
50
+ sourceLoaderOptions = null,
52
51
  transcludeMarkdown = false
53
52
  } = options;
54
53
  const mdxLoaderOptions = {
@@ -56,19 +55,19 @@ export async function webpack(webpackConfig = {}, options) {
56
55
  skipCsf: true,
57
56
  remarkPlugins: [remarkSlug, remarkExternalLinks]
58
57
  };
59
- logger.info(`Addon-docs: using MDX2`);
60
58
 
61
- const mdxLoader = require.resolve('@storybook/mdx2-csf/loader'); // set `sourceLoaderOptions` to `null` to disable for manual configuration
59
+ if (sourceLoaderOptions) {
60
+ throw new Error(dedent`
61
+ Addon-docs no longer uses source-loader in 7.0.
62
62
 
63
+ To update your configuration, please see migration instructions here:
64
+
65
+ https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#dropped-source-loader--storiesof-static-snippets
66
+ `);
67
+ }
68
+
69
+ const mdxLoader = require.resolve('@storybook/mdx2-csf/loader');
63
70
 
64
- const sourceLoader = sourceLoaderOptions ? [{
65
- test: /\.(stories|story)\.[tj]sx?$/,
66
- loader: require.resolve('@storybook/source-loader'),
67
- options: Object.assign({}, sourceLoaderOptions, {
68
- inspectLocalDependencies: true
69
- }),
70
- enforce: 'pre'
71
- }] : [];
72
71
  let rules = module.rules || [];
73
72
 
74
73
  if (transcludeMarkdown) {
@@ -89,6 +88,8 @@ export async function webpack(webpackConfig = {}, options) {
89
88
  }
90
89
 
91
90
  const result = Object.assign({}, webpackConfig, {
91
+ plugins: [...(webpackConfig.plugins || []), // eslint-disable-next-line global-require
92
+ ...(csfPluginOptions ? [require('@storybook/csf-plugin').webpack(csfPluginOptions)] : [])],
92
93
  module: Object.assign({}, module, {
93
94
  rules: [...rules, {
94
95
  test: /(stories|story)\.mdx$/,
@@ -119,15 +120,14 @@ export async function webpack(webpackConfig = {}, options) {
119
120
  loader: mdxLoader,
120
121
  options: mdxLoaderOptions
121
122
  }]
122
- }, ...sourceLoader]
123
+ }]
123
124
  })
124
125
  });
125
126
  return result;
126
127
  }
127
- export const storyIndexers = async indexers => {
128
+ export const storyIndexers = indexers => {
128
129
  const mdxIndexer = async (fileName, opts) => {
129
- let code = (await fs.readFile(fileName, 'utf-8')).toString(); // @ts-expect-error (Converted from ts-ignore)
130
-
130
+ let code = (await fs.readFile(fileName, 'utf-8')).toString();
131
131
  const {
132
132
  compile
133
133
  } = await import('@storybook/mdx2-csf');
@@ -139,8 +139,7 @@ export const storyIndexers = async indexers => {
139
139
 
140
140
  return [{
141
141
  test: /(stories|story)\.mdx$/,
142
- indexer: mdxIndexer,
143
- addDocsTemplate: true
142
+ indexer: mdxIndexer
144
143
  }, ...(indexers || [])];
145
144
  };
146
145
  export const docs = docsOptions => {
package/dist/types/preset.d.ts CHANGED
@@ -1,14 +1,17 @@
1
1
  import type { CoreCommon_StoryIndexer, DocsOptions, Options } from '@storybook/types';
2
+ import type { CsfPluginOptions } from '@storybook/csf-plugin';
2
3
  declare type BabelParams = {
3
4
  babelOptions?: any;
4
5
  mdxBabelOptions?: any;
5
6
  configureJSX?: boolean;
6
7
  };
7
8
  export declare function webpack(webpackConfig: any, options: Options & BabelParams & {
9
+ /** @deprecated */
8
10
  sourceLoaderOptions: any;
11
+ csfPluginOptions: CsfPluginOptions | null;
9
12
  transcludeMarkdown: boolean;
10
13
  }): Promise<any>;
11
- export declare const storyIndexers: (indexers: CoreCommon_StoryIndexer[] | null) => Promise<CoreCommon_StoryIndexer[]>;
14
+ export declare const storyIndexers: (indexers: CoreCommon_StoryIndexer[] | null) => CoreCommon_StoryIndexer[];
12
15
  export declare const docs: (docsOptions: DocsOptions) => {
13
16
  enabled: boolean;
14
17
  defaultName: string;
package/jest-transform-mdx.js CHANGED
@@ -2,11 +2,11 @@ const path = require('path');
2
2
  const { ScriptTransformer } = require('@jest/transform');
3
3
  const { dedent } = require('ts-dedent');
4
4
 
5
- const { compileAsync } = require('@storybook/mdx2-csf');
5
+ const { compile } = require('@storybook/mdx2-csf');
6
6
 
7
7
  module.exports = {
8
8
  async processAsync(src, filename, config, { instrument }) {
9
- const code = await compileAsync(src, { skipCsf: false });
9
+ const code = await compile(src, { skipCsf: false });
10
10
  const result = dedent`
11
11
  /* @jsx mdx */
12
12
  import React from 'react'
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@storybook/addon-docs",
3
- "version": "7.0.0-alpha.46",
3
+ "version": "7.0.0-alpha.48",
4
4
  "description": "Document component usage and properties in Markdown",
5
5
  "keywords": [
6
6
  "addon",
@@ -52,22 +52,22 @@
52
52
  "@babel/plugin-transform-react-jsx": "^7.12.12",
53
53
  "@jest/transform": "^26.6.2",
54
54
  "@mdx-js/react": "^2.1.5",
55
- "@storybook/addons": "7.0.0-alpha.46",
56
- "@storybook/api": "7.0.0-alpha.46",
57
- "@storybook/blocks": "7.0.0-alpha.46",
58
- "@storybook/components": "7.0.0-alpha.46",
59
- "@storybook/core-common": "7.0.0-alpha.46",
60
- "@storybook/core-events": "7.0.0-alpha.46",
61
- "@storybook/csf-tools": "7.0.0-alpha.46",
62
- "@storybook/docs-tools": "7.0.0-alpha.46",
63
- "@storybook/mdx2-csf": "0.1.0-next.0",
64
- "@storybook/node-logger": "7.0.0-alpha.46",
65
- "@storybook/postinstall": "7.0.0-alpha.46",
66
- "@storybook/preview-web": "7.0.0-alpha.46",
67
- "@storybook/source-loader": "7.0.0-alpha.46",
68
- "@storybook/store": "7.0.0-alpha.46",
69
- "@storybook/theming": "7.0.0-alpha.46",
70
- "@storybook/types": "7.0.0-alpha.46",
55
+ "@storybook/addons": "7.0.0-alpha.48",
56
+ "@storybook/api": "7.0.0-alpha.48",
57
+ "@storybook/blocks": "7.0.0-alpha.48",
58
+ "@storybook/components": "7.0.0-alpha.48",
59
+ "@storybook/core-common": "7.0.0-alpha.48",
60
+ "@storybook/core-events": "7.0.0-alpha.48",
61
+ "@storybook/csf-plugin": "7.0.0-alpha.48",
62
+ "@storybook/csf-tools": "7.0.0-alpha.48",
63
+ "@storybook/docs-tools": "7.0.0-alpha.48",
64
+ "@storybook/mdx2-csf": "next",
65
+ "@storybook/node-logger": "7.0.0-alpha.48",
66
+ "@storybook/postinstall": "7.0.0-alpha.48",
67
+ "@storybook/preview-web": "7.0.0-alpha.48",
68
+ "@storybook/store": "7.0.0-alpha.48",
69
+ "@storybook/theming": "7.0.0-alpha.48",
70
+ "@storybook/types": "7.0.0-alpha.48",
71
71
  "dequal": "^2.0.2",
72
72
  "fs-extra": "^9.0.1",
73
73
  "global": "^4.4.0",
@@ -94,7 +94,7 @@
94
94
  "publishConfig": {
95
95
  "access": "public"
96
96
  },
97
- "gitHead": "c64b5be851ed2affac56e1daaac3f453fbe6f230",
97
+ "gitHead": "b58a29b785462f8a8b711b6bb2d7223fd6dc17fd",
98
98
  "storybook": {
99
99
  "displayName": "Docs",
100
100
  "icon": "https://user-images.githubusercontent.com/263385/101991672-48355c80-3c7c-11eb-82d9-95fa12438f64.png",
package/mdx-compiler-plugin.js DELETED
@@ -1 +0,0 @@
1
- module.exports = require('@storybook/mdx1-csf').createCompiler;