Skip to content

Commit

Permalink
Merge pull request #17982 from storybookjs/future/add-renderers
Browse files Browse the repository at this point in the history
Core: Renderer refactor
  • Loading branch information
shilman authored Jun 6, 2022
2 parents 6bf256c + a71e653 commit 232d0c0
Show file tree
Hide file tree
Showing 373 changed files with 1,507 additions and 439 deletions.
1 change: 1 addition & 0 deletions .circleci/config.yml
Original file line number Diff line number Diff line change
Expand Up @@ -106,6 +106,7 @@ jobs:
- addons
- app
- lib
- renderers
chromatic:
executor: sb_node_14_browsers
parallelism: 4
Expand Down
8 changes: 1 addition & 7 deletions app/html/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -39,24 +39,18 @@
"prepare": "node ../../scripts/prepare.js"
},
"dependencies": {
"@storybook/addons": "6.5.0-rc.1",
"@storybook/core-client": "6.5.0-rc.1",
"@storybook/core-common": "6.5.0-rc.1",
"@storybook/core-server": "6.5.0-rc.1",
"@storybook/csf": "0.0.2--canary.4566f4d.1",
"@storybook/docs-tools": "6.5.0-rc.1",
"@storybook/preview-web": "6.5.0-rc.1",
"@storybook/store": "6.5.0-rc.1",
"@storybook/renderer-html": "6.5.0-rc.1",
"@types/node": "^14.14.20 || ^16.0.0",
"@types/webpack-env": "^1.16.0",
"core-js": "^3.8.2",
"global": "^4.4.0",
"html-loader": "^1.3.2",
"react": "16.14.0",
"react-dom": "16.14.0",
"read-pkg-up": "^7.0.1",
"regenerator-runtime": "^0.13.7",
"ts-dedent": "^2.0.0",
"webpack": ">=4.0.0 <6.0.0"
},
"devDependencies": {
Expand Down
17 changes: 1 addition & 16 deletions app/html/src/client/index.ts
Original file line number Diff line number Diff line change
@@ -1,16 +1 @@
export {
storiesOf,
setAddon,
addDecorator,
addParameters,
configure,
getStorybook,
forceReRender,
raw,
} from './preview';

export * from './preview/types-6-0';

if (module && module.hot && module.hot.decline) {
module.hot.decline();
}
export * from '@storybook/renderer-html';
3 changes: 0 additions & 3 deletions app/html/src/client/preview/config.ts

This file was deleted.

8 changes: 0 additions & 8 deletions app/html/src/server/framework-preset-html-docs.ts

This file was deleted.

16 changes: 0 additions & 16 deletions app/html/src/server/framework-preset-html.ts

This file was deleted.

15 changes: 11 additions & 4 deletions app/html/src/server/preset.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,13 @@
import type { Configuration } from 'webpack';
import type { StorybookConfig } from '@storybook/core-common';

export const addons: StorybookConfig['addons'] = [
require.resolve('./framework-preset-html'),
require.resolve('./framework-preset-html-docs'),
];
export function webpack(config: Configuration) {
config.module.rules.push({
test: /\.html$/,
use: require.resolve('html-loader') as string,
});

return config;
}

export const addons: StorybookConfig['addons'] = ['@storybook/renderer-html'];
6 changes: 1 addition & 5 deletions app/preact/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -40,19 +40,15 @@
},
"dependencies": {
"@babel/plugin-transform-react-jsx": "^7.12.12",
"@storybook/addons": "6.5.0-rc.1",
"@storybook/core-client": "6.5.0-rc.1",
"@storybook/core-common": "6.5.0-rc.1",
"@storybook/core-server": "6.5.0-rc.1",
"@storybook/csf": "0.0.2--canary.4566f4d.1",
"@storybook/store": "6.5.0-rc.1",
"@storybook/renderer-preact": "6.5.0-rc.1",
"@types/node": "^14.14.20 || ^16.0.0",
"@types/webpack-env": "^1.16.0",
"core-js": "^3.8.2",
"global": "^4.4.0",
"react": "16.14.0",
"react-dom": "16.14.0",
"read-pkg-up": "^7.0.1",
"regenerator-runtime": "^0.13.7",
"ts-dedent": "^2.0.0",
"webpack": ">=4.0.0 <6.0.0"
Expand Down
13 changes: 1 addition & 12 deletions app/preact/src/client/index.ts
Original file line number Diff line number Diff line change
@@ -1,12 +1 @@
export {
storiesOf,
setAddon,
addDecorator,
addParameters,
configure,
getStorybook,
forceReRender,
raw,
} from './preview';

export * from './preview/types-6-0';
export * from '@storybook/renderer-preact';
5 changes: 1 addition & 4 deletions app/preact/src/server/framework-preset-preact.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import path from 'path';
import type { TransformOptions } from '@babel/core';
import type { Configuration } from 'webpack';
import { findDistEsm } from '@storybook/core-common';
import type { StorybookConfig } from '@storybook/core-common';

export function babelDefault(config: TransformOptions): TransformOptions {
Expand Down Expand Up @@ -29,6 +28,4 @@ export function webpackFinal(config: Configuration): Configuration {
};
}

export const previewAnnotations: StorybookConfig['previewAnnotations'] = (entry = []) => {
return [...entry, findDistEsm(__dirname, 'client/preview/config')];
};
export const addons: StorybookConfig['addons'] = ['@storybook/renderer-preact'];
16 changes: 1 addition & 15 deletions app/react/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -43,35 +43,21 @@
"@babel/preset-flow": "^7.12.1",
"@babel/preset-react": "^7.12.10",
"@pmmmwh/react-refresh-webpack-plugin": "^0.5.3",
"@storybook/addons": "6.5.0-rc.1",
"@storybook/client-logger": "6.5.0-rc.1",
"@storybook/core-client": "6.5.0-rc.1",
"@storybook/core-common": "6.5.0-rc.1",
"@storybook/core-server": "6.5.0-rc.1",
"@storybook/csf": "0.0.2--canary.4566f4d.1",
"@storybook/docs-tools": "6.5.0-rc.1",
"@storybook/node-logger": "6.5.0-rc.1",
"@storybook/react-docgen-typescript-plugin": "1.0.2-canary.6.9d540b91e815f8fc2f8829189deb00553559ff63.0",
"@storybook/renderer-react": "6.5.0-rc.1",
"@storybook/semver": "^7.3.2",
"@storybook/store": "6.5.0-rc.1",
"@types/estree": "^0.0.51",
"@types/node": "^14.14.20 || ^16.0.0",
"@types/webpack-env": "^1.16.0",
"acorn": "^7.4.1",
"acorn-jsx": "^5.3.1",
"acorn-walk": "^7.2.0",
"babel-plugin-add-react-displayname": "^0.0.5",
"babel-plugin-react-docgen": "^4.2.1",
"core-js": "^3.8.2",
"escodegen": "^2.0.0",
"fs-extra": "^9.0.1",
"global": "^4.4.0",
"html-tags": "^3.1.0",
"lodash": "^4.17.21",
"prop-types": "^15.7.2",
"react-element-to-jsx-string": "^14.3.4",
"react-refresh": "^0.11.0",
"read-pkg-up": "^7.0.1",
"regenerator-runtime": "^0.13.7",
"ts-dedent": "^2.0.0",
"util-deprecate": "^1.0.2",
Expand Down
19 changes: 1 addition & 18 deletions app/react/src/client/index.ts
Original file line number Diff line number Diff line change
@@ -1,18 +1 @@
export type { DecoratorFn } from './preview';
export {
storiesOf,
setAddon,
addDecorator,
addParameters,
configure,
getStorybook,
raw,
forceReRender,
} from './preview';
export * from './testing';

export * from './preview/types-6-3';

if (module && module.hot && module.hot.decline) {
module.hot.decline();
}
export * from '@storybook/renderer-react';
3 changes: 0 additions & 3 deletions app/react/src/client/preview/config.ts

This file was deleted.

6 changes: 0 additions & 6 deletions app/react/src/server/framework-preset-react-docs.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import type { StorybookConfig, Options, TypescriptConfig } from '@storybook/core-common';
import { findDistEsm } from '@storybook/core-common';
import type { TransformOptions } from '@babel/core';
import type { Configuration } from 'webpack';
import ReactDocgenTypescriptPlugin from '@storybook/react-docgen-typescript-plugin';
Expand Down Expand Up @@ -58,8 +57,3 @@ export async function webpackFinal(config: Configuration, options: Options) {
],
};
}

export const previewAnnotations: StorybookConfig['previewAnnotations'] = (entry = [], options) => {
if (!hasDocsOrControls(options)) return entry;
return [...entry, findDistEsm(__dirname, 'client/docs/config')];
};
3 changes: 2 additions & 1 deletion app/react/src/server/framework-preset-react-dom-hack.ts
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,8 @@ export async function webpackFinal(config: Configuration) {
? null
: new IgnorePlugin({
resourceRegExp: /react-dom\/client$/,
contextRegExp: /(app\/react|app\\react|@storybook\/react|@storybook\\react)/, // TODO this needs to work for both in our MONOREPO and in the user's NODE_MODULES
contextRegExp:
/(renderers\/react|renderers\\react|@storybook\/renderer-react|@storybook\\renderer-react)/, // TODO this needs to work for both in our MONOREPO and in the user's NODE_MODULES
}),
].filter(Boolean),
};
Expand Down
7 changes: 1 addition & 6 deletions app/react/src/server/preset.ts
Original file line number Diff line number Diff line change
@@ -1,12 +1,7 @@
import { findDistEsm } from '@storybook/core-common';
import type { StorybookConfig } from '@storybook/core-common';

export const previewAnnotations: StorybookConfig['previewAnnotations'] = (entries = []) => [
...entries,
findDistEsm(__dirname, 'client/preview/config'),
];

export const addons: StorybookConfig['addons'] = [
'@storybook/renderer-react',
require.resolve('./framework-preset-react'),
require.resolve('./framework-preset-react-dom-hack'),
require.resolve('./framework-preset-cra'),
Expand Down
42 changes: 22 additions & 20 deletions app/react/src/typings.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,41 +4,43 @@ declare module 'global';
// TODO: Replace, as soon as @types/react-dom 17.0.14 is used
// Source: https://github.com/DefinitelyTyped/DefinitelyTyped/blob/fb0f14b7a35cde26ffaa82e7536c062e593e9ae6/types/react-dom/client.d.ts
declare module 'react-dom/client' {

import React = require('react');
import React = require('react');
export interface HydrationOptions {
onHydrated?(suspenseInstance: Comment): void;
onDeleted?(suspenseInstance: Comment): void;
/**
* Prefix for `useId`.
*/
identifierPrefix?: string;
onRecoverableError?: (error: unknown) => void;
onHydrated?(suspenseInstance: Comment): void;
onDeleted?(suspenseInstance: Comment): void;
/**
* Prefix for `useId`.
*/
identifierPrefix?: string;
onRecoverableError?: (error: unknown) => void;
}

export interface RootOptions {
/**
* Prefix for `useId`.
*/
identifierPrefix?: string;
onRecoverableError?: (error: unknown) => void;
/**
* Prefix for `useId`.
*/
identifierPrefix?: string;
onRecoverableError?: (error: unknown) => void;
}

export interface Root {
render(children: React.ReactChild | Iterable<React.ReactNode>): void;
unmount(): void;
render(children: React.ReactChild | Iterable<React.ReactNode>): void;
unmount(): void;
}

/**
* Replaces `ReactDOM.render` when the `.render` method is called and enables Concurrent Mode.
*
* @see https://reactjs.org/docs/concurrent-mode-reference.html#createroot
*/
export function createRoot(container: Element | Document | DocumentFragment | Comment, options?: RootOptions): Root;
export function createRoot(
container: Element | Document | DocumentFragment | Comment,
options?: RootOptions
): Root;

export function hydrateRoot(
container: Element | Document | DocumentFragment | Comment,
initialChildren: React.ReactChild | Iterable<React.ReactNode>,
options?: HydrationOptions,
container: Element | Document | DocumentFragment | Comment,
initialChildren: React.ReactChild | Iterable<React.ReactNode>,
options?: HydrationOptions
): Root;
}
10 changes: 1 addition & 9 deletions app/server/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -39,23 +39,15 @@
"prepare": "node ../../scripts/prepare.js"
},
"dependencies": {
"@storybook/addons": "6.5.0-rc.1",
"@storybook/api": "6.5.0-rc.1",
"@storybook/client-api": "6.5.0-rc.1",
"@storybook/core-client": "6.5.0-rc.1",
"@storybook/core-common": "6.5.0-rc.1",
"@storybook/core-server": "6.5.0-rc.1",
"@storybook/csf": "0.0.2--canary.4566f4d.1",
"@storybook/node-logger": "6.5.0-rc.1",
"@storybook/preview-web": "6.5.0-rc.1",
"@storybook/store": "6.5.0-rc.1",
"@storybook/renderer-server": "6.5.0-rc.1",
"@types/node": "^14.14.20 || ^16.0.0",
"@types/webpack-env": "^1.16.0",
"core-js": "^3.8.2",
"global": "^4.4.0",
"react": "16.14.0",
"react-dom": "16.14.0",
"read-pkg-up": "^7.0.1",
"regenerator-runtime": "^0.13.7",
"safe-identifier": "^0.4.1",
"ts-dedent": "^2.0.0",
Expand Down
15 changes: 1 addition & 14 deletions app/server/src/client/index.ts
Original file line number Diff line number Diff line change
@@ -1,14 +1 @@
export {
storiesOf,
setAddon,
addDecorator,
addParameters,
configure,
getStorybook,
forceReRender,
raw,
} from './preview';

if (module && module.hot && module.hot.decline) {
module.hot.decline();
}
export * from '@storybook/renderer-server';
5 changes: 1 addition & 4 deletions app/server/src/server/framework-preset-server.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import path from 'path';
import { findDistEsm } from '@storybook/core-common';
import type { StorybookConfig } from '@storybook/core-common';
import type { Configuration } from 'webpack';

Expand All @@ -19,6 +18,4 @@ export function webpack(config: Configuration) {
return config;
}

export const previewAnnotations: StorybookConfig['previewAnnotations'] = (entry = []) => {
return [...entry, findDistEsm(__dirname, 'client/preview/config')];
};
export const addons: StorybookConfig['addons'] = ['@storybook/renderer-server'];
8 changes: 1 addition & 7 deletions app/svelte/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -40,21 +40,15 @@
"prepare": "node ../../scripts/prepare.js"
},
"dependencies": {
"@storybook/addons": "6.5.0-rc.1",
"@storybook/client-logger": "6.5.0-rc.1",
"@storybook/core-client": "6.5.0-rc.1",
"@storybook/core-common": "6.5.0-rc.1",
"@storybook/core-server": "6.5.0-rc.1",
"@storybook/csf": "0.0.2--canary.4566f4d.1",
"@storybook/docs-tools": "6.5.0-rc.1",
"@storybook/node-logger": "6.5.0-rc.1",
"@storybook/store": "6.5.0-rc.1",
"@storybook/renderer-svelte": "6.5.0-rc.1",
"core-js": "^3.8.2",
"global": "^4.4.0",
"loader-utils": "^2.0.0",
"react": "16.14.0",
"react-dom": "16.14.0",
"read-pkg-up": "^7.0.1",
"regenerator-runtime": "^0.13.7",
"sveltedoc-parser": "4.1.0",
"ts-dedent": "^2.0.0",
Expand Down
Loading

0 comments on commit 232d0c0

Please sign in to comment.