@storybook/addon-actions - npm Package Compare versions

Comparing version 0.0.0-pr-30197-sha-861625a8 to 0.0.0-pr-30197-sha-8babc1dd

dist/index.d.ts

@@ -0,1 +1,4 @@
+import * as core_dist_types from 'storybook/internal/types';
+import * as _storybook_csf from '@storybook/csf';
+
 declare const PARAM_KEY = "actions";
@@ -68,2 +71,41 @@ declare const ADDON_ID = "storybook/actions";
 
-export { ADDON_ID, ActionDisplay, ActionOptions, ActionsFunction, ActionsMap, CLEAR_ID, CYCLIC_KEY, DecoratorFunction, EVENT_ID, HandlerFunction, PANEL_ID, PARAM_KEY, action, actions, config, configureActions };
+interface ActionsParameters {
+    /**
+     * Actions configuration
+     *
+     * @see https://storybook.js.org/docs/essentials/actions#parameters
+     */
+    actions: {
+        /**
+         * Create actions for each arg that matches the regex. (**NOT recommended, see below**)
+         *
+         * This is quite useful when your component has dozens (or hundreds) of methods and you do not
+         * want to manually apply the fn utility for each of those methods. However, this is not the
+         * recommended way of writing actions. That's because automatically inferred args are not
+         * available as spies in your play function. If you use argTypesRegex and your stories have play
+         * functions, you will need to also define args with the fn utility to test them in your play
+         * function.
+         *
+         * @example `argTypesRegex: '^on.*'`
+         */
+        argTypesRegex?: string;
+        /** Remove the addon panel and disable the addon's behavior */
+        disable?: boolean;
+        /**
+         * Binds a standard HTML event handler to the outermost HTML element rendered by your component
+         * and triggers an action when the event is called for a given selector. The format is
+         * `<eventname> <selector>`. The selector is optional; it defaults to all elements.
+         *
+         * **To enable this feature, you must use the `withActions` decorator.**
+         *
+         * @example `handles: ['mouseover', 'click .btn']`
+         *
+         * @see https://storybook.js.org/docs/essentials/actions#action-event-handlers
+         */
+        handles?: string[];
+    };
+}
+
+declare const _default: () => core_dist_types.ProjectAnnotations<_storybook_csf.Renderer>;
+
+export { ADDON_ID, ActionDisplay, ActionOptions, ActionsFunction, ActionsMap, ActionsParameters, CLEAR_ID, CYCLIC_KEY, DecoratorFunction, EVENT_ID, HandlerFunction, PANEL_ID, PARAM_KEY, action, actions, config, configureActions, _default as default };

dist/index.js

 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
 var previewApi = require('storybook/internal/preview-api');
@@ -8,3 +10,3 @@ var previewErrors = require('storybook/internal/preview-errors');
 
-var PARAM_KEY="actions",ADDON_ID="storybook/actions",PANEL_ID=`${ADDON_ID}/panel`,EVENT_ID=`${ADDON_ID}/action-event`,CLEAR_ID=`${ADDON_ID}/action-clear`,CYCLIC_KEY="$___storybook.isCyclic";var config={depth:10,clearOnStoryChange:!0,limit:50},configureActions=(options={})=>{Object.assign(config,options);};var findProto=(obj,callback)=>{let proto=Object.getPrototypeOf(obj);return !proto||callback(proto)?proto:findProto(proto,callback)},isReactSyntheticEvent=e=>!!(typeof e=="object"&&e&&findProto(e,proto=>/^Synthetic(?:Base)?Event$/.test(proto.constructor.name))&&typeof e.persist=="function"),serializeArg=a=>{if(isReactSyntheticEvent(a)){let e=Object.create(a.constructor.prototype,Object.getOwnPropertyDescriptors(a));e.persist();let viewDescriptor=Object.getOwnPropertyDescriptor(e,"view"),view=viewDescriptor?.value;return typeof view=="object"&&view?.constructor.name==="Window"&&Object.defineProperty(e,"view",{...viewDescriptor,value:Object.create(view.constructor.prototype)}),e}return a},generateId=()=>typeof crypto=="object"&&typeof crypto.getRandomValues=="function"?uuid.v4():Date.now().toString(36)+Math.random().toString(36).substring(2);function action(name,options={}){let actionOptions={...config,...options},handler=function(...args){if(options.implicit){let storyRenderer=("__STORYBOOK_PREVIEW__"in global.global?global.global.__STORYBOOK_PREVIEW__:void 0)?.storyRenders.find(render=>render.phase==="playing"||render.phase==="rendering");if(storyRenderer){let deprecated=!globalThis?.FEATURES?.disallowImplicitActionsInRenderV8,error=new previewErrors.ImplicitActionsDuringRendering({phase:storyRenderer.phase,name,deprecated});if(deprecated)console.warn(error);else throw error}}let channel=previewApi.addons.getChannel(),id=generateId(),minDepth=5,serializedArgs=args.map(serializeArg),normalizedArgs=args.length>1?serializedArgs:serializedArgs[0],actionDisplayToEmit={id,count:0,data:{name,args:normalizedArgs},options:{...actionOptions,maxDepth:minDepth+(actionOptions.depth||3),allowFunction:actionOptions.allowFunction||!1}};channel.emit(EVENT_ID,actionDisplayToEmit);};return handler.isAction=!0,handler.implicit=options.implicit,handler}var actions=(...args)=>{let options=config,names=args;names.length===1&&Array.isArray(names[0])&&([names]=names),names.length!==1&&typeof names[names.length-1]!="string"&&(options={...config,...names.pop()});let namesObject=names[0];(names.length!==1||typeof namesObject=="string")&&(namesObject={},names.forEach(name=>{namesObject[name]=name;}));let actionsObject={};return Object.keys(namesObject).forEach(name=>{actionsObject[name]=action(namesObject[name],options);}),actionsObject};
+var __defProp=Object.defineProperty;var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0});};var preview_exports={};__export(preview_exports,{argsEnhancers:()=>argsEnhancers,loaders:()=>loaders});var PARAM_KEY="actions",ADDON_ID="storybook/actions",PANEL_ID=`${ADDON_ID}/panel`,EVENT_ID=`${ADDON_ID}/action-event`,CLEAR_ID=`${ADDON_ID}/action-clear`,CYCLIC_KEY="$___storybook.isCyclic";var config={depth:10,clearOnStoryChange:!0,limit:50},configureActions=(options={})=>{Object.assign(config,options);};var findProto=(obj,callback)=>{let proto=Object.getPrototypeOf(obj);return !proto||callback(proto)?proto:findProto(proto,callback)},isReactSyntheticEvent=e=>!!(typeof e=="object"&&e&&findProto(e,proto=>/^Synthetic(?:Base)?Event$/.test(proto.constructor.name))&&typeof e.persist=="function"),serializeArg=a=>{if(isReactSyntheticEvent(a)){let e=Object.create(a.constructor.prototype,Object.getOwnPropertyDescriptors(a));e.persist();let viewDescriptor=Object.getOwnPropertyDescriptor(e,"view"),view=viewDescriptor?.value;return typeof view=="object"&&view?.constructor.name==="Window"&&Object.defineProperty(e,"view",{...viewDescriptor,value:Object.create(view.constructor.prototype)}),e}return a},generateId=()=>typeof crypto=="object"&&typeof crypto.getRandomValues=="function"?uuid.v4():Date.now().toString(36)+Math.random().toString(36).substring(2);function action(name,options={}){let actionOptions={...config,...options},handler=function(...args){if(options.implicit){let storyRenderer=("__STORYBOOK_PREVIEW__"in global.global?global.global.__STORYBOOK_PREVIEW__:void 0)?.storyRenders.find(render=>render.phase==="playing"||render.phase==="rendering");if(storyRenderer){let deprecated=!globalThis?.FEATURES?.disallowImplicitActionsInRenderV8,error=new previewErrors.ImplicitActionsDuringRendering({phase:storyRenderer.phase,name,deprecated});if(deprecated)console.warn(error);else throw error}}let channel=previewApi.addons.getChannel(),id=generateId(),minDepth=5,serializedArgs=args.map(serializeArg),normalizedArgs=args.length>1?serializedArgs:serializedArgs[0],actionDisplayToEmit={id,count:0,data:{name,args:normalizedArgs},options:{...actionOptions,maxDepth:minDepth+(actionOptions.depth||3),allowFunction:actionOptions.allowFunction||!1}};channel.emit(EVENT_ID,actionDisplayToEmit);};return handler.isAction=!0,handler.implicit=options.implicit,handler}var isInInitialArgs=(name,initialArgs)=>typeof initialArgs[name]>"u"&&!(name in initialArgs),inferActionsFromArgTypesRegex=context=>{let{initialArgs,argTypes,id,parameters:{actions:actions2}}=context;if(!actions2||actions2.disable||!actions2.argTypesRegex||!argTypes)return {};let argTypesRegex=new RegExp(actions2.argTypesRegex);return Object.entries(argTypes).filter(([name])=>!!argTypesRegex.test(name)).reduce((acc,[name,argType])=>(isInInitialArgs(name,initialArgs)&&(acc[name]=action(name,{implicit:!0,id})),acc),{})},addActionsFromArgTypes=context=>{let{initialArgs,argTypes,parameters:{actions:actions2}}=context;return actions2?.disable||!argTypes?{}:Object.entries(argTypes).filter(([name,argType])=>!!argType.action).reduce((acc,[name,argType])=>(isInInitialArgs(name,initialArgs)&&(acc[name]=action(typeof argType.action=="string"?argType.action:name)),acc),{})};var argsEnhancers=[addActionsFromArgTypes,inferActionsFromArgTypesRegex];var actions=(...args)=>{let options=config,names=args;names.length===1&&Array.isArray(names[0])&&([names]=names),names.length!==1&&typeof names[names.length-1]!="string"&&(options={...config,...names.pop()});let namesObject=names[0];(names.length!==1||typeof namesObject=="string")&&(namesObject={},names.forEach(name=>{namesObject[name]=name;}));let actionsObject={};return Object.keys(namesObject).forEach(name=>{actionsObject[name]=action(namesObject[name],options);}),actionsObject};var subscribed=!1,logActionsWhenMockCalled=context=>{let{parameters:{actions:actions2}}=context;if(!actions2?.disable&&!subscribed&&"__STORYBOOK_TEST_ON_MOCK_CALL__"in global.global&&typeof global.global.__STORYBOOK_TEST_ON_MOCK_CALL__=="function"){let onMockCall=global.global.__STORYBOOK_TEST_ON_MOCK_CALL__;onMockCall((mock,args)=>{let name=mock.getMockName();name!=="spy"&&(!/^next\/.*::/.test(name)||["next/router::useRouter()","next/navigation::useRouter()","next/navigation::redirect","next/cache::","next/headers::cookies().set","next/headers::cookies().delete","next/headers::headers().set","next/headers::headers().delete"].some(prefix=>name.startsWith(prefix)))&&action(name)(args);}),subscribed=!0;}},loaders=[logActionsWhenMockCalled];var src_default=()=>previewApi.definePreview(preview_exports);
 
@@ -21,1 +23,2 @@ exports.ADDON_ID = ADDON_ID;
 exports.configureActions = configureActions;
+exports.default = src_default;

package.json

 {
   "name": "@storybook/addon-actions",
-  "version": "0.0.0-pr-30197-sha-861625a8",
+  "version": "0.0.0-pr-30197-sha-8babc1dd",
   "description": "Get UI feedback when an action is performed on an interactive element",
@@ -77,3 +77,3 @@ "keywords": [
   "devDependencies": {
-    "@storybook/test": "0.0.0-pr-30197-sha-861625a8",
+    "@storybook/test": "0.0.0-pr-30197-sha-8babc1dd",
     "react": "^18.2.0",
@@ -83,6 +83,6 @@ "react-dom": "^18.2.0",
     "telejson": "^7.2.0",
-    "typescript": "^5.3.2"
+    "typescript": "^5.7.3"
   },
   "peerDependencies": {
-    "storybook": "^0.0.0-pr-30197-sha-861625a8"
+    "storybook": "^0.0.0-pr-30197-sha-8babc1dd"
   },
@@ -89,0 +89,0 @@ "publishConfig": {

New alerts

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Fixed alerts

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

65324

increased by10.39%

Lines of code

370

increased by19.35%

No dependency changes