Skip to content

Commit

Permalink
Merge branch 'next' into yann/rename-testing-utils-to-portable-stories
Browse files Browse the repository at this point in the history
  • Loading branch information
yannbf authored Feb 6, 2024
2 parents fa5a56c + 2e7405f commit a307dfa
Show file tree
Hide file tree
Showing 29 changed files with 216 additions and 217 deletions.
2 changes: 1 addition & 1 deletion code/addons/docs/docs/props-tables.md
Original file line number Diff line number Diff line change
Expand Up @@ -228,7 +228,7 @@ This package relies on a variety of sub-packages to extract property information
| Framework | Underlying library | Docs | Open issues |
| -------------- | ---------------------------------------- | ------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| React | `react-docgen` `react-docgen-typescript` | [Docs](../react/README.md#props-tables) | [Open issues](https://github.com/storybookjs/storybook/issues?q=is%3Aopen+is%3Aissue+label%3A%22block%3A+props%22+label%3Abug+label%3A%22app%3A+react%22) |
| Vue 3 | `vue-docgen-api` | [Docs](../vue3/README.md#props-tables) | [Open issues](https://github.com/storybookjs/storybook/issues?q=is%3Aopen+is%3Aissue+label%3A%22block%3A+props%22+label%3Abug+label%3A%22vue3%22) |
| Vue 3 | `vue-docgen-api` | [Docs](../vue3/README.md#props-tables) | [Open issues](https://github.com/storybookjs/storybook/issues?q=is%3Aopen+is%3Aissue+label%3A%22block%3A+props%22+label%3Abug+label%3A%22vue3%22) |
| Angular | `compodoc` | [Docs](../angular/README.md#props-tables) | [Open issues](https://github.com/storybookjs/storybook/issues?q=is%3Aopen+is%3Aissue+label%3A%22block%3A+props%22+label%3Abug+label%3A%22app%3A+angular%22) |
| Web-components | `custom-elements.json` | [Docs](../web-components/README.md#props-tables) | [Open issues](https://github.com/storybookjs/storybook/issues?q=is%3Aopen+is%3Aissue+label%3A%22block%3A+props%22+label%3Abug+label%3A%22app%3A+web-components%22) |
| Ember | `yui-doc` | [Docs](../ember/README.md#props-tables) | [Open issues](https://github.com/storybookjs/storybook/issues?q=is%3Aopen+is%3Aissue+label%3A%22block%3A+props%22+label%3Abug+label%3A%22app%3A+ember%22) |
Expand Down
6 changes: 4 additions & 2 deletions code/addons/docs/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -112,8 +112,8 @@
"@storybook/theming": "workspace:*",
"@storybook/types": "workspace:*",
"fs-extra": "^11.1.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react": "^16.8.0 || ^17.0.0 || ^18.0.0",
"react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0",
"rehype-external-links": "^3.0.0",
"rehype-slug": "^6.0.0",
"ts-dedent": "^2.0.0"
Expand All @@ -122,6 +122,8 @@
"@mdx-js/mdx": "^3.0.0",
"@rollup/pluginutils": "^5.0.2",
"@storybook/test": "workspace:*",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"typescript": "^5.3.2",
"vite": "^4.0.4"
},
Expand Down
10 changes: 6 additions & 4 deletions code/addons/docs/src/preset.ts
Original file line number Diff line number Diff line change
Expand Up @@ -138,24 +138,26 @@ export const viteFinal = async (config: any, options: Options) => {
const { mdxPlugin } = await import('./plugins/mdx-plugin');

// Use the resolvedReact preset to alias react and react-dom to either the users version or the version shipped with addon-docs
const { react, reactDom } = await getResolvedReact(options);
const { react, reactDom, mdx } = await getResolvedReact(options);

const reactAliasPlugin = {
name: 'storybook:react-alias',
const packageDeduplicationPlugin = {
name: 'storybook:package-deduplication',
enforce: 'pre',
config: () => ({
resolve: {
alias: {
react,
'react-dom': reactDom,
'@mdx-js/react': mdx,
},
dedupe: ['@storybook/theming', '@storybook/components', '@storybook/blocks'],
},
}),
};

// add alias plugin early to ensure any other plugins that also add the aliases will override this
// eg. the preact vite plugin adds its own aliases
plugins.unshift(reactAliasPlugin);
plugins.unshift(packageDeduplicationPlugin);
plugins.push(mdxPlugin(options));

return config;
Expand Down
96 changes: 59 additions & 37 deletions code/builders/builder-vite/input/iframe.html
Original file line number Diff line number Diff line change
@@ -1,44 +1,66 @@
<!DOCTYPE html>
<!doctype html>
<!--suppress HtmlUnknownTarget -->
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Storybook</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />

<head>
<meta charset="utf-8" />
<title>Storybook</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link
rel="prefetch"
href="./sb-common-assets/nunito-sans-regular.woff2"
as="font"
type="font/woff2"
crossorigin
/>
<link
rel="prefetch"
href="./sb-common-assets/nunito-sans-italic.woff2"
as="font"
type="font/woff2"
crossorigin
/>
<link
rel="prefetch"
href="./sb-common-assets/nunito-sans-bold.woff2"
as="font"
type="font/woff2"
crossorigin
/>
<link
rel="prefetch"
href="./sb-common-assets/nunito-sans-bold-italic.woff2"
as="font"
type="font/woff2"
crossorigin
/>
<link rel="stylesheet" href="./sb-common-assets/fonts.css" />

<link rel="prefetch" href="./sb-common-assets/nunito-sans-regular.woff2" as="font" type="font/woff2" crossorigin />
<link rel="prefetch" href="./sb-common-assets/nunito-sans-italic.woff2" as="font" type="font/woff2" crossorigin />
<link rel="prefetch" href="./sb-common-assets/nunito-sans-bold.woff2" as="font" type="font/woff2" crossorigin />
<link rel="prefetch" href="./sb-common-assets/nunito-sans-bold-italic.woff2" as="font" type="font/woff2" crossorigin />
<link rel="stylesheet" href="./sb-common-assets/fonts.css" />
<script>
window.CONFIG_TYPE = '[CONFIG_TYPE HERE]';
window.LOGLEVEL = '[LOGLEVEL HERE]';
window.FRAMEWORK_OPTIONS = '[FRAMEWORK_OPTIONS HERE]';
window.CHANNEL_OPTIONS = '[CHANNEL_OPTIONS HERE]';
window.FEATURES = '[FEATURES HERE]';
window.STORIES = '[STORIES HERE]';
window.DOCS_OPTIONS = '[DOCS_OPTIONS HERE]';
window.TAGS_OPTIONS = '[TAGS_OPTIONS HERE]';

<script>
window.CONFIG_TYPE = '[CONFIG_TYPE HERE]';
window.LOGLEVEL = '[LOGLEVEL HERE]';
window.FRAMEWORK_OPTIONS = '[FRAMEWORK_OPTIONS HERE]';
window.CHANNEL_OPTIONS = '[CHANNEL_OPTIONS HERE]';
window.FEATURES = '[FEATURES HERE]';
window.STORIES = '[STORIES HERE]';
window.DOCS_OPTIONS = '[DOCS_OPTIONS HERE]';
window.TAGS_OPTIONS = '[TAGS_OPTIONS HERE]';
('OTHER_GLOBLALS HERE');

('OTHER_GLOBLALS HERE');
// We do this so that "module && module.hot" etc. in Storybook source code
// doesn't fail (it will simply be disabled)
window.module = undefined;
window.global = window;
</script>
<!-- [HEAD HTML SNIPPET HERE] -->
</head>

// We do this so that "module && module.hot" etc. in Storybook source code
// doesn't fail (it will simply be disabled)
window.module = undefined;
window.global = window;
</script>
<!-- [HEAD HTML SNIPPET HERE] -->
</head>

<body>
<!-- [BODY HTML SNIPPET HERE] -->
<div id="storybook-root"></div>
<div id="storybook-docs"></div>
<script type="module" src="./sb-preview/runtime.js"></script>
<script type="module" src="/virtual:/@storybook/builder-vite/vite-app.js"></script>
</body>

</html>
<body>
<!-- [BODY HTML SNIPPET HERE] -->
<div id="storybook-root"></div>
<div id="storybook-docs"></div>
<script type="module" src="./sb-preview/runtime.js"></script>
<script type="module" src="/virtual:/@storybook/builder-vite/vite-app.js"></script>
</body>
</html>
2 changes: 1 addition & 1 deletion code/frameworks/nextjs/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,4 +7,4 @@ See [documentation](https://storybook.js.org/docs/8.0/get-started/nextjs) for in
This framework borrows heavily from these Storybook addons:

- [storybook-addon-next](https://github.com/RyanClementsHax/storybook-addon-next) by [RyanClementsHax](https://github.com/RyanClementsHax/)
- [storybook-addon-next-router](https://github.com/lifeiscontent/storybook-addon-next-router) by [lifeiscontent](https://github.com/lifeiscontent)
- [storybook-addon-next-router](https://github.com/lifeiscontent/storybook-addon-next-router) by [lifeiscontent](https://github.com/lifeiscontent)
5 changes: 1 addition & 4 deletions code/frameworks/nextjs/src/preset.ts
Original file line number Diff line number Diff line change
Expand Up @@ -110,10 +110,7 @@ export const babel: PresetProperty<'babel'> = async (baseConfig: TransformOption
};

export const webpackFinal: StorybookConfig['webpackFinal'] = async (baseConfig, options) => {
const frameworkOptions = await options.presets.apply<{ options: FrameworkOptions }>(
'frameworkOptions'
);
const { options: { nextConfigPath } = {} } = frameworkOptions;
const { nextConfigPath } = await options.presets.apply<FrameworkOptions>('frameworkOptions');
const nextConfig = await configureConfig({
baseConfig,
nextConfigPath,
Expand Down
8 changes: 5 additions & 3 deletions code/lib/cli/src/generators/REACT_NATIVE/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,12 +14,15 @@ const generator = async (

const reactVersion = packageJson.dependencies.react;

const packagesToResolve = [
// addon-ondevice-controls peer deps
const controlsPeerDependencies = [
'react-native-safe-area-context',
'@react-native-async-storage/async-storage',
'@react-native-community/datetimepicker',
'@react-native-community/slider',
].filter((dep) => !packageJson.dependencies[dep] && !packageJson.devDependencies[dep]);

const packagesToResolve = [
...controlsPeerDependencies,
'@storybook/addon-ondevice-controls',
'@storybook/addon-ondevice-actions',
'@storybook/react-native',
Expand Down Expand Up @@ -47,7 +50,6 @@ const generator = async (

packageManager.addScripts({
'storybook-generate': 'sb-rn-get-stories',
'storybook-watch': 'sb-rn-watcher',
});

const storybookConfigFolder = '.storybook';
Expand Down
4 changes: 2 additions & 2 deletions code/lib/cli/src/generators/baseGenerator.ts
Original file line number Diff line number Diff line change
Expand Up @@ -224,8 +224,8 @@ export async function baseGenerator(

extraAddonsToInstall.push(
'@storybook/addon-links',
'@storybook/addon-essentials'
// '@chromatic-com/storybook@^1'
'@storybook/addon-essentials',
'@chromatic-com/storybook@^1'
);

// added to main.js
Expand Down
10 changes: 3 additions & 7 deletions code/lib/cli/tsconfig.json
Original file line number Diff line number Diff line change
@@ -1,15 +1,11 @@
{
"extends": "../../tsconfig.json",
"compilerOptions": {
"types": [
"node"
],
"types": ["node"],
"strict": true,
"skipLibCheck": true,
"resolveJsonModule": true,
"noEmit": true
},
"include": [
"src/**/*"
]
}
"include": ["src/**/*"]
}
17 changes: 14 additions & 3 deletions code/lib/core-common/templates/base-preview-head.html
Original file line number Diff line number Diff line change
Expand Up @@ -62,8 +62,17 @@
left: 0;
right: 0;
padding: 20px;
font-family: 'Nunito Sans', -apple-system, '.SFNSText-Regular', 'San Francisco',
BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-family:
'Nunito Sans',
-apple-system,
'.SFNSText-Regular',
'San Francisco',
BlinkMacSystemFont,
'Segoe UI',
'Helvetica Neue',
Helvetica,
Arial,
sans-serif;
-webkit-font-smoothing: antialiased;
overflow: auto;
}
Expand Down Expand Up @@ -257,7 +266,9 @@

.sb-argstableBlock-body {
border-radius: 4px;
box-shadow: rgba(0, 0, 0, 0.1) 0 1px 3px 1px, rgba(0, 0, 0, 0.065) 0 0 0 1px;
box-shadow:
rgba(0, 0, 0, 0.1) 0 1px 3px 1px,
rgba(0, 0, 0, 0.065) 0 0 0 1px;
}
.sb-argstableBlock-body tr {
background: transparent;
Expand Down
2 changes: 1 addition & 1 deletion code/lib/preview-api/docs/storiesOf.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@

In Storybook 5.2 we introduced a simpler and more portable [Component Story Format](https://storybook.js.org/docs/react/api/csf), and all future tools and infrastructure will be oriented towards CSF. Therefore, we recommend migrating your stories out of `storiesOf` API, and even provide [automated tools to do this](#component-story-format-migration).

That said, the `storiesOf` API is not officially deprecated. For the time being we plan to support it for the foreseeable future.
That said, the `storiesOf` API is no longer actively maintained and has been removed as part of the Storybook 8 release. If you're working with a custom indexer or similar tooling that implements this API, we encourage using custom story indexers instead. Read our [Indexer API documentation](https://storybook.js.org/docs/api/main-config-indexers) for more information.

## storiesOf API

Expand Down
Original file line number Diff line number Diff line change
@@ -1,23 +1,18 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`json-to-csf-compiler a11y.json 1`] = `
"
export default {
title: \\"Addons/a11y\\",
title: "Addons/a11y",
parameters: {
options: {
selectedPanel: \\"storybook/a11y/panel\\"
selectedPanel: "storybook/a11y/panel"
}
}
};

export const Label = {
name: \\"Label\\",
name: "Label",
parameters: {
server: {
id: \\"addons/a11y/label\\"
id: "addons/a11y/label"
}
}
};
"
`;
Original file line number Diff line number Diff line change
@@ -1,30 +1,25 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`json-to-csf-compiler actions.json 1`] = `
"
export default {
title: \\"Addons/Actions\\",
title: "Addons/Actions",
parameters: {
options: {
selectedPanel: \\"storybook/actions/panel\\"
selectedPanel: "storybook/actions/panel"
}
}
};

export const Multiple_actions_config = {
name: \\"Multiple actions + config\\",
name: "Multiple actions + config",
parameters: {
actions: [
\\"click\\",
\\"contextmenu\\",
"click",
"contextmenu",
{
clearOnStoryChange: false
}
],
server: {
id: \\"addons/actions/story3\\"
id: "addons/actions/story3"
}
}
};
"
`;
Original file line number Diff line number Diff line change
@@ -1,31 +1,26 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`json-to-csf-compiler backgrounds.json 1`] = `
"
export default {
title: \\"Addons/Backgrounds\\",
title: "Addons/Backgrounds",
parameters: {
backgrounds: [
{
name: \\"light\\",
value: \\"#eeeeee\\"
name: "light",
value: "#eeeeee"
},
{
name: \\"dark\\",
value: \\"#222222\\",
name: "dark",
value: "#222222",
default: true
}
]
}
};

export const Story_1 = {
name: \\"Story 1\\",
name: "Story 1",
parameters: {
server: {
id: \\"addons/backgrounds/story1\\"
id: "addons/backgrounds/story1"
}
}
};
"
`;
Loading

0 comments on commit a307dfa

Please sign in to comment.