home/categories/mobile/skyscanner-backpack-claude-skills-backpack-external-component-migration-skill-md
mobiledevelopment

backpack-external-component-migration

Migrate React components from external Skyscanner repositories (e.g., carhire-homepage) into Backpack design system components. Use when: (1) Component exists in app-specific repo with "unstable_backpack" or similar prefix, (2) Component needs to be promoted to official Backpack component, (3) Converting app code to follow Backpack constitution, (4) Extracting reusable UI patterns from product repos. Covers GitHub API access, Backpack naming conventions, modern Sass API, TypeScript patterns, license headers, accessibility testing, and Storybook integration. MANDATORY: Component must pass full test suite (npm run lint && npm run check-react-versions && npm run check-bpk-dependencies && npm run jest) with 0 errors before acceptance.

Skyscanner
maintainer
Skyscanner
Updated 3/4/2026
Stars
535
Forks
207
quick start

Installation and usage

Migrate React components from external Skyscanner repositories (e.g., carhire-homepage) into Backpack design system components. Use when: (1) Component exists in app-specific repo with "unstable_backpack" or similar prefix, (2) Component needs to be promoted to official Backpack component, (3) Converting app code to follow Backpack constitution, (4) Extracting reusable UI patterns from product repos. Covers GitHub API access, Backpack naming conventions, modern Sass API, TypeScript patterns, license headers, accessibility testing, and Storybook integration. MANDATORY: Component must pass full test suite (npm run lint && npm run check-react-versions && npm run check-bpk-dependencies && npm run jest) with 0 errors before acceptance.

Installation
$ install --globalskills.sh
Usage

Once installed, you can use this skill by running the following command in your terminal:

skills use backpack-external-component-migration