Storybook Configuration Generator

Create a configuration utility that generates Storybook configuration files with external references to remote Storybook instances.

Requirements

Your task is to create a Node.js utility that:

1. Accepts a list of remote Storybook instances (name and URL)
2. Generates a properly formatted Storybook main configuration file
3. Configures external references with appropriate settings
4. Validates that remote Storybook URLs are accessible before adding them

The utility should output a configuration object that can be used in a .storybook/main.js or .storybook/main.ts file.

Input Format

The utility should accept an array of reference configurations:

[
  {
    title: "Design System",
    url: "https://design-system.example.com"
  },
  {
    title: "Marketing Components",
    url: "https://marketing.example.com/storybook"
  }
]

Output Format

The utility should generate a configuration object with a refs property containing the external references, where each reference is keyed by a unique identifier derived from the title.

Test Cases

• Given a single remote reference with title "Design System" and URL "https://design-system.example.com", the utility generates a configuration object with refs containing one reference with a valid key @test

• Given two remote references, the utility generates a configuration object with refs containing both references, each with unique keys derived from their titles @test

• Given a remote reference with an expanded configuration including a version property, the utility preserves the version in the generated refs configuration @test

Implementation

@generates

API

/**
 * Generates a unique key for a reference based on its title
 * @param {string} title - The display title of the reference
 * @returns {string} A kebab-case key suitable for use in refs
 */
function generateReferenceKey(title) {
  // IMPLEMENTATION HERE
}

/**
 * Creates a refs configuration object from an array of references
 * @param {Array} references - Array of reference objects with title and url
 * @returns {Object} Refs configuration object keyed by reference identifiers
 */
function createRefsConfig(references) {
  // IMPLEMENTATION HERE
}

/**
 * Generates a complete Storybook main configuration with external references
 * @param {Array} references - Array of reference objects to include
 * @returns {Object} Complete Storybook configuration object with refs
 */
function generateStorybookConfig(references) {
  // IMPLEMENTATION HERE
}

module.exports = {
  generateReferenceKey,
  createRefsConfig,
  generateStorybookConfig
};

Dependencies { .dependencies }

Storybook Core { .dependency }

Provides configuration structure and external reference capabilities for linking to remote Storybook instances.

@satisfied-by