upgrading-react-native-storybook
React Native Storybook Upgrades
Upgrade one supported version step at a time. Do not jump from an older major directly to the latest release in a single pass.
Rules
- Detect the project's package manager first and use it consistently.
- Detect the currently installed Storybook version from
package.json, lockfiles, and config files before editing anything. - Apply exactly one migration step per run. If a project is multiple versions behind, complete the next hop, verify it, and then report the next required hop.
- During the
6.5.x -> 7.6.xstep, convert any remainingstoriesOfstories to CSF instead of preserving compatibility mode. - Preserve the project's existing app structure. Only make the migration changes required for the current step.
Version Detection
Look at these signals together:
More from storybookjs/react-native
writing-react-native-storybook-stories
Create and edit React Native Storybook stories using Component Story Format (CSF). Use when writing .stories.tsx files, adding stories to React Native components, configuring Storybook addons (controls, actions, backgrounds, notes), setting up argTypes, decorators, parameters, or working with portable stories for testing. Applies to any task involving @storybook/react-native story authoring.
307setup-react-native-storybook
Set up Storybook for React Native in Expo, React Native CLI, or Re.Pack projects. Use when adding Storybook to a project, configuring metro.config.js with withStorybook, creating .rnstorybook configuration files, setting up Storybook routes in Expo Router, configuring getStorybookUI, or adding the StorybookPlugin to a Re.Pack rspack/webpack config. Covers Expo, Expo Router, plain React Native CLI, and Re.Pack setups.
237react-native-best-practices
Provides React Native performance optimization guidelines for FPS, TTI, bundle size, memory leaks, re-renders, and animations. Applies to tasks involving Hermes optimization, JS thread blocking, bridge overhead, FlashList, native modules, or debugging jank and frame drops.
21setup
Sets up a Mac for ButterCut. Installs all required dependencies (Homebrew, Ruby, Python, FFmpeg, WhisperX). Use when user says "install buttercut", "set up my mac", "get started", "first time setup", "install dependencies" or "check my installation".
1