Uh oh!
There was an error while loading. Please reload this page.
refactor: modernize typescript setup - #4999
Merged
Merged
Conversation
There was a problem hiding this comment.
Pull request overview
This PR modernizes the repository’s TypeScript/Jest setup (bundler-style module resolution, React 17+ JSX transform, verbatim type-only imports) and updates assorted dependencies/config to support source-based resolution in the monorepo example/docs.
Changes:
- Update TypeScript compiler settings (e.g.,
moduleResolution: "bundler",jsx: "react-jsx",verbatimModuleSyntax) and align code with type-only imports. - Migrate Jest tests to import APIs from
@jest/globalsinstead of relying on global types. - Update monorepo/example configuration and tooling dependencies (e.g.,
react-native-builder-bob, Metro config conditions).
Reviewed changes
Copilot reviewed 197 out of 200 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| yarn.lock | Lockfile updates for dependency/tooling changes (e.g., bob/typescript transitive updates). |
| tsconfig.json | Switch to modern TS settings (react-jsx, bundler resolution, verbatim module syntax, etc.). |
| package.json | Rename source entry field, add @jest/globals, bump react-native-builder-bob. |
| .eslintrc | Disable React-in-JSX-scope lint rules for the new JSX transform. |
| jest/jest-native.d.ts | Add TS matcher augmentation for @testing-library/jest-native. |
| src/utils/useIsKeyboardShown.tsx | Convert value imports to type-only where applicable. |
| src/utils/forwardRef.tsx | Remove custom forwardRef helper (previously used to avoid large prop unions). |
| src/utils/tests/splitStyles.test.ts | Use @jest/globals imports; align with new TS types setup. |
| src/utils/tests/hasTouchHandler.test.ts | Use @jest/globals imports; align with new TS types setup. |
| src/theme/provider.tsx | Convert $DeepPartial to type-only import. |
| src/theme/tests/provider.test.ts | Use @jest/globals imports. |
| src/core/useSystemColorScheme.ts | Convert ColorSchemeName to type-only import. |
| src/core/settings.tsx | Convert IconProps to type-only import. |
| src/core/SafeAreaProviderCompat.tsx | Convert RN types to type-only imports. |
| src/core/PaperProvider.tsx | Convert Settings to type-only import. |
| src/core/tests/theming.test.tsx | Use @jest/globals imports. |
| src/core/tests/PaperProvider.test.tsx | Use @jest/globals imports and improve typed mocks. |
| src/components/Typography/Text.tsx | Type-only imports + ref handling refactor (now modeled as a prop). |
| src/components/Typography/AnimatedText.tsx | Type-only imports + ref handling refactor (now modeled as a prop). |
| src/components/TouchableRipple/TouchableRipple.tsx | Type-only imports + ref handling refactor (now modeled as a prop). |
| src/components/TouchableRipple/TouchableRipple.native.tsx | Type-only imports + ref handling refactor (now modeled as a prop). |
| src/components/Tooltip/utils.ts | Convert RN types to type-only imports. |
| src/components/Tooltip/Tooltip.tsx | Convert local/RN types to type-only imports. |
| src/components/ToggleButton/ToggleButtonRow.tsx | Convert RN types to type-only imports. |
| src/components/ToggleButton/ToggleButton.tsx | Convert RN types to type-only imports + ref handling refactor (now modeled as a prop). |
| src/components/TextInput/utils.ts | Convert RN/Reanimated types to type-only imports. |
| src/components/TextInput/TextInputIcon.tsx | Convert RN types to type-only imports. |
| src/components/TextInput/TextInputErrorIcon.tsx | Convert RN types to type-only imports; remove unused React import. |
| src/components/TextInput/TextInput.tsx | Convert RN/Reanimated types to type-only imports; adjust render-props typing for ref. |
| src/components/TextInput/hooks.ts | Convert RN event types to type-only imports. |
| src/components/Surface.tsx | Convert RN types to type-only imports + ref handling refactor (now modeled as a prop). |
| src/components/Snackbar.tsx | Convert RN types to type-only imports. |
| src/components/SegmentedButtons/utils.ts | Convert RN types to type-only imports. |
| src/components/SegmentedButtons/SegmentedButtons.tsx | Remove unnecessary React import (new JSX transform); type-only imports. |
| src/components/SegmentedButtons/SegmentedButtonItem.tsx | Convert TouchableRipple props to type-only import. |
| src/components/Searchbar.tsx | Convert RN types to type-only imports + ref handling refactor (now modeled as a prop). |
| src/components/RadioButton/RadioButtonItem.tsx | Convert RN/local types to type-only imports. |
| src/components/RadioButton/RadioButtonIOS.tsx | Convert RN/local types to type-only imports; remove unused React import. |
| src/components/RadioButton/RadioButtonAndroid.tsx | Convert local types to type-only imports. |
| src/components/RadioButton/RadioButton.tsx | Convert RN types to type-only imports; remove unused React import. |
| src/components/ProgressBar.tsx | Convert RN types to type-only imports; use ViewProps for props typing. |
| src/components/Portal/Portal.tsx | Convert PortalMethods to type-only import. |
| src/components/Modal.tsx | Convert RN types to type-only imports. |
| src/components/Menu/MenuItem.tsx | Convert Icon/IconSource and TouchableRipple props to type-only imports. |
| src/components/Menu/Menu.tsx | Convert RN types to type-only imports. |
| src/components/MaterialCommunityIcon.tsx | Convert RN types to type-only imports. |
| src/components/List/utils.ts | Convert RN types to type-only imports. |
| src/components/List/ListSubheader.tsx | Convert RN types to type-only imports. |
| src/components/List/ListSection.tsx | Convert RN types to type-only imports; use ViewProps for props typing. |
| src/components/List/ListItem.tsx | Convert utils Style to type-only import + ref handling refactor (now modeled as a prop). |
| src/components/List/ListImage.tsx | Convert RN types to type-only imports; remove unused React import. |
| src/components/List/ListIcon.tsx | Convert RN/IconSource types to type-only imports; remove unused React import. |
| src/components/List/ListAccordion.tsx | Convert TouchableRipple props to type-only import. |
| src/components/IconButton/IconButton.tsx | Convert RN/IconSource types to type-only imports + ref handling refactor (now modeled as a prop). |
| src/components/Icon.tsx | Split RN value/type imports to satisfy verbatim module syntax. |
| src/components/FAB/utils.ts | Convert RN/token types to type-only imports. |
| src/components/FAB/Shell.tsx | Convert Reanimated/token types to type-only imports + ref handling refactor (now modeled as a prop). |
| src/components/FAB/Menu.tsx | Convert RN/token/icon types to type-only imports. |
| src/components/FAB/FAB.tsx | Convert token types to type-only imports + ref handling refactor (now modeled as a prop). |
| src/components/FAB/Extended.tsx | Convert token types to type-only imports + ref handling refactor (now modeled as a prop). |
| src/components/FAB/Content.tsx | Convert RN/Reanimated/IconSource types to type-only imports. |
| src/components/Drawer/DrawerSection.tsx | Convert RN types to type-only imports; use ViewProps for props typing. |
| src/components/Drawer/DrawerItem.tsx | Convert RN/IconSource/TouchableRipple props types to type-only imports; use ViewProps. |
| src/components/Drawer/DrawerCollapsedItem.tsx | Convert RN/IconSource types to type-only imports; use ViewProps. |
| src/components/Divider.tsx | Convert RN types to type-only imports; remove unused React import. |
| src/components/Dialog/utils.ts | Convert RN types to type-only imports. |
| src/components/Dialog/DialogTitle.tsx | Convert RN types to type-only imports. |
| src/components/Dialog/DialogScrollArea.tsx | Convert RN types to type-only imports; use ViewProps. |
| src/components/Dialog/DialogIcon.tsx | Convert RN/IconSource types to type-only imports; remove unused React import. |
| src/components/Dialog/DialogContent.tsx | Convert RN types to type-only imports; use ViewProps. |
| src/components/Dialog/DialogActions.tsx | Convert RN and local types to type-only imports; use ViewProps. |
| src/components/Dialog/Dialog.tsx | Convert RN and local types to type-only imports. |
| src/components/DataTable/DataTableTitle.tsx | Convert RN types to type-only imports; use PressableProps for props typing. |
| src/components/DataTable/DataTableRow.tsx | Convert RN types to type-only imports. |
| src/components/DataTable/DataTablePagination.tsx | Convert RN types to type-only imports; use ViewProps. |
| src/components/DataTable/DataTableHeader.tsx | Convert RN types to type-only imports; use ViewProps. |
| src/components/DataTable/DataTableCell.tsx | Convert RN types to type-only imports. |
| src/components/DataTable/DataTable.tsx | Convert RN types to type-only imports; use ViewProps. |
| src/components/CrossFadeIcon.tsx | Convert ColorValue/IconSource to type-only imports. |
| src/components/Chip/Chip.tsx | Convert helper types and TouchableRipple props to type-only imports. |
| src/components/Checkbox/CheckboxItem.tsx | Convert TouchableRipple props to type-only import; remove unused React import. |
| src/components/Card/CardTitle.tsx | Convert RN types to type-only imports; use ViewProps. |
| src/components/Card/CardCover.tsx | Convert RN types to type-only imports; use ImageProps. |
| src/components/Card/CardContent.tsx | Convert RN types to type-only imports; use ViewProps. |
| src/components/Card/CardActions.tsx | Convert RN and local types to type-only imports; use ViewProps. |
| src/components/Card/Card.tsx | Convert RN types to type-only imports; ref handling refactor (now modeled as a prop). |
| src/components/Button/Button.tsx | Convert RN/IconSource/TouchableRipple props to type-only imports; ref handling refactor (now modeled as a prop). |
| src/components/BottomNavigation/BottomNavigationRouteScreen.tsx | Convert ReactNode/ViewProps to type-only imports; remove unused ReactNode value import. |
| src/components/BottomNavigation/BottomNavigationBar.tsx | Convert IconSource/TouchableRippleProps to type-only imports. |
| src/components/BottomNavigation/BottomNavigation.tsx | Convert TouchableRippleProps to type-only import. |
| src/components/Banner.tsx | Convert IconSource to type-only import; adjust RN type-only imports. |
| src/components/Badge.tsx | Convert RN types to type-only imports. |
| src/components/Avatar/AvatarText.tsx | Convert RN types to type-only imports; use ViewProps. |
| src/components/Avatar/AvatarImage.tsx | Convert RN types to type-only imports; use ViewProps. |
| src/components/Avatar/AvatarIcon.tsx | Convert IconSource to type-only import; use ViewProps. |
| src/components/Appbar/AppbarHeader.tsx | Convert RN types to type-only imports. |
| src/components/Appbar/AppbarContent.tsx | Convert TextRef to type-only import; adjust RN imports. |
| src/components/Appbar/AppbarBackIcon.tsx | Convert ColorValue to type-only import. |
| src/components/Appbar/AppbarBackAction.tsx | Remove forwardRef wrapper; ref handling refactor (now modeled as a prop). |
| src/components/Appbar/AppbarAction.tsx | Remove forwardRef wrapper; ref handling refactor (now modeled as a prop). |
| src/components/Appbar/Appbar.tsx | Convert RN and local util types to type-only imports; use ViewProps. |
| src/components/ActivityIndicator.tsx | Convert RN types to type-only imports; use ViewProps. |
| src/components/tests/Typography/Text.test.tsx | Use @jest/globals imports. |
| src/components/tests/TouchableRipple.test.tsx | Use @jest/globals imports; improve jest.fn typing. |
| src/components/tests/Tooltip.test.tsx | Use @jest/globals imports; ref typing adjustments in dummy component. |
| src/components/tests/ToggleButton.test.tsx | Use @jest/globals imports. |
| src/components/tests/TextInput.test.tsx | Use @jest/globals imports; improve handler typing. |
| src/components/tests/Switch.test.tsx | Use @jest/globals imports. |
| src/components/tests/Surface.test.tsx | Use @jest/globals imports; replace template tables with typed arrays. |
| src/components/tests/Snackbar.test.tsx | Use @jest/globals imports. |
| src/components/tests/SegmentedButton.test.tsx | Use @jest/globals imports; replace template tables with typed arrays/generics. |
| src/components/tests/Searchbar.test.tsx | Use @jest/globals imports. |
| src/components/tests/RadioButton/utils.test.tsx | Use @jest/globals imports. |
| src/components/tests/RadioButton/RadioButtonItem.test.tsx | Use @jest/globals imports. |
| src/components/tests/RadioButton/RadioButtonGroup.test.tsx | Use @jest/globals imports. |
| src/components/tests/RadioButton/RadioButton.test.tsx | Use @jest/globals imports; adjust mocking to typed requireActual. |
| src/components/tests/ProgressBar.test.tsx | Use @jest/globals imports; convert Props to type-only import. |
| src/components/tests/Portal.test.tsx | Use @jest/globals imports. |
| src/components/tests/Modal.test.tsx | Use @jest/globals imports; convert RN types to type-only imports. |
| src/components/tests/MenuItem.test.tsx | Use @jest/globals imports. |
| src/components/tests/Menu.test.tsx | Use @jest/globals imports; convert Elevation to type-only import. |
| src/components/tests/ListUtils.test.tsx | Use @jest/globals imports. |
| src/components/tests/ListSection.test.tsx | Use @jest/globals imports. |
| src/components/tests/ListItem.test.tsx | Use @jest/globals imports; improve handler typing. |
| src/components/tests/ListImage.test.tsx | Use @jest/globals imports. |
| src/components/tests/ListAccordion.test.tsx | Use @jest/globals imports. |
| src/components/tests/IconButton.test.tsx | Use @jest/globals imports. |
| src/components/tests/Icon.test.tsx | Use @jest/globals imports. |
| src/components/tests/FABUtils.test.tsx | Use @jest/globals imports. |
| src/components/tests/FABMenu.test.tsx | Use @jest/globals imports; improve mock typing. |
| src/components/tests/FABExtended.test.tsx | Use @jest/globals imports. |
| src/components/tests/FAB.test.tsx | Use @jest/globals imports. |
| src/components/tests/DrawerItem.test.tsx | Use @jest/globals imports. |
| src/components/tests/Drawer/DrawerSection.test.tsx | Use @jest/globals imports. |
| src/components/tests/Drawer/DrawerCollapsedItem.test.tsx | Use @jest/globals imports. |
| src/components/tests/Dialog.test.tsx | Use @jest/globals imports; convert RN types to type-only imports. |
| src/components/tests/DataTable.test.tsx | Use @jest/globals imports. |
| src/components/tests/Chip.test.tsx | Use @jest/globals imports. |
| src/components/tests/Checkbox/utils.test.tsx | Use @jest/globals imports. |
| src/components/tests/Checkbox/CheckboxItem.test.tsx | Use @jest/globals imports. |
| src/components/tests/Checkbox/Checkbox.test.tsx | Use @jest/globals imports. |
| src/components/tests/Card/Card.test.tsx | Use @jest/globals imports. |
| src/components/tests/Button.test.tsx | Use @jest/globals imports. |
| src/components/tests/BottomNavigation.test.tsx | Use @jest/globals imports; replace template tables with arrays. |
| src/components/tests/Banner.test.tsx | Use @jest/globals imports. |
| src/components/tests/Badge.test.tsx | Use @jest/globals imports. |
| src/components/tests/Avatar.test.tsx | Use @jest/globals imports. |
| src/components/tests/Appbar/Appbar.test.tsx | Use @jest/globals imports. |
| src/components/tests/ActivityIndicator.test.tsx | Use @jest/globals imports. |
| example/package.json | Bump monorepo tool deps (react-native-builder-bob, react-native-monorepo-config). |
| example/metro.config.js | Add Metro resolver conditions for source-resolution mode. |
| example/utils/themes.ts | Convert Theme imports to type-only. |
| example/utils/index.ts | Convert Theme import to type-only. |
| example/src/ScreenWrapper.tsx | Convert RN types to type-only imports. |
| example/src/RootNavigator.tsx | Remove unused React import (new JSX transform). |
| example/src/Examples/TouchableRippleExample.tsx | Remove unused React import (new JSX transform). |
| example/src/Examples/ToggleButtonExample.tsx | Replace enum with as const object + derived union type. |
| example/src/Examples/ThemingWithReactNavigation.tsx | Remove unused React import (new JSX transform). |
| example/src/Examples/ThemeExample.tsx | Remove unused React import (new JSX transform). |
| example/src/Examples/TextExample.tsx | Remove unused React import (new JSX transform). |
| example/src/Examples/TeamsList.tsx | Remove unused React import (new JSX transform). |
| example/src/Examples/SurfaceExample.tsx | Convert Elevation import to type-only. |
| example/src/Examples/SegmentedButtonsExample.tsx | Remove unused React import (new JSX transform). |
| example/src/Examples/ProgressBarExample.tsx | Convert ProgressBarProps import to type-only. |
| example/src/Examples/MenuExample.tsx | Convert GestureResponderEvent to type-only import. |
| example/src/Examples/ListSectionExample.tsx | Remove unused React import (new JSX transform). |
| example/src/Examples/ListItemExample.tsx | Remove unused React import (new JSX transform). |
| example/src/Examples/IconExample.tsx | Remove unused React import (new JSX transform). |
| example/src/Examples/IconButtonExample.tsx | Remove unused React import (new JSX transform). |
| example/src/Examples/FABExample.tsx | Convert FAB type exports to type-only imports; convert RN event types to type-only. |
| example/src/Examples/DividerExample.tsx | Remove unused React import (new JSX transform). |
| example/src/Examples/Dialogs/UndismissableDialog.tsx | Remove unused React import (new JSX transform). |
| example/src/Examples/Dialogs/DialogWithLongText.tsx | Remove unused React import (new JSX transform). |
| example/src/Examples/Dialogs/DialogWithLoadingIndicator.tsx | Remove unused React import (new JSX transform). |
| example/src/Examples/Dialogs/DialogWithIcon.tsx | Remove unused React import (new JSX transform). |
| example/src/Examples/Dialogs/DialogWithDismissableBackButton.tsx | Remove unused React import (new JSX transform). |
| example/src/Examples/Dialogs/DialogWithCustomColors.tsx | Remove unused React import (new JSX transform). |
| example/src/Examples/ButtonExample.tsx | Remove unused React import (new JSX transform). |
| example/src/Examples/BottomNavigationExample.tsx | Convert BottomNavigationRoute to type-only import. |
| example/src/Examples/BannerExample.tsx | Convert LayoutChangeEvent to type-only import. |
| example/src/Examples/AvatarExample.tsx | Remove unused React import (new JSX transform). |
| example/src/ExampleList.tsx | Remove unused React import (new JSX transform). |
| example/src/DrawerItems.tsx | Convert ColorValue to type-only import. |
| docs/package.json | Add @jest/globals to docs devDependencies. |
| docs/src/utils/tests/themeColors.test.tsx | Use @jest/globals imports. |
| docs/src/components/ThemeIcon.tsx | Remove unused React import (new JSX transform). |
| docs/src/components/ThemeColorsTable.tsx | Convert ReactNode/DataObject to type-only imports. |
| docs/src/components/Switch.tsx | Remove unused React import (new JSX transform). |
| docs/src/components/Showcase.tsx | Remove unused React import (new JSX transform). |
| docs/src/components/ScreenshotTabs.tsx | Convert ReactNode to type-only import. |
| docs/src/components/PropTable.tsx | Remove unused React import (new JSX transform). |
| docs/src/components/Markdown.tsx | Remove unused React import (new JSX transform). |
| docs/src/components/IconsList.tsx | Drop default React import; keep hook import only. |
| docs/src/components/GooglePlayIcon.tsx | Remove unused React import (new JSX transform). |
| docs/src/components/GithubIcon.tsx | Remove unused React import (new JSX transform). |
| docs/src/components/GetStartedButtons.tsx | Remove unused React import (new JSX transform). |
| docs/src/components/ExtendsLink.tsx | Remove unused React import (new JSX transform). |
| docs/src/components/ExtendedExample.tsx | Remove unused React import (new JSX transform). |
| docs/src/components/DynamicColorTheme.tsx | Convert ReactNode to type-only import. |
| docs/src/components/AppStoreIcon.tsx | Remove unused React import (new JSX transform). |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Uh oh!
There was an error while loading. Please reload this page.
Uh oh!
There was an error while loading. Please reload this page.
Uh oh!
There was an error while loading. Please reload this page.
Uh oh!
There was an error while loading. Please reload this page.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for freeto join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
No description provided.