Skip to content

refactor(bpk-component-list): migrate to TypeScript#4196

Merged
Gert-Jan Vercauteren (gert-janvercauteren) merged 6 commits intomainfrom
gert-janvercauteren/js-to-ts-migration
Feb 3, 2026
Merged

refactor(bpk-component-list): migrate to TypeScript#4196
Gert-Jan Vercauteren (gert-janvercauteren) merged 6 commits intomainfrom
gert-janvercauteren/js-to-ts-migration

Conversation

@gert-janvercauteren
Copy link
Copy Markdown
Contributor

Summary

  • Migrate bpk-component-list package from JavaScript/Flow to TypeScript
  • Convert BpkList and BpkListItem components to TypeScript
  • Migrate all test files to TypeScript
  • Export Props types for consumers (BpkListProps, BpkListItemProps)

Changes

File Change
index.jsindex.ts Add type exports
BpkList.jsBpkList.tsx TypeScript conversion
BpkListItem.jsBpkListItem.tsx TypeScript conversion
Test files Renamed to .tsx, removed Flow annotations

Test plan

  • All existing tests pass (npm run jest -- packages/bpk-component-list)
  • 100% code coverage maintained
  • TypeScript compilation succeeds
  • Linting passes

🤖 Generated with Claude Code

- Convert BpkList.js to BpkList.tsx
- Replace Flow types with TypeScript types
- Remove PropTypes in favor of TypeScript Props type
- Export Props type for consumers

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Convert BpkListItem.js to BpkListItem.tsx
- Replace Flow types with TypeScript types
- Remove PropTypes in favor of TypeScript Props type
- Export Props type for consumers

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Convert test files from .js to .tsx
- Remove Flow type annotations
- Update snapshot file names

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Convert index.js to index.ts
- Add type exports for BpkListProps and BpkListItemProps

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Copilot AI review requested due to automatic review settings February 1, 2026 03:21
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR migrates the bpk-component-list package from JavaScript/Flow to TypeScript, modernizing the type system while maintaining functionality and test coverage.

Changes:

  • Converted component files from Flow to TypeScript with proper type definitions
  • Exported component Props types for consumer usage
  • Removed Flow annotations from all test files

Reviewed changes

Copilot reviewed 6 out of 8 changed files in this pull request and generated 2 comments.

Show a summary per file
File Description
index.ts Added TypeScript type exports for BpkListProps and BpkListItemProps
BpkList.tsx Converted from Flow to TypeScript, removed PropTypes, improved variable naming
BpkListItem.tsx Converted from Flow to TypeScript, removed PropTypes validation
BpkList-test.tsx Removed Flow annotation
BpkListItem-test.tsx Removed Flow annotation
accessibility-test.tsx Removed Flow annotation

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread packages/bpk-component-list/src/BpkList.tsx
Comment thread packages/bpk-component-list/src/BpkList.tsx Outdated
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
@skyscanner-backpack-bot
Copy link
Copy Markdown

Visit https://backpack.github.io/storybook-prs/4196 to see this build running in a browser.

- Make ordered prop optional (has default value)
- Change ariaLabel, ariaLabelledby, title to string | undefined
  (compatible with HTML attribute types)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
@skyscanner-backpack-bot
Copy link
Copy Markdown

Visit https://backpack.github.io/storybook-prs/4196 to see this build running in a browser.

@skyscanner-backpack-bot
Copy link
Copy Markdown

Browser support

If this is a visual change, make sure you've tested it in multiple browsers.

Generated by 🚫 dangerJS against c0848cd

import BpkList from './src/BpkList';
import BpkListItem from './src/BpkListItem';

export type { Props as BpkListProps } from './src/BpkList';
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe there could be export type BpkListProps directly if the name Props is changed to BpkListProps in BpkList.tsx, but it's not an issue

@gert-janvercauteren Gert-Jan Vercauteren (gert-janvercauteren) merged commit 7daec19 into main Feb 3, 2026
13 checks passed
@gert-janvercauteren Gert-Jan Vercauteren (gert-janvercauteren) deleted the gert-janvercauteren/js-to-ts-migration branch February 3, 2026 03:43
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants