Actions Creation

/**
 * Create multiple action handlers from string names
 * @param handlers - Variable number of action names
 * @returns Object mapping each name to its handler function
 */
function actions<T extends string>(...handlers: T[]): ActionsMap<T>;

/**
 * Create multiple action handlers from a configuration object
 * @param handlerMap - Object mapping action names to display names
 * @param options - Optional configuration for all actions
 * @returns Object mapping each name to its handler function
 */
function actions<T extends string>(
  handlerMap: Record<T, string>, 
  options?: ActionOptions
): ActionsMap<T>;

/**
 * Overloaded signatures for specific numbers of handlers (1-10)
 * Provides better type safety for common use cases
 */
function actions<T extends string>(handler1: T, options?: ActionOptions): ActionsMap<T>;
function actions<T extends string>(handler1: T, handler2: T, options?: ActionOptions): ActionsMap<T>;
// ... up to 10 handlers

type ActionsMap<T extends string = string> = Record<T, HandlerFunction>;
type HandlerFunction = (...args: any[]) => void;

import { actions } from "@storybook/addon-actions";

// Create from string list
const handlers = actions('onClick', 'onFocus', 'onBlur', 'onSubmit');

// Create from object with custom display names
const formHandlers = actions({
  onSubmit: 'form-submission',
  onReset: 'form-reset', 
  onValidate: 'form-validation'
});

// Create with global options
const debugHandlers = actions('onMount', 'onUpdate', 'onUnmount', {
  depth: 5,
  limit: 200
});

// Use in story
export const FormStory = {
  args: {
    onClick: handlers.onClick,
    onFocus: handlers.onFocus,
    onSubmit: formHandlers.onSubmit,
  },
};

/**
 * Create actions from individual string arguments
 * Each string becomes both the property name and display name
 * @param handlers - Action names as separate arguments
 * @returns ActionsMap with each name mapped to its handler
 */
function actions<T extends string>(...handlers: T[]): ActionsMap<T>;

// Simple usage
const { onClick, onHover, onFocus } = actions('onClick', 'onHover', 'onFocus');

// Equivalent to:
// {
//   onClick: action('onClick'),
//   onHover: action('onHover'), 
//   onFocus: action('onFocus')
// }

// Array destructuring
const [click, hover, focus] = Object.values(
  actions('onClick', 'onHover', 'onFocus')
);

/**
 * Create actions from object mapping
 * @param handlerMap - Object with property names as keys, display names as values
 * @param options - Optional configuration applied to all actions
 * @returns ActionsMap with property names mapped to handlers
 */
function actions<T extends string>(
  handlerMap: Record<T, string>, 
  options?: ActionOptions
): ActionsMap<T>;

// Custom display names
const handlers = actions({
  onClick: 'user-clicked-button',
  onSubmit: 'user-submitted-form',
  onCancel: 'user-cancelled-action'
});

// With options
const debugHandlers = actions({
  onMount: 'component-mounted',
  onUpdate: 'component-updated'
}, {
  depth: 8,
  clearOnStoryChange: false
});

/**
 * Create actions from array of names
 * @param names - Array containing action names
 * @returns ActionsMap with each name mapped to its handler
 */
function actions<T extends string>(names: T[]): ActionsMap<T>;

// Array syntax
const eventNames = ['onClick', 'onFocus', 'onBlur'] as const;
const handlers = actions(eventNames);

// Dynamic action creation
const createHandlers = (events: string[]) => actions(events);

// Type-safe property access
const handlers = actions('onClick', 'onSubmit', 'onCancel');
// handlers.onClick - ✓ exists
// handlers.onMissing - ✗ TypeScript error

// Preserves string literal types
const specificHandlers = actions('buttonClick' as const, 'formSubmit' as const);
type HandlerKeys = keyof typeof specificHandlers; // 'buttonClick' | 'formSubmit'

// Efficient: Create once, reuse
const FORM_ACTIONS = actions('onSubmit', 'onReset', 'onValidate');

export const FormStory = {
  args: FORM_ACTIONS
};

// Less efficient: Creating on every render
export const BadFormStory = {
  args: actions('onSubmit', 'onReset', 'onValidate') // Creates new functions each time
};