Storybook Addon Links

import { linkTo, hrefTo, withLinks, navigate } from "@storybook/addon-links";

// Constants are also available (commonly used for Storybook addons)
import EVENTS, { ADDON_ID, PARAM_KEY } from "@storybook/addon-links";

const { linkTo, hrefTo, withLinks, navigate, ADDON_ID, PARAM_KEY } = require("@storybook/addon-links");
const EVENTS = require("@storybook/addon-links").default;

import LinkTo from "@storybook/addon-links/react";

import { linkTo, hrefTo, withLinks } from "@storybook/addon-links";

// Create event handler for button click
const handleClick = linkTo("Example", "Button");

// Get URL for a specific story
const storyUrl = await hrefTo("Example", "Button");

// Use decorator for automatic link handling
export const decorators = [withLinks];

/**
 * Creates event handler for programmatic story navigation
 * @param idOrTitle - Story ID or title, can be static string or dynamic function
 * @param nameInput - Story name, can be static string or dynamic function  
 * @returns Event handler function that navigates to the specified story
 */
function linkTo(
  idOrTitle: string | ((...args: any[]) => string),
  nameInput?: string | ((...args: any[]) => string)
): (...args: any[]) => void;

/**
 * Direct story navigation via channel events
 * @param params - Navigation parameters with story ID or kind/story combination
 */
function navigate(params: ParamsId | ParamsCombo): void;

interface ParamsId {
  storyId: StoryId;
}

interface ParamsCombo {
  kind?: StoryKind;
  title?: ComponentTitle;
  story?: StoryName;
  name?: StoryName;
}

/**
 * Generates URL for specific story
 * @param title - Story component title
 * @param name - Story name
 * @returns Promise resolving to story URL
 */
function hrefTo(title: ComponentTitle, name: StoryName): Promise<string>;

/**
 * Decorator that adds click listener for declarative link handling
 * Automatically handles elements with data-sb-kind and data-sb-story attributes
 */
const withLinks: StoryDecorator;

<!-- Navigate to specific story -->
<button data-sb-kind="Example" data-sb-story="Button">
  Go to Button story
</button>

<!-- Navigate to story kind (first story) -->
<a data-sb-kind="Components/Form">View Form Examples</a>

interface Props {
  kind?: StoryKind;
  title?: ComponentTitle; 
  story?: StoryName;
  name?: StoryName;
  children: ReactNode;
}

interface State {
  href: string;
}

class LinkTo extends React.PureComponent<Props, State>;

type ComponentTitle = string;
type StoryId = string;
type StoryKind = string;
type StoryName = string;
type ReactNode = React.ReactNode;

interface ParamsId {
  storyId: StoryId;
}

interface ParamsCombo {
  kind?: StoryKind;
  title?: ComponentTitle;
  story?: StoryName;
  name?: StoryName;
}

// Note: React types need to be imported from React
// import type { ReactNode } from 'react';
type ReactNode = React.ReactNode;

/**
 * Addon identifier constant
 */
const ADDON_ID: string;

/**
 * Parameter key for addon configuration
 */
const PARAM_KEY: string;

/**
 * Event names object for addon communication
 * Default export containing NAVIGATE, REQUEST, and RECEIVE event names
 */
interface EventsObject {
  NAVIGATE: string;
  REQUEST: string;
  RECEIVE: string;
}

const EVENTS: EventsObject;