diff --git a/code/__mocks__/inject-decorator.ts.csf-meta-var.txt b/code/__mocks__/inject-decorator.ts.csf-meta-var.txt index 557e4b7cc7a..aa9d34539d2 100644 --- a/code/__mocks__/inject-decorator.ts.csf-meta-var.txt +++ b/code/__mocks__/inject-decorator.ts.csf-meta-var.txt @@ -1,5 +1,5 @@ import React from "react"; -import { action } from "@storybook/addon-actions"; +import { action } from "storybook/actions"; import { Button } from "@storybook/react/demo"; const meta = { diff --git a/code/__mocks__/inject-decorator.ts.csf.txt b/code/__mocks__/inject-decorator.ts.csf.txt index b3a3d900dcc..3ba51032a71 100644 --- a/code/__mocks__/inject-decorator.ts.csf.txt +++ b/code/__mocks__/inject-decorator.ts.csf.txt @@ -1,5 +1,5 @@ import React from "react"; -import { action } from "@storybook/addon-actions"; +import { action } from "storybook/actions"; import { Button } from "@storybook/react/demo"; export default { diff --git a/code/__mocks__/inject-decorator.ts.csf3.txt b/code/__mocks__/inject-decorator.ts.csf3.txt index 42c7d2de57b..039e16e6bae 100644 --- a/code/__mocks__/inject-decorator.ts.csf3.txt +++ b/code/__mocks__/inject-decorator.ts.csf3.txt @@ -1,5 +1,5 @@ import React from "react"; -import { action } from "@storybook/addon-actions"; +import { action } from "storybook/actions"; import { Button } from "@storybook/react/demo"; export default { diff --git a/code/__mocks__/inject-parameters.ts.csf.txt b/code/__mocks__/inject-parameters.ts.csf.txt index d6cbac77222..5cad7953744 100644 --- a/code/__mocks__/inject-parameters.ts.csf.txt +++ b/code/__mocks__/inject-parameters.ts.csf.txt @@ -1,5 +1,5 @@ import React from "react"; -import { action } from "@storybook/addon-actions"; +import { action } from "storybook/actions"; import { Button } from "@storybook/react/demo"; export default { diff --git a/code/addons/controls/src/SaveStory.stories.tsx b/code/addons/controls/src/SaveStory.stories.tsx index f367762e3a5..4d31529c2c2 100644 --- a/code/addons/controls/src/SaveStory.stories.tsx +++ b/code/addons/controls/src/SaveStory.stories.tsx @@ -2,8 +2,7 @@ import React from 'react'; import type { Meta, StoryObj } from '@storybook/react'; -import { action } from '@storybook/addon-actions'; - +import { action } from 'storybook/actions'; import { expect, fireEvent, fn, userEvent, within } from 'storybook/test'; import { SaveStory } from './SaveStory'; diff --git a/code/addons/interactions/README.md b/code/addons/interactions/README.md index bd6895851cc..26192c246a8 100644 --- a/code/addons/interactions/README.md +++ b/code/addons/interactions/README.md @@ -20,8 +20,6 @@ export default { }; ``` -Note that `@storybook/addon-interactions` must be listed **after** `@storybook/addon-actions` or `@storybook/addon-essentials`. - ## Usage Interactions relies on "instrumented" versions of Vitest and Testing Library, that you import from `storybook/test` instead of their original package. You can then use these libraries in your `play` function. diff --git a/code/addons/interactions/src/components/Subnav.stories.tsx b/code/addons/interactions/src/components/Subnav.stories.tsx index 56df3f5dea1..bb48ee78e28 100644 --- a/code/addons/interactions/src/components/Subnav.stories.tsx +++ b/code/addons/interactions/src/components/Subnav.stories.tsx @@ -1,6 +1,6 @@ import { CallStates } from 'storybook/internal/instrumenter'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; import { parameters } from '../preview'; import { Subnav } from './Subnav'; diff --git a/code/addons/interactions/src/preset.ts b/code/addons/interactions/src/preset.ts index 2d5963d6302..82649e3c6a4 100644 --- a/code/addons/interactions/src/preset.ts +++ b/code/addons/interactions/src/preset.ts @@ -1,24 +1,2 @@ -import { isAbsolute, join } from 'node:path'; - -import { checkAddonOrder, serverRequire } from 'storybook/internal/common'; - -export function previewAnnotations(entry: string[] = [], options: { configDir: string }) { - checkAddonOrder({ - before: { - name: '@storybook/addon-actions', - inEssentials: true, - }, - after: { - name: '@storybook/addon-interactions', - inEssentials: false, - }, - configFile: isAbsolute(options.configDir) - ? join(options.configDir, 'main') - : join(process.cwd(), options.configDir, 'main'), - getConfig: (configFile) => serverRequire(configFile), - }); - return entry; -} - // This annotation is read by addon-test, so it can throw an error if both addons are used export const ADDON_INTERACTIONS_IN_USE = true; diff --git a/code/addons/links/README.md b/code/addons/links/README.md index 51066f17e69..5569d937a22 100644 --- a/code/addons/links/README.md +++ b/code/addons/links/README.md @@ -80,7 +80,7 @@ export const third = () => Go back; If you want to get an URL for a particular story, you may use `hrefTo` function. It returns a promise, which resolves to string containing a relative URL: ```js -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; import { hrefTo } from '@storybook/addon-links'; export default { diff --git a/code/addons/test/src/components/Subnav.stories.tsx b/code/addons/test/src/components/Subnav.stories.tsx index 56df3f5dea1..7c9dfa47e09 100644 --- a/code/addons/test/src/components/Subnav.stories.tsx +++ b/code/addons/test/src/components/Subnav.stories.tsx @@ -1,8 +1,7 @@ import { CallStates } from 'storybook/internal/instrumenter'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; -import { parameters } from '../preview'; import { Subnav } from './Subnav'; export default { diff --git a/code/addons/test/src/preset.ts b/code/addons/test/src/preset.ts index 3efdf5a44f8..1cc14ba2308 100644 --- a/code/addons/test/src/preset.ts +++ b/code/addons/test/src/preset.ts @@ -43,23 +43,6 @@ type Event = { }; }; -export const checkActionsLoaded = (configDir: string) => { - checkAddonOrder({ - before: { - name: '@storybook/addon-actions', - inEssentials: true, - }, - after: { - name: '@storybook/addon-test', - inEssentials: false, - }, - configFile: isAbsolute(configDir) - ? join(configDir, 'main') - : join(process.cwd(), configDir, 'main'), - getConfig: (configFile) => serverRequire(configFile), - }); -}; - // eslint-disable-next-line @typescript-eslint/naming-convention export const experimental_serverChannel = async (channel: Channel, options: Options) => { const core = await options.presets.apply('core'); @@ -198,14 +181,6 @@ export const staticDirs: PresetPropertyFn<'staticDirs'> = async (values = [], op ]; }; -export const previewAnnotations: PresetProperty<'previewAnnotations'> = async ( - entry = [], - options -) => { - checkActionsLoaded(options.configDir); - return entry; -}; - export const managerEntries: PresetProperty<'managerEntries'> = async (entry = [], options) => { // Throw an error when addon-interactions is used. // This is done by reading an annotation defined in addon-interactions, which although not ideal, diff --git a/code/core/src/common/js-package-manager/JsPackageManager.ts b/code/core/src/common/js-package-manager/JsPackageManager.ts index 3d3ecfacfa2..f811b40a21d 100644 --- a/code/core/src/common/js-package-manager/JsPackageManager.ts +++ b/code/core/src/common/js-package-manager/JsPackageManager.ts @@ -220,7 +220,6 @@ export abstract class JsPackageManager { * ```ts * addDependencies(options, [ * `@storybook/react@${storybookVersion}`, - * `@storybook/addon-actions@${actionsVersion}`, * `@storybook/addon-links@${linksVersion}`, * ]); * ``` @@ -277,7 +276,7 @@ export abstract class JsPackageManager { * @example * * ```ts - * removeDependencies(options, [`@storybook/react`, `@storybook/addon-actions`]); + * removeDependencies(options, [`@storybook/react`]); * ``` * * @param {Object} options Contains `skipInstall`, `packageJson` and `installAsDevDependencies` diff --git a/code/core/src/common/presets.test.ts b/code/core/src/common/presets.test.ts index 3a9a6c701a3..30b799ca2b9 100644 --- a/code/core/src/common/presets.test.ts +++ b/code/core/src/common/presets.test.ts @@ -30,8 +30,7 @@ vi.mock('storybook/internal/node-logger', () => ({ vi.mock('./utils/safeResolve', () => { const KNOWN_FILES = [ '@storybook/react', - '@storybook/addon-actions/manager', - '@storybook/addon-actions/register.js', + 'storybook/actions/manager', './local/preset', './local/addons', '/absolute/preset', @@ -411,18 +410,10 @@ describe('resolveAddonName', () => { }); }); - it('should resolve managerEntries', () => { - expect(resolveAddonName({} as any, '@storybook/addon-actions/register.js', {})).toEqual({ - name: '@storybook/addon-actions/register.js', - managerEntries: [normalize('@storybook/addon-actions/register')], - type: 'virtual', - }); - }); - it('should resolve managerEntries from new /manager path', () => { - expect(resolveAddonName({} as any, '@storybook/addon-actions/manager', {})).toEqual({ - name: '@storybook/addon-actions/manager', - managerEntries: [normalize('@storybook/addon-actions/manager')], + expect(resolveAddonName({} as any, 'storybook/actions/manager', {})).toEqual({ + name: 'storybook/actions/manager', + managerEntries: [normalize('storybook/actions/manager')], type: 'virtual', }); }); @@ -453,7 +444,6 @@ describe('loadPreset', () => { mockPreset('@storybook/react', {}); mockPreset('@storybook/preset-typescript', {}); mockPreset('@storybook/addon-docs/preset', {}); - mockPreset('@storybook/addon-actions/register.js', {}); mockPreset('addon-foo/register.js', {}); mockPreset('@storybook/addon-cool', {}); mockPreset('@storybook/addon-interactions/preset', {}); @@ -524,7 +514,6 @@ describe('loadPreset', () => { presets: ['@storybook/preset-typescript'], addons: [ '@storybook/addon-docs/preset', - '@storybook/addon-actions/register.js', 'addon-foo/register.js', 'addon-bar', 'addon-baz/register.js', @@ -545,13 +534,6 @@ describe('loadPreset', () => { options: {}, preset: {}, }, - { - name: '@storybook/addon-actions/register.js', - options: {}, - preset: { - managerEntries: [normalize('@storybook/addon-actions/register')], - }, - }, { name: 'addon-foo/register.js', options: {}, @@ -593,7 +575,6 @@ describe('loadPreset', () => { presets: ['@storybook/preset-typescript'], addons: [ '@storybook/addon-docs/preset', - '@storybook/addon-actions/register.js', 'addon-foo/register.js', 'addon-bar', 'addon-baz/register.js', diff --git a/code/core/src/common/presets.ts b/code/core/src/common/presets.ts index aa5f2c605aa..fdc54e82eb3 100644 --- a/code/core/src/common/presets.ts +++ b/code/core/src/common/presets.ts @@ -68,7 +68,6 @@ function resolvePresetFunction( * * Valid inputs: * - * - `'@storybook/addon-actions/manager' => { type: 'virtual', item }` * - `'@storybook/addon-docs/preset' => { type: 'presets', item }` * - `'@storybook/addon-docs' => { type: 'presets', item: '@storybook/addon-docs/preset' }` * - `{ name: '@storybook/addon-docs(/preset)?', options: { } } => { type: 'presets', item: { name: diff --git a/code/core/src/common/utils/get-addon-names.test.ts b/code/core/src/common/utils/get-addon-names.test.ts index c7769063afe..7cfd1db6384 100644 --- a/code/core/src/common/utils/get-addon-names.test.ts +++ b/code/core/src/common/utils/get-addon-names.test.ts @@ -6,19 +6,19 @@ describe('getAddonNames', () => { it('should extract addon names from simple strings', () => { const config = { stories: [], - addons: ['@storybook/addon-actions', '@storybook/addon-outline'], + addons: ['@storybook/addon-highlight', '@storybook/addon-outline'], }; const result = getAddonNames(config); - expect(result).toEqual(['@storybook/addon-actions', '@storybook/addon-outline']); + expect(result).toEqual(['@storybook/addon-highlight', '@storybook/addon-outline']); }); it('should extract addon names from object notation', () => { const config = { stories: [], - addons: [{ name: '@storybook/addon-actions' }, { name: '@storybook/addon-outline' }], + addons: [{ name: '@storybook/addon-highlight' }, { name: '@storybook/addon-outline' }], }; const result = getAddonNames(config); - expect(result).toEqual(['@storybook/addon-actions', '@storybook/addon-outline']); + expect(result).toEqual(['@storybook/addon-highlight', '@storybook/addon-outline']); }); it('should filter out relative paths for local addons', () => { @@ -34,12 +34,12 @@ describe('getAddonNames', () => { const config = { stories: [], addons: [ - '/sandbox/react-vite-default-ts/node_modules/@storybook/addon-actions', + '/sandbox/react-vite-default-ts/node_modules/@storybook/addon-highlight', '/sandbox/react-vite-default-ts/node_modules/@storybook/addon-outline', ], }; const result = getAddonNames(config); - expect(result).toEqual(['@storybook/addon-actions', '@storybook/addon-outline']); + expect(result).toEqual(['@storybook/addon-highlight', '@storybook/addon-outline']); }); it('should extract addon names from pnpm paths', () => { @@ -68,7 +68,7 @@ describe('getAddonNames', () => { const config = { stories: [], addons: [ - '@storybook/addon-actions', + '@storybook/addon-hightlight', { name: '@storybook/addon-outline' }, './local-addon', '/sandbox/react-vite-default-ts/node_modules/@storybook/addon-controls', @@ -76,7 +76,7 @@ describe('getAddonNames', () => { }; const result = getAddonNames(config); expect(result).toEqual([ - '@storybook/addon-actions', + '@storybook/addon-hightlight', '@storybook/addon-outline', '@storybook/addon-controls', ]); diff --git a/code/core/template/stories/basics.stories.ts b/code/core/template/stories/basics.stories.ts index 4b6eba0ae43..482ca83cd6c 100644 --- a/code/core/template/stories/basics.stories.ts +++ b/code/core/template/stories/basics.stories.ts @@ -1,6 +1,6 @@ import { global as globalThis } from '@storybook/global'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; export default { component: globalThis.Components.Button, diff --git a/code/core/template/stories/configs.stories.ts b/code/core/template/stories/configs.stories.ts index e52c17606bb..b1d57450849 100644 --- a/code/core/template/stories/configs.stories.ts +++ b/code/core/template/stories/configs.stories.ts @@ -1,6 +1,6 @@ import { global as globalThis } from '@storybook/global'; -import { actions, configureActions } from '@storybook/addon-actions'; +import { actions, configureActions } from 'storybook/actions'; const configs = actions('actionA', 'actionB', 'actionC'); diff --git a/code/core/template/stories/parameters-actions.stories.ts b/code/core/template/stories/parameters-actions.stories.ts index f184f89a153..f02e1955cf7 100644 --- a/code/core/template/stories/parameters-actions.stories.ts +++ b/code/core/template/stories/parameters-actions.stories.ts @@ -1,6 +1,6 @@ import { global as globalThis } from '@storybook/global'; -import { withActions } from '@storybook/addon-actions/decorator'; +import { withActions } from 'storybook/actions/decorator'; export default { component: globalThis.Components.Button, diff --git a/code/frameworks/angular/template/stories/others/app-initializer-use-factory/app-initializer-use-factory.stories.ts b/code/frameworks/angular/template/stories/others/app-initializer-use-factory/app-initializer-use-factory.stories.ts index 107f6e6d267..a6c56c90bd3 100644 --- a/code/frameworks/angular/template/stories/others/app-initializer-use-factory/app-initializer-use-factory.stories.ts +++ b/code/frameworks/angular/template/stories/others/app-initializer-use-factory/app-initializer-use-factory.stories.ts @@ -1,4 +1,4 @@ -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; import { Meta, StoryObj, moduleMetadata } from '@storybook/angular'; import { APP_INITIALIZER } from '@angular/core'; diff --git a/code/frameworks/ember/template/cli/Button.stories.js b/code/frameworks/ember/template/cli/Button.stories.js index 93511eade46..201c4e3bc4f 100644 --- a/code/frameworks/ember/template/cli/Button.stories.js +++ b/code/frameworks/ember/template/cli/Button.stories.js @@ -1,7 +1,7 @@ -import { action } from '@storybook/addon-actions'; import { linkTo } from '@storybook/addon-links'; import { hbs } from 'ember-cli-htmlbars'; +import { action } from 'storybook/actions'; import { fn } from 'storybook/test'; // More on how to set up stories at: https://storybook.js.org/docs/writing-stories diff --git a/code/frameworks/sveltekit/src/preview.ts b/code/frameworks/sveltekit/src/preview.ts index 6eb8a816dd1..64e301550af 100644 --- a/code/frameworks/sveltekit/src/preview.ts +++ b/code/frameworks/sveltekit/src/preview.ts @@ -1,7 +1,6 @@ import type { Decorator } from '@storybook/svelte'; -import { action } from '@storybook/addon-actions'; - +import { action } from 'storybook/actions'; import { onMount } from 'svelte'; import { setAfterNavigateArgument } from './mocks/app/navigation'; diff --git a/code/lib/blocks/src/components/ArgsTable/ArgsTable.stories.tsx b/code/lib/blocks/src/components/ArgsTable/ArgsTable.stories.tsx index ce83ae7e67e..8a51abc5c84 100644 --- a/code/lib/blocks/src/components/ArgsTable/ArgsTable.stories.tsx +++ b/code/lib/blocks/src/components/ArgsTable/ArgsTable.stories.tsx @@ -4,7 +4,7 @@ import { styled } from 'storybook/internal/theming'; import type { Meta, StoryObj } from '@storybook/react'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; import * as ArgRow from './ArgRow.stories'; import { ArgsTable, ArgsTableError } from './ArgsTable'; diff --git a/code/renderers/react/src/__test__/Button.csf4.stories.tsx b/code/renderers/react/src/__test__/Button.csf4.stories.tsx index 19b9c20460e..714949efef1 100644 --- a/code/renderers/react/src/__test__/Button.csf4.stories.tsx +++ b/code/renderers/react/src/__test__/Button.csf4.stories.tsx @@ -1,8 +1,7 @@ import React, { useEffect, useState } from 'react'; import { createPortal } from 'react-dom'; -import { action } from '@storybook/addon-actions'; - +import { action } from 'storybook/actions'; import { expect, fn, mocked, userEvent, within } from 'storybook/test'; import { __definePreview } from '../preview'; diff --git a/code/renderers/react/src/__test__/Button.stories.tsx b/code/renderers/react/src/__test__/Button.stories.tsx index 134748e8b34..3d2381b06d7 100644 --- a/code/renderers/react/src/__test__/Button.stories.tsx +++ b/code/renderers/react/src/__test__/Button.stories.tsx @@ -1,9 +1,8 @@ import React, { useEffect, useState } from 'react'; import { createPortal } from 'react-dom'; -import type { HandlerFunction } from '@storybook/addon-actions'; -import { action } from '@storybook/addon-actions'; - +import { action } from 'storybook/actions'; +import type { HandlerFunction } from 'storybook/actions'; import { expect, fn, mocked, userEvent, within } from 'storybook/test'; import type { StoryFn as CSF2Story, StoryObj as CSF3Story, Meta } from '..'; diff --git a/code/renderers/react/src/__test__/portable-stories-factory.test.tsx b/code/renderers/react/src/__test__/portable-stories-factory.test.tsx index ce1ba2f74c9..12336c2481e 100644 --- a/code/renderers/react/src/__test__/portable-stories-factory.test.tsx +++ b/code/renderers/react/src/__test__/portable-stories-factory.test.tsx @@ -1,6 +1,4 @@ // @vitest-environment happy-dom - -/* eslint-disable import/namespace */ import { cleanup, render, screen } from '@testing-library/react'; import { afterEach, beforeAll, describe, expect, it, vi } from 'vitest'; @@ -11,9 +9,8 @@ import { addons } from 'storybook/internal/preview-api'; import type { Meta, ReactRenderer } from '@storybook/react'; -import * as addonActionsPreview from '@storybook/addon-actions/preview'; - import { expectTypeOf } from 'expect-type'; +import * as addonActionsPreview from 'storybook/actions/preview'; import { composeStories, composeStory, setProjectAnnotations } from '..'; import type { Button } from './Button'; diff --git a/code/renderers/react/src/__test__/portable-stories-legacy.test.tsx b/code/renderers/react/src/__test__/portable-stories-legacy.test.tsx index cc098fcc168..c014deafa03 100644 --- a/code/renderers/react/src/__test__/portable-stories-legacy.test.tsx +++ b/code/renderers/react/src/__test__/portable-stories-legacy.test.tsx @@ -1,6 +1,4 @@ // @vitest-environment happy-dom - -/* eslint-disable import/namespace */ import { cleanup, render, screen } from '@testing-library/react'; import { afterEach, describe, expect, it, vi } from 'vitest'; @@ -10,9 +8,8 @@ import { addons } from 'storybook/internal/preview-api'; import type { Meta } from '@storybook/react'; -import * as addonActionsPreview from '@storybook/addon-actions/preview'; - import { expectTypeOf } from 'expect-type'; +import * as addonActionsPreview from 'storybook/actions/preview'; import { composeStories, composeStory, setProjectAnnotations } from '..'; import type { Button } from './Button'; diff --git a/code/renderers/react/src/__test__/portable-stories.test.tsx b/code/renderers/react/src/__test__/portable-stories.test.tsx index fe003dc82a2..132524ec6a3 100644 --- a/code/renderers/react/src/__test__/portable-stories.test.tsx +++ b/code/renderers/react/src/__test__/portable-stories.test.tsx @@ -1,6 +1,4 @@ // @vitest-environment happy-dom - -/* eslint-disable import/namespace */ import { cleanup, render, screen } from '@testing-library/react'; import { afterEach, beforeAll, describe, expect, it, vi } from 'vitest'; @@ -11,9 +9,8 @@ import { addons } from 'storybook/internal/preview-api'; import type { Meta, ReactRenderer } from '@storybook/react'; -import * as addonActionsPreview from '@storybook/addon-actions/preview'; - import { expectTypeOf } from 'expect-type'; +import * as addonActionsPreview from 'storybook/actions/preview'; import { composeStories, composeStory, setProjectAnnotations } from '..'; import type { Button } from './Button'; diff --git a/docs/_snippets/addon-actions-action-function.md b/docs/_snippets/addon-actions-action-function.md index 6af337fe1ac..5a995990008 100644 --- a/docs/_snippets/addon-actions-action-function.md +++ b/docs/_snippets/addon-actions-action-function.md @@ -1,6 +1,6 @@ ```ts filename="Button.stories.ts" renderer="angular" language="ts" import type { Meta } from '@storybook/angular'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; import Button from './button.component'; @@ -16,7 +16,7 @@ export default meta; ``` ```js filename="Button.stories.js" renderer="common" language="js" -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; import Button from './Button'; @@ -32,7 +32,7 @@ export default { ```ts filename="Button.stories.ts" renderer="common" language="ts-4-9" // Replace your-framework with the name of your framework import type { Meta } from '@storybook/your-framework'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; import Button from './Button'; @@ -50,7 +50,7 @@ export default meta; ```ts filename="Button.stories.ts" renderer="common" language="ts" // Replace your-framework with the name of your framework import type { Meta } from '@storybook/your-framework'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; import Button from './Button'; @@ -66,7 +66,7 @@ export default meta; ``` ```ts filename="Button.stories.js" renderer="web-components" language="js" -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; export default { component: 'demo-button', @@ -79,7 +79,7 @@ export default { ```ts filename="Button.stories.ts" renderer="web-components" language="ts" import type { Meta } from '@storybook/angular'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; const meta: Meta = { component: 'demo-button', diff --git a/docs/_snippets/button-story-action-event-handle.md b/docs/_snippets/button-story-action-event-handle.md index a574de6e82b..3df987de79c 100644 --- a/docs/_snippets/button-story-action-event-handle.md +++ b/docs/_snippets/button-story-action-event-handle.md @@ -1,7 +1,7 @@ ```ts filename="Button.stories.ts" renderer="angular" language="ts" import type { Meta } from '@storybook/angular'; -import { withActions } from '@storybook/addon-actions/decorator'; +import { withActions } from 'storybook/actions/decorator'; import { Button } from './button.component'; @@ -21,7 +21,7 @@ export default meta; ```js filename="Button.stories.js|jsx" renderer="common" language="js" import { Button } from './Button'; -import { withActions } from '@storybook/addon-actions/decorator'; +import { withActions } from 'storybook/actions/decorator'; export default { component: Button, @@ -38,7 +38,7 @@ export default { // Replace your-framework with the name of your framework import type { Meta } from '@storybook/your-framework'; -import { withActions } from '@storybook/addon-actions/decorator'; +import { withActions } from 'storybook/actions/decorator'; import { Button } from './Button'; @@ -59,7 +59,7 @@ export default meta; // Replace your-framework with the name of your framework import type { Meta } from '@storybook/your-framework'; -import { withActions } from '@storybook/addon-actions/decorator'; +import { withActions } from 'storybook/actions/decorator'; import { Button } from './Button'; @@ -77,7 +77,7 @@ export default meta; ``` ```js filename="Button.stories.js" renderer="web-components" language="js" -import { withActions } from '@storybook/addon-actions/decorator'; +import { withActions } from 'storybook/actions/decorator'; export default { component: 'demo-button', @@ -92,7 +92,7 @@ export default { ```ts filename="Button.stories.ts" renderer="web-components" language="ts" import type { Meta } from '@storybook/web-components'; -import { withActions } from '@storybook/addon-actions/decorator'; +import { withActions } from 'storybook/actions/decorator'; const meta: Meta = { component: 'demo-button', diff --git a/docs/_snippets/button-story-click-handler-args.md b/docs/_snippets/button-story-click-handler-args.md index 1feaa43722d..2f2e985c46e 100644 --- a/docs/_snippets/button-story-click-handler-args.md +++ b/docs/_snippets/button-story-click-handler-args.md @@ -2,7 +2,7 @@ import type { Meta, StoryObj } from '@storybook/angular'; import { argsToTemplate } from '@storybook/angular'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; import { Button } from './button.component'; @@ -32,7 +32,7 @@ export const Text: Story = { ``` ```js filename="Button.stories.js|jsx" renderer="react" language="js" -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; import { Button } from './Button'; @@ -52,7 +52,7 @@ export const Text = { ```ts filename="Button.stories.ts|tsx" renderer="react" language="ts-4-9" import type { Meta, StoryObj } from '@storybook/react'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; import { Button } from './Button'; @@ -75,7 +75,7 @@ export const Text = { ```ts filename="Button.stories.ts|tsx" renderer="react" language="ts" import type { Meta, StoryObj } from '@storybook/react'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; import { Button } from './Button'; @@ -96,7 +96,7 @@ export const Text = { ``` ```js filename="Button.stories.js|jsx" renderer="solid" language="js" -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; import { Button } from './Button'; @@ -116,7 +116,7 @@ export const Text = { ```tsx filename="Button.stories.ts|tsx" renderer="solid" language="ts-4-9" import type { Meta, StoryObj } from 'storybook-solidjs'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; import { Button } from './Button'; @@ -139,7 +139,7 @@ export const Text = { ```ts filename="Button.stories.ts|tsx" renderer="solid" language="ts" import type { Meta, StoryObj } from 'storybook-solidjs'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; import { Button } from './Button'; @@ -162,7 +162,7 @@ export const Text = { ```js filename="Button.stories.js" renderer="svelte" language="js" import Button from './Button.svelte'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; export default { component: Button, @@ -187,7 +187,7 @@ export const Text = { ```ts filename="Button.stories.ts" renderer="svelte" language="ts-4-9" import type { Meta, StoryObj } from '@storybook/svelte'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; import Button from './Button.svelte'; @@ -217,7 +217,7 @@ export const Primary: Story = { ```ts filename="Button.stories.ts" renderer="svelte" language="ts" import type { Meta, StoryObj } from '@storybook/svelte'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; import Button from './Button.svelte'; @@ -248,7 +248,7 @@ export const Text: Story = { ```js filename="Button.stories.js" renderer="vue" language="js" import Button from './Button.vue'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; export default { component: Button, @@ -276,7 +276,7 @@ import type { Meta, StoryObj } from '@storybook/vue3'; import Button from './Button.vue'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; const meta = { component: Button, @@ -307,7 +307,7 @@ import type { Meta, StoryObj } from '@storybook/vue3'; import Button from './Button.vue'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; const meta: Meta = { component: Button, @@ -336,7 +336,7 @@ export const Primary: Story = { ```js filename="Button.stories.js" renderer="web-components" language="js" import { html } from 'lit'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; export default { component: 'custom-button', @@ -354,7 +354,7 @@ export const Text = { ```ts filename="Button.stories.ts" renderer="web-components" language="ts" import type { Meta, StoryObj } from '@storybook/web-components'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; import { html } from 'lit'; diff --git a/docs/_snippets/button-story-click-handler.md b/docs/_snippets/button-story-click-handler.md index 72ceb73b21c..b58a3b592ef 100644 --- a/docs/_snippets/button-story-click-handler.md +++ b/docs/_snippets/button-story-click-handler.md @@ -3,7 +3,7 @@ import type { Meta, StoryObj } from '@storybook/angular'; import { Button } from './button.component'; -import { action } from '@storybook/addon-actions'; +import { action } from 'storybook/actions'; const meta: Meta