diff --git a/code/frameworks/preact-vite/README.md b/code/frameworks/preact-vite/README.md index 16451b320e0..ce6ad2a786e 100644 --- a/code/frameworks/preact-vite/README.md +++ b/code/frameworks/preact-vite/README.md @@ -1,47 +1,4 @@ -# Storybook for Preact +# Storybook for Preact & Vite -## Requirements - -- [Preact](https://preactjs.com/) >= 10.x -- [Storybook](https://storybook.js.org/) >= 7.x - -## Getting Started - -### In a project without Storybook - -Follow the prompts after running this command in your Preact project's root directory: - -```bash -npx storybook@latest init -``` - -[More on getting started with Storybook](https://storybook.js.org/docs/get-started/install?renderer=preact) - -### In a project with Storybook - -This framework is designed to work with Storybook 7. If youโ€™re not already using v7, upgrade with this command: - -```bash -npx storybook@latest upgrade -``` - -#### Manual migration - -Install the framework: - -```bash -yarn add --dev @storybook/preact-vite -``` - -Update your `main.js` to change the framework property: - -```js -// .storybook/main.js -export default { - // ... - framework: { - name: '@storybook/preact-vite', // <- Change this - options: {}, - }, -}; -``` +See [documentation](https://storybook.js.org/docs/get-started/frameworks/preact-vite?renderer=preact) for installation instructions, usage examples, APIs, and more. +`; diff --git a/docs/_snippets/preact-vite-add-framework.md b/docs/_snippets/preact-vite-add-framework.md index 897b51a6d78..e6412b3b298 100644 --- a/docs/_snippets/preact-vite-add-framework.md +++ b/docs/_snippets/preact-vite-add-framework.md @@ -1,4 +1,4 @@ -```js filename=".storybook/main.js" renderer="react" language="js" +```js filename=".storybook/main.js" renderer="preact" language="js" export default { // ... // framework: '@storybook/preact-webpack5', ๐Ÿ‘ˆ Remove this @@ -6,7 +6,7 @@ export default { }; ``` -```ts filename=".storybook/main.ts" renderer="react" language="ts" +```ts filename=".storybook/main.ts" renderer="preact" language="ts" import { StorybookConfig } from '@storybook/preact-vite'; const config: StorybookConfig = { diff --git a/docs/_snippets/preact-vite-install.md b/docs/_snippets/preact-vite-install.md index 78adadde933..48bdfdefa99 100644 --- a/docs/_snippets/preact-vite-install.md +++ b/docs/_snippets/preact-vite-install.md @@ -1,11 +1,11 @@ -```shell renderer="react" language="js" packageManager="npm" +```shell renderer="preact" language="js" packageManager="npm" npm install --save-dev @storybook/preact-vite ``` -```shell renderer="react" language="js" packageManager="pnpm" +```shell renderer="preact" language="js" packageManager="pnpm" pnpm add --save-dev @storybook/preact-vite ``` -```shell renderer="react" language="js" packageManager="yarn" +```shell renderer="preact" language="js" packageManager="yarn" yarn add --dev @storybook/preact-vite ``` diff --git a/docs/get-started/frameworks/preact-vite.mdx b/docs/get-started/frameworks/preact-vite.mdx index 25d62ceac5f..0d356a0ae84 100644 --- a/docs/get-started/frameworks/preact-vite.mdx +++ b/docs/get-started/frameworks/preact-vite.mdx @@ -1,7 +1,7 @@ --- title: Storybook for Preact & Vite sidebar: - order: 13 + order: 3 title: Preact & Vite --- @@ -11,7 +11,7 @@ Storybook for Preact & Vite is a [framework](../../contribute/framework.mdx) tha * ๐Ÿช„ Zero config * ๐Ÿ’ซ and more! - + Storybook for Preact & Vite is only supported in [Preact](?renderer=preact) projects. @@ -30,7 +30,7 @@ Storybook for Preact & Vite is a [framework](../../contribute/framework.mdx) tha ### In a project without Storybook - Follow the prompts after running this command in your React project's root directory: + Follow the prompts after running this command in your Preact project's root directory: {/* prettier-ignore-start */} @@ -72,14 +72,6 @@ Storybook for Preact & Vite is a [framework](../../contribute/framework.mdx) tha {/* prettier-ignore-end */} - ## Run the Setup Wizard - - If all goes well, you should see a setup wizard that will help you get started with Storybook introducing you to the main concepts and features, including how the UI is organized, how to write your first story, and how to test your components' response to various inputs utilizing [controls](../../essentials/controls.mdx). - - ![Storybook onboarding](../../_assets/get-started/example-onboarding-wizard.png) - - If you skipped the wizard, you can always run it again by adding the `?path=/onboarding` query parameter to the URL of your Storybook instance, provided that the example stories are still available. - ## API ### Options diff --git a/docs/get-started/frameworks/react-native-web-vite.mdx b/docs/get-started/frameworks/react-native-web-vite.mdx index 19324dda5c4..5469d589d37 100644 --- a/docs/get-started/frameworks/react-native-web-vite.mdx +++ b/docs/get-started/frameworks/react-native-web-vite.mdx @@ -1,7 +1,7 @@ --- title: Storybook for React Native Web sidebar: - order: 5 + order: 6 title: React Native Web --- diff --git a/docs/get-started/frameworks/react-vite.mdx b/docs/get-started/frameworks/react-vite.mdx index d2de31b5b32..2fe56efdccb 100644 --- a/docs/get-started/frameworks/react-vite.mdx +++ b/docs/get-started/frameworks/react-vite.mdx @@ -1,7 +1,7 @@ --- title: Storybook for React & Vite sidebar: - order: 3 + order: 4 title: React & Vite --- diff --git a/docs/get-started/frameworks/react-webpack5.mdx b/docs/get-started/frameworks/react-webpack5.mdx index 7aef5014ee8..124d09766b4 100644 --- a/docs/get-started/frameworks/react-webpack5.mdx +++ b/docs/get-started/frameworks/react-webpack5.mdx @@ -1,7 +1,7 @@ --- title: Storybook for React & Webpack sidebar: - order: 4 + order: 5 title: React & Webpack --- diff --git a/docs/get-started/frameworks/svelte-vite.mdx b/docs/get-started/frameworks/svelte-vite.mdx index 984688bbfc2..4d0ea1ebd00 100644 --- a/docs/get-started/frameworks/svelte-vite.mdx +++ b/docs/get-started/frameworks/svelte-vite.mdx @@ -1,7 +1,7 @@ --- title: Storybook for Svelte & Vite sidebar: - order: 7 + order: 8 title: Svelte & Vite --- diff --git a/docs/get-started/frameworks/svelte-webpack5.mdx b/docs/get-started/frameworks/svelte-webpack5.mdx index 142eeac1ccd..6e3e15ad1c7 100644 --- a/docs/get-started/frameworks/svelte-webpack5.mdx +++ b/docs/get-started/frameworks/svelte-webpack5.mdx @@ -1,7 +1,7 @@ --- title: Storybook for Svelte & Webpack sidebar: - order: 8 + order: 9 title: Svelte & Webpack --- diff --git a/docs/get-started/frameworks/sveltekit.mdx b/docs/get-started/frameworks/sveltekit.mdx index 55210871bb0..5421e00733d 100644 --- a/docs/get-started/frameworks/sveltekit.mdx +++ b/docs/get-started/frameworks/sveltekit.mdx @@ -1,7 +1,7 @@ --- title: Storybook for SvelteKit sidebar: - order: 6 + order: 7 title: SvelteKit --- diff --git a/docs/get-started/frameworks/vue3-vite.mdx b/docs/get-started/frameworks/vue3-vite.mdx index 18a557057cb..9b5d28ae805 100644 --- a/docs/get-started/frameworks/vue3-vite.mdx +++ b/docs/get-started/frameworks/vue3-vite.mdx @@ -1,7 +1,7 @@ --- title: Storybook for Vue & Vite sidebar: - order: 9 + order: 10 title: Vue & Vite --- diff --git a/docs/get-started/frameworks/vue3-webpack5.mdx b/docs/get-started/frameworks/vue3-webpack5.mdx index 52dfc675795..60771cd4190 100644 --- a/docs/get-started/frameworks/vue3-webpack5.mdx +++ b/docs/get-started/frameworks/vue3-webpack5.mdx @@ -1,7 +1,7 @@ --- title: Storybook for Vue & Webpack sidebar: - order: 10 + order: 11 title: Vue & Webpack --- diff --git a/docs/get-started/frameworks/web-components-vite.mdx b/docs/get-started/frameworks/web-components-vite.mdx index a902b103c8b..22bd68bf078 100644 --- a/docs/get-started/frameworks/web-components-vite.mdx +++ b/docs/get-started/frameworks/web-components-vite.mdx @@ -1,7 +1,7 @@ --- title: Storybook for Web components & Vite sidebar: - order: 11 + order: 12 title: Web components & Vite --- diff --git a/docs/get-started/frameworks/web-components-webpack5.mdx b/docs/get-started/frameworks/web-components-webpack5.mdx index 0777cadf806..820ebeb2f29 100644 --- a/docs/get-started/frameworks/web-components-webpack5.mdx +++ b/docs/get-started/frameworks/web-components-webpack5.mdx @@ -1,7 +1,7 @@ --- title: Storybook for Web components & Webpack sidebar: - order: 12 + order: 13 title: Web components & Webpack ---