move remaining action stories & cleanup usage of addon-actions everyw…

…here where it serves no further purpose

code/addons/actions/template/stories/configs.stories.tsx

@@ -0,0 +1,36 @@
+import globalThis from 'global';
+
+import { actions, configureActions } from '@storybook/addon-actions';
+
+const configs = actions('actionA', 'actionB', 'actionC');
+
+export default {
+  component: globalThis.Components.Button,
+  args: {
+    children: 'Click Me!',
+  },
+  parameters: {
+    chromatic: { disable: true },
+  },
+};
+
+export const ActionA = {
+  args: { onClick: configs.actionA },
+};
+export const ActionB = {
+  args: { onClick: configs.actionB },
+};
+export const ActionC = {
+  args: { onClick: configs.actionC },
+};
+
+export const ConfigureActions = {
+  args: { onClick: configs.actionA },
+  decorators: [
+    (storyFn: any) => {
+      configureActions({ depth: 2 });
+
+      return storyFn();
+    },
+  ],
+};

code/addons/actions/template/stories/parameters.stories.tsx

@@ -0,0 +1,17 @@
+import globalThis from 'global';
+
+export default {
+  component: globalThis.Components.Button,
+  args: {
+    children: 'Click Me!',
+  },
+  parameters: {
+    chromatic: { disable: true },
+  },
+};
+
+export const Basic = {
+  parameters: {
+    handles: [{ click: 'clicked', contextmenu: 'right clicked' }],
+  },
+};

code/addons/interactions/src/components/InteractionsPanel.stories.tsx

@@ -1,6 +1,5 @@
 /* eslint-disable jest/no-standalone-expect */
 import React from 'react';
-import { action } from '@storybook/addon-actions';
 import type { ComponentStoryObj, ComponentMeta } from '@storybook/react';
 import { CallStates } from '@storybook/instrumenter';
 import { styled } from '@storybook/theming';
@@ -48,7 +47,7 @@ export default {
     fileName: 'addon-interactions.stories.tsx',
     hasException: false,
     isPlaying: false,
-    onScrollToEnd: action('onScrollToEnd'),
+    onScrollToEnd: () => {},
     endRef: null,
     // prop for the AddonPanel used as wrapper of Panel
     active: true,

code/addons/storyshots/storyshots-core/stories/required_with_context/Button.stories.js

@@ -1,6 +1,5 @@
 import React from 'react';
 
-import { action } from '@storybook/addon-actions';
 import { Button } from '../react-demo';
 
 export default {
@@ -11,10 +10,10 @@ export default {
   },
 };
 
-export const WithText = () => <Button onClick={action('clicked')}>Hello Button</Button>;
+export const WithText = () => <Button>Hello Button</Button>;
 
 export const WithSomeEmoji = () => (
-  <Button onClick={action('clicked')}>
+  <Button>
     <span role="img" aria-label="so cool">
       😀 😎 👍 💯
     </span>

code/examples/angular-cli/src/stories/addons/docs/simple.stories.mdx

@@ -1,6 +1,5 @@
 import { Story, Meta, ArgsTable, Source } from '@storybook/addon-docs';
 import { Button } from '../.././angular-demo';
-import { action } from '@storybook/addon-actions';
 
 <Meta title="Addons/Docs/SimpleButton" component={Button} />
 
@@ -21,7 +20,7 @@ import { action } from '@storybook/addon-actions';
   {(args) => ({
     props: {
       text: args.text,
-      onClick: action('clicked'),
+      onClick: () => {},
     },
   })}
 </Story>

code/examples/angular-cli/src/stories/basics/angular-forms/customControlValueAccessor/custom-cva-component.stories.ts

@@ -1,5 +1,4 @@
 import { FormsModule } from '@angular/forms';
-import { action } from '@storybook/addon-actions';
 import { moduleMetadata, Meta, StoryFn } from '@storybook/angular';
 import { CustomCvaComponent } from './custom-cva.component';
 
@@ -21,7 +20,7 @@ export default {
 export const SimpleInput: StoryFn = () => ({
   props: {
     ngModel: 'Type anything',
-    ngModelChange: action('ngModelChange'),
+    ngModelChange: () => {},
   },
 });
 

code/examples/angular-cli/src/stories/core/styles/story-styles.stories.ts

@@ -1,5 +1,4 @@
 import { Meta, moduleMetadata, StoryFn } from '@storybook/angular';
-import { action } from '@storybook/addon-actions';
 import { Button } from '../../angular-demo';
 
 export default {
@@ -15,7 +14,7 @@ export const TemplateStory: StoryFn = () => ({
   template: `<storybook-button-component [text]="text" (onClick)="onClick($event)"></storybook-button-component>`,
   props: {
     text: 'Button with custom styles',
-    onClick: action('log'),
+    onClick: () => {},
   },
   styles: [
     `

code/examples/cra-kitchen-sink/src/stories/button.stories.js

@@ -1,21 +1,20 @@
 import React from 'react';
-import { action } from '@storybook/addon-actions';
 import { Button } from '../components/react-demo';
 
 export default {
   title: 'Button',
   component: Button,
 };
 
-export const Story1 = () => <Button onClick={action('clicked', { depth: 1 })}>Hello Button</Button>;
+export const Story1 = () => <Button>Hello Button</Button>;
 Story1.storyName = 'with text';
 
 Story1.parameters = {
   options: { selectedPanel: 'storybook/actions/panel' },
 };
 
 export const Story2 = () => (
-  <Button onClick={action('clicked')}>
+  <Button>
     <span role="img" aria-label="yolo">
       😀 😎 👍 💯
     </span>

code/examples/cra-kitchen-sink/src/stories/decorators.stories.js

@@ -1,5 +1,4 @@
 import React from 'react';
-import { action } from '@storybook/addon-actions';
 import PropTypes from 'prop-types';
 import { Button } from '../components/react-demo';
 
@@ -24,13 +23,12 @@ export default {
 };
 
 export const WithArgs = (args) => <Button {...args} />;
-WithArgs.args = { onClick: action('clicked', { depth: 1 }), children: 'With args' };
+WithArgs.args = { children: 'With args' };
 
-export const Basic = () => <Button onClick={action('clicked', { depth: 1 })}>Basic</Button>;
+export const Basic = () => <Button>Basic</Button>;
 
-export const Nested = (args) => (
-  <Button {...args}>
+export const Nested = () => (
+  <Button>
     <Bold>Hello</Bold>
   </Button>
 );
-Nested.args = { onClick: action('clicked', { depth: 1 }) };

code/examples/cra-kitchen-sink/src/stories/long-description.stories.js

@@ -1,10 +1,9 @@
 import React from 'react';
-import { action } from '@storybook/addon-actions';
 import { Button } from '../components/react-demo';
 
 export default {
   title: 'Some really long story kind description',
 };
 
-export const Story1 = () => <Button onClick={action('clicked')}>Hello Button</Button>;
+export const Story1 = () => <Button>Hello Button</Button>;
 Story1.storyName = 'with text';

code/examples/cra-ts-kitchen-sink/src/components/Button.stories.tsx

@@ -1,5 +1,4 @@
 import React from 'react';
-import { action } from '@storybook/addon-actions';
 import Button, { Type } from './Button';
 
 export default {
@@ -9,7 +8,7 @@ export default {
 
 export const SimpleButton = () => {
   const x = 0;
-  return <Button onClick={action('button clicked')}>OK {x}</Button>;
+  return <Button>OK {x}</Button>;
 };
 
 const typeOptions = {

code/examples/cra-ts-kitchen-sink/src/stories/1-Button.stories.tsx

@@ -1,16 +1,15 @@
 import React from 'react';
-import { action } from '@storybook/addon-actions';
 import { Button } from './Button';
 
 export default {
   title: '1-Button',
   component: Button,
 };
 
-export const Text = () => <Button onClick={action('clicked')}>Hello Button</Button>;
+export const Text = () => <Button>Hello Button</Button>;
 
 export const Emoji = () => (
-  <Button onClick={action('clicked')}>
+  <Button>
     <span role="img" aria-label="so cool">
       😀 😎 👍 💯
     </span>

code/examples/ember-cli/stories/welcome-banner.stories.js

@@ -1,5 +1,4 @@
 import { hbs } from 'ember-cli-htmlbars';
-import { action } from '@storybook/addon-actions';
 
 export default {
   title: 'welcome-banner',
@@ -23,7 +22,6 @@ export const Basic = (args) => ({
         subTitleColor=subTitleColor
         title=title
         subtitle=subtitle
-        click=(action onClick)
       }}
     `,
   context: args,
@@ -34,5 +32,4 @@ Basic.args = {
   subTitleColor: '#B8854F',
   title: 'Welcome to storybook',
   subtitle: 'This environment is completely editable',
-  onClick: action('clicked'),
 };