GitHub/storybook
1
0
Fork 0
mirror of https://github.com/storybookjs/storybook.git synced 2025-04-08 11:11:53 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #16773 from ittaibaratz/preview-url-in-block-story

Browse Source 
Core: Support custom PREVIEW URL for block story iframe
This commit is contained in:
Michael Shilman 2021-12-09 14:02:14 +08:00 committed by GitHub
commit 9df10e9fdf
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
19 changed files with 2209 additions and 440 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@ -8,6 +8,7 @@ dist
.tern-port .tern-port
*.DS_Store *.DS_Store
.cache .cache
.parcel-cache
coverage/ coverage/
*.lerna_backup *.lerna_backup
build build

2
addons/actions/package.json
View File

@ -55,7 +55,7 @@
"prop-types": "^15.7.2", "prop-types": "^15.7.2",
"react-inspector": "^5.1.0", "react-inspector": "^5.1.0",
"regenerator-runtime": "^0.13.7", "regenerator-runtime": "^0.13.7",
"telejson": "^5.3.2", "telejson": "^5.3.3",
"ts-dedent": "^2.0.0", "ts-dedent": "^2.0.0",
"util-deprecate": "^1.0.2", "util-deprecate": "^1.0.2",
"uuid-browser": "^3.1.0" "uuid-browser": "^3.1.0"

2
app/angular/package.json
View File

@ -70,7 +70,7 @@
"regenerator-runtime": "^0.13.7", "regenerator-runtime": "^0.13.7",
"sass-loader": "^10.1.0", "sass-loader": "^10.1.0",
"strip-json-comments": "3.1.1", "strip-json-comments": "3.1.1",
"telejson": "^5.3.2", "telejson": "^5.3.3",
"ts-dedent": "^2.0.0", "ts-dedent": "^2.0.0",
"ts-loader": "^8.0.14", "ts-loader": "^8.0.14",
"tsconfig-paths-webpack-plugin": "^3.3.0", "tsconfig-paths-webpack-plugin": "^3.3.0",

2
examples/angular-cli/package.json
View File

@ -29,7 +29,7 @@
"core-js": "^3.8.2", "core-js": "^3.8.2",
"rxjs": "^6.6.3", "rxjs": "^6.6.3",
"sass": "^1.43.4", "sass": "^1.43.4",
"telejson": "^5.3.2", "telejson": "^5.3.3",
"zone.js": "^0.11.3" "zone.js": "^0.11.3"
}, },
"devDependencies": { "devDependencies": {

7
examples/standalone-preview/README.md
View File

@ -5,7 +5,7 @@ This project demonstrates a preview running in standalone mode using `parcel`.
To run the standalone preview: To run the standalone preview:
``` ```
yarn storybook yarn storybook-preview
``` ```
This starts a `parcel` dev server on port `1337`. This starts a `parcel` dev server on port `1337`.
@ -13,10 +13,9 @@ This starts a `parcel` dev server on port `1337`.
To view the stories in the storybook UI: To view the stories in the storybook UI:
``` ```
cd ../official-storybook yarn storybook
npm storybook -- --preview-url=http://localhost:1337/iframe.html # or yarn
``` ```
This runs the Storybook dev server, but instead of showing `official-storybook`'s stories, it attaches to the `parcel` dev server, lists its stories in the navigation, and shows its stories in the preview iframe. This runs the Storybook dev server (Found in ../official-storybook), but instead of showing `official-storybook`'s stories, it attaches to the `parcel` dev server, lists its stories in the navigation, and shows its stories in the preview iframe.
> NOTE: This can be run from any working storybook, not just `official-storybook`! > NOTE: This can be run from any working storybook, not just `official-storybook`!

3
examples/standalone-preview/addPreview.ts Normal file
View File

@ -0,0 +1,3 @@
export {};
global.PREVIEW_URL = process.env.PREVIEW_URL;

7
examples/standalone-preview/package.json
View File

@ -3,12 +3,15 @@
"version": "6.5.0-alpha.2", "version": "6.5.0-alpha.2",
"private": true, "private": true,
"scripts": { "scripts": {
"storybook": "parcel ./storybook.html --port 1337" "storybook-preview": "cross-env PREVIEW_URL=external-iframe.html parcel ./storybook.html --port 1337",
"storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true start-storybook -p 9011 -c ../official-storybook --no-manager-cache --preview-url=http://localhost:1337/external-iframe.html"
}, },
"devDependencies": { "devDependencies": {
"@storybook/addon-docs": "6.5.0-alpha.2", "@storybook/addon-docs": "6.5.0-alpha.2",
"@storybook/cli": "6.5.0-alpha.2",
"@storybook/react": "6.5.0-alpha.2", "@storybook/react": "6.5.0-alpha.2",
"parcel": "^1.12.4", "cross-env": "^7.0.3",
"parcel": "2.0.1",
"react": "16.14.0", "react": "16.14.0",
"react-dom": "16.14.0" "react-dom": "16.14.0"
} }

2
examples/standalone-preview/storybook.html
View File

@ -9,7 +9,7 @@
<body> <body>
<div id="root"></div> <div id="root"></div>
<div id="docs-root"></div> <div id="docs-root"></div>
<script src="./storybook.ts"></script> <script type="module" src="./storybook.ts"></script>
<div class="sb-errordisplay sb-wrapper"> <div class="sb-errordisplay sb-wrapper">
<div id="error-message" class="sb-heading"></div> <div id="error-message" class="sb-heading"></div>
<pre class="sb-errordisplay_code"><code id="error-stack"></code></pre> <pre class="sb-errordisplay_code"><code id="error-stack"></code></pre>

1
examples/standalone-preview/storybook.ts
View File

@ -1,3 +1,4 @@
import './addPreview';
import { configure, addParameters } from '@storybook/react'; import { configure, addParameters } from '@storybook/react';
import { DocsPage, DocsContainer } from '@storybook/addon-docs'; import { DocsPage, DocsContainer } from '@storybook/addon-docs';

2
lib/api/package.json
View File

@ -52,7 +52,7 @@
"memoizerific": "^1.11.3", "memoizerific": "^1.11.3",
"regenerator-runtime": "^0.13.7", "regenerator-runtime": "^0.13.7",
"store2": "^2.12.0", "store2": "^2.12.0",
"telejson": "^5.3.2", "telejson": "^5.3.3",
"ts-dedent": "^2.0.0", "ts-dedent": "^2.0.0",
"util-deprecate": "^1.0.2" "util-deprecate": "^1.0.2"
}, },

2
lib/builder-webpack4/src/preview/iframe-webpack.config.ts
View File

@ -64,6 +64,7 @@ export default async (options: Options & Record<string, any>): Promise<Configura
framework, framework,
frameworkPath, frameworkPath,
presets, presets,
previewUrl,
typescriptOptions, typescriptOptions,
modern, modern,
features, features,
@ -188,6 +189,7 @@ export default async (options: Options & Record<string, any>): Promise<Configura
FRAMEWORK_OPTIONS: frameworkOptions, FRAMEWORK_OPTIONS: frameworkOptions,
CHANNEL_OPTIONS: coreOptions?.channelOptions, CHANNEL_OPTIONS: coreOptions?.channelOptions,
FEATURES: features, FEATURES: features,
PREVIEW_URL: previewUrl,
STORIES: stories.map((specifier) => ({ STORIES: stories.map((specifier) => ({
...specifier, ...specifier,
importPathMatcher: specifier.importPathMatcher.source, importPathMatcher: specifier.importPathMatcher.source,

2
lib/builder-webpack5/src/preview/iframe-webpack.config.ts
View File

@ -65,6 +65,7 @@ export default async (options: Options & Record<string, any>): Promise<Configura
framework, framework,
frameworkPath, frameworkPath,
presets, presets,
previewUrl,
typescriptOptions, typescriptOptions,
modern, modern,
features, features,
@ -192,6 +193,7 @@ export default async (options: Options & Record<string, any>): Promise<Configura
FRAMEWORK_OPTIONS: frameworkOptions, FRAMEWORK_OPTIONS: frameworkOptions,
CHANNEL_OPTIONS: coreOptions?.channelOptions, CHANNEL_OPTIONS: coreOptions?.channelOptions,
FEATURES: features, FEATURES: features,
PREVIEW_URL: previewUrl,
STORIES: stories.map((specifier) => ({ STORIES: stories.map((specifier) => ({
...specifier, ...specifier,
importPathMatcher: specifier.importPathMatcher.source, importPathMatcher: specifier.importPathMatcher.source,

2
lib/channel-postmessage/package.json
View File

@ -46,7 +46,7 @@
"core-js": "^3.8.2", "core-js": "^3.8.2",
"global": "^4.4.0", "global": "^4.4.0",
"qs": "^6.10.0", "qs": "^6.10.0",
"telejson": "^5.3.2" "telejson": "^5.3.3"
}, },
"publishConfig": { "publishConfig": {
"access": "public" "access": "public"

2
lib/channel-websocket/package.json
View File

@ -44,7 +44,7 @@
"@storybook/client-logger": "6.5.0-alpha.2", "@storybook/client-logger": "6.5.0-alpha.2",
"core-js": "^3.8.2", "core-js": "^3.8.2",
"global": "^4.4.0", "global": "^4.4.0",
"telejson": "^5.3.2" "telejson": "^5.3.3"
}, },
"publishConfig": { "publishConfig": {
"access": "public" "access": "public"

4
lib/components/src/blocks/Story.tsx
View File

@ -1,3 +1,4 @@
import global from 'global';
import React, { createElement, ElementType, FunctionComponent, Fragment } from 'react'; import React, { createElement, ElementType, FunctionComponent, Fragment } from 'react';
import type { Parameters } from '@storybook/api'; import type { Parameters } from '@storybook/api';
@ -7,7 +8,8 @@ import { EmptyBlock } from './EmptyBlock';
import { ZoomContext } from './ZoomContext'; import { ZoomContext } from './ZoomContext';
import { Loader } from '..'; import { Loader } from '..';
const BASE_URL = 'iframe.html'; const { PREVIEW_URL } = global;
const BASE_URL = PREVIEW_URL || 'iframe.html';
export enum StoryError { export enum StoryError {
NO_STORY = 'No component or story to display', NO_STORY = 'No component or story to display',

2
lib/core-common/package.json
View File

@ -85,7 +85,7 @@
"pretty-hrtime": "^1.0.3", "pretty-hrtime": "^1.0.3",
"resolve-from": "^5.0.0", "resolve-from": "^5.0.0",
"slash": "^3.0.0", "slash": "^3.0.0",
"telejson": "^5.3.2", "telejson": "^5.3.3",
"ts-dedent": "^2.0.0", "ts-dedent": "^2.0.0",
"util-deprecate": "^1.0.2", "util-deprecate": "^1.0.2",
"webpack": "4" "webpack": "4"

2
lib/manager-webpack4/package.json
View File

@ -70,7 +70,7 @@
"regenerator-runtime": "^0.13.7", "regenerator-runtime": "^0.13.7",
"resolve-from": "^5.0.0", "resolve-from": "^5.0.0",
"style-loader": "^1.3.0", "style-loader": "^1.3.0",
"telejson": "^5.3.2", "telejson": "^5.3.3",
"terser-webpack-plugin": "^4.2.3", "terser-webpack-plugin": "^4.2.3",
"ts-dedent": "^2.0.0", "ts-dedent": "^2.0.0",
"url-loader": "^4.1.1", "url-loader": "^4.1.1",

2
lib/manager-webpack5/package.json
View File

@ -67,7 +67,7 @@
"regenerator-runtime": "^0.13.7", "regenerator-runtime": "^0.13.7",
"resolve-from": "^5.0.0", "resolve-from": "^5.0.0",
"style-loader": "^2.0.0", "style-loader": "^2.0.0",
"telejson": "^5.3.2", "telejson": "^5.3.3",
"terser-webpack-plugin": "^5.0.3", "terser-webpack-plugin": "^5.0.3",
"ts-dedent": "^2.0.0", "ts-dedent": "^2.0.0",
"util-deprecate": "^1.0.2", "util-deprecate": "^1.0.2",

2600
yarn.lock
View File

File diff suppressed because it is too large Load Diff