skills.rest
j-mckerracher
j-mckerracherCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

storybook

Navigate between React Storybook stories using addon-links APIs.

Updated Aug 27, 2026
Search Tags:#react#navigation#storybook#addon-links#linkTo#hrefTo#withLinks
One-click install
npx skills add https://github.com/j-mckerracher/agent-research --skill storybook-j-mckerracher
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: storybook
Source: https://github.com/j-mckerracher/agent-research/tree/main/dated-agents/4-6-2026/.claude/skills/storybook-link
Command: npx skills add https://github.com/j-mckerracher/agent-research --skill storybook-j-mckerracher

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Storybook navigation between stories can be clunky without a unified API. This skill provides quick, reliable navigation between Storybook stories by leveraging the official addon-links APIs to move between stories without full page reloads.

Core Features & Use Cases

  • Declarative story linkage using linkTo, hrefTo, withLinks, and LinkTo.
  • Seamless cross-story navigation in React Storybook environments.
  • Use cases include creating interactive demos and cross-story navigation flows.

Quick Start

Install the addon and wire up linkTo in your story files to enable cross-story navigation.

Frequently Asked Questions about storybook

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I navigate between Storybook stories in React without a full page reload?▼

Use the Storybook addon-links APIs like linkTo, hrefTo, and withLinks to navigate between stories without page reloads. This approach provides declarative cross-story navigation directly within your React Storybook environment.

What is the difference between linkTo and hrefTo in Storybook addon-links?▼

linkTo programmatically triggers navigation to a target story, often used in event handlers, while hrefTo generates a URL hyperlink for declarative navigation. Both are part of the @storybook/addon-links API for connecting stories.

How do I set up cross-story navigation links in a Storybook story file?▼

Set up cross-story navigation by installing @storybook/addon-links and wiring up the linkTo function or LinkTo component in your story files. This enables declarative story linkage for interactive demos and navigation flows.

Can I use Storybook addon-links with non-React components?▼

Storybook addon-links is applied in React Storybook workflows and depends on React-based stories. It is designed to work with standard Storybook configuration using declarative data attributes within a React environment.

What is the best way to create interactive Storybook demos that connect multiple stories?▼

The best way to create interactive Storybook demos is by using the withLinks decorator or LinkTo component from addon-links. This enables seamless cross-story navigation flows, allowing users to move between connected stories declaratively.

Related Skills

Explore More Software Engineering Skills→
j-mckerracherj-mckerracher

storybook-link

Generate internal story links and URLs for Storybook navigation.

Community
Basic
soham2008xyzsoham2008xyz

writing-react-native-storybook-stories

Write React Native Storybook stories using CSF with Meta and StoryObj.

Community
Intermediate
david-nossebrodavid-nossebro

storybook-expert

Fix fragile Storybook stories and tests to match the repo's setup.

Community
Advanced
TheBushidoCollectiveTheBushidoCollective
187

storybook-configuration

Configure Storybook main and preview files with addons and framework-specific builders.

Official
Intermediate