
Security News
MCP Community Begins Work on Official MCP Metaregistry
The MCP community is launching an official registry to standardize AI tool discovery and let agents dynamically find and install MCP servers.
react-native-codegen
Advanced tools
The react-native-codegen package is a tool used in the React Native ecosystem to generate native code for JavaScript components and modules. It helps in creating type-safe interfaces between JavaScript and native code, ensuring that the data passed between them is correctly typed and validated.
Generating Native Modules
This feature allows you to define a native module in a JSON format, which react-native-codegen will then use to generate the corresponding native code. This ensures type safety and consistency between JavaScript and native code.
```json
{
"name": "MyModule",
"type": "module",
"methods": {
"myMethod": {
"type": "function",
"params": [
{ "name": "param1", "type": "string" },
{ "name": "param2", "type": "number" }
],
"returnType": "void"
}
}
}
```
Generating Native Components
This feature allows you to define a native component in a JSON format, which react-native-codegen will then use to generate the corresponding native code. This ensures that the component's props are correctly typed and validated.
```json
{
"name": "MyComponent",
"type": "component",
"props": {
"title": { "type": "string" },
"count": { "type": "number" }
}
}
```
Generating Event Emitters
This feature allows you to define an event emitter in a JSON format, which react-native-codegen will then use to generate the corresponding native code. This ensures that the events and their data are correctly typed and validated.
```json
{
"name": "MyEventEmitter",
"type": "eventEmitter",
"events": {
"onEvent": {
"type": "function",
"params": [
{ "name": "eventData", "type": "object" }
]
}
}
}
```
The react-native-create-library package is used to create a new native module library for React Native. It provides a boilerplate for creating native modules but does not offer the same level of type safety and code generation as react-native-codegen.
The react-native-builder-bob package is a CLI tool for creating and building React Native libraries. It focuses on setting up the project structure and build configuration but does not provide code generation capabilities like react-native-codegen.
yarn add --dev react-native-codegen
Note: We're using yarn
to install deps. Feel free to change commands to use npm
3+ and npx
if you like
To run the tests in this package, run the following commands from the react Native root folder:
yarn
to install the dependencies. You just need to run this onceyarn jest react-native-codegen
.v0.72.0
getItemLayout
callback (febf6b7f33 by @NickGerleman)ReactCommon/react/nativemodule/core/platform/ios
and ReactCommon/react/nativemodule/samples
in two separate pods to break circular dependencies. (21d530208f by @cipolleschi)DOMRect
and DOMRectReadOnly
classes to the global scope. (673c7617bc by @rubennorte)setColorScheme
to Appearance
module (c18566ffdb, (0a4dcb0309 by @birkir)BubblingEventHandler
and DirectEventHandler
. (dc2cbed07c by @gtomitsuka)jest --coverage
to .gitignore (7324c22ff9 by @Adnan-Bacic)getName
in react-native-codegen for Java TurboModules (90538909f9 by @javache)pod install
(0eff8d66c9 by @robhogan)d
in terminal. (f72f8daeaf by @szymonrybczak)['require', 'react-native']
(308838c0ff by @huntie)types/jest
to jest/globals
for new react-native projects (9af3c9654a by @UNIDY2002)EventEmitter#addListener
now throws if the 2nd argument is not a function. (2780ba38ff by @yungsters)ref
or innnerViewRef
changes, the old ref will now be invoked with null
and the new ref with the active instance. (Previously, changing ref
or innerViewRef
on a ScrollView
would be treated as though the ref had not changed at all.) (7cf4cf3afb by @yungsters)$ASDF_DIR
(f6a4e4f20f by @MuhmdRaouf)FileReader
and XMLHttpRequest
states (8568b93733 by @eps1lon)scrollEventThrottle
docs (8ea1cba06a by @robwalkerco)T
of Promise<T>
in CodegenSchema.js (8a38e03e0f by @ZihanChen-MSFT)react-native-community/eslint-plugin
to react-native/eslint-plugin
v0.72.0 to align with other packages (5aead70e80 by @afoxman)jest-junit
) (0ba1127c15 by @Pranav-yadav)TSMethodSignature
to react-native-codegen (ae1d54bc5a by @ZihanChen-MSFT)ref
set on TextInput
will now be updated less frequently (when the underlying ref
has not changed). (666f56bff3 by @yungsters)aria-labelledby
from Text props (72d3da19ce by @gabrieldonadel)Content-Location
header in bundle response as JS source URL (671ea383fe by @robhogan)react-native.config.js
is consumed to add elements in the interop layer. (a055e07c3e by @cipolleschi)textContentType
property for backwards compat as mentioned in https://github.com/facebook/react-native/issues/36229#issuecomment-1470468374 (c0abff11b6 by @lunaleaps)use_frameworks!
(6d34952420 by @cipolleschi).../textlayoutmanager/platform/ios
to .../textlayoutmanager/platform/ios/react/renderer/textlayoutmanager
(0e09d6f8a6 by @cipolleschi).../imagemanager/platform/ios
to .../imagemanager/platform/ios/react/renderer/imagemanager
(931a4c5e23 by @cipolleschi).../textinput/iostextinput
to .../textinput/iostextinput/react/renderer/components/iostextinput
(5588e0fe0b by @cipolleschi).../nativemodule/xxx/platform/ios
to .../nativemodule/xxx/platform/ios/ReactCommon
(d1e500c3b1 by @cipolleschi).../platform/ios
to .../platform/ios/react/renderer/graphics
(b5e4fea86e by @cipolleschi)ReactCommon/react/renderer/graphics/conversions.h
in favor of ReactCommon/react/core/graphicsConversions.h
(d72697ca95 by @cipolleschi).node_version
from app template. (a80578afc4 by @robhogan)PermissionsAndroid
(deb6b380b2 by @cortinico)onViewableItemsChanged
won't trigger if first item in data evaluate to false (1f0c2c2895 by @samchan0221)lineBreakStrategyIOS
prop type for Text and TextInput (0c5c07fc9b by @jeongshin)any
(419b41f06d by @jeongshin)exactOptionalPropertyTypes
(7858a2147f by @NickGerleman)unstable_batchedUpdates
(71157f6ba6 by @k-yle)height
, width
, crossOrigin
props on Typescript Image.d.ts file (bcf493f346 by @alvessteve)borderCurve
and pointerEvents
to ViewStyle
(a0800ffc7a by @eps1lon)StyleSheet.compose()
(1752fdc0f5 by @NickGerleman)hermesc
(260bcf7f1b by @tido64)timeRemaining
of idleCallbacks
registered by requestIdleCallbacks
. (d9ab5e81cf by @mir597)addSpansForMeasurement()
(92b8981499 by @NickGerleman)createRootView
is invoked with null bundle (990971186f by @cortinico)ConcurrentModificationException
in UIManagerModuleConstantsHelper::createConstants
(805b88c7a4 by @j-piasecki)isCatalystInstanceAlive
in exception handler (daeee2a661 by @jonnycaley)FB_SONARKIT_ENABLED
from React-Core to React-RCTAppDelegate where it is now used. (34d5212f5c)TextInput
showSoftInputOnFocus
changes from false
to true
(7425c24cbe by @christianwen)automaticallyAdjustKeyboardInsets
not resetting when Prefer Cross-Fade Transitions is enabled and keyboard hides (b8f1bb50f7 by @grgmo)RCTFPSGraph
(987dd6a358 by @mrousavy)find-node-for-xcode.sh
is used. (0d82b402aa by @uloco)-[RCTUITextField textView:shouldChangeTextInRange:replacementString:]
no longer crashes when we pass in a nil
replacement string (d5e6d9cecd by @Saadnajmi)FAQs
⚛️ Code generation tools for React Native
The npm package react-native-codegen receives a total of 277,513 weekly downloads. As such, react-native-codegen popularity was classified as popular.
We found that react-native-codegen demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 11 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
The MCP community is launching an official registry to standardize AI tool discovery and let agents dynamically find and install MCP servers.
Research
Security News
Socket uncovers an npm Trojan stealing crypto wallets and BullX credentials via obfuscated code and Telegram exfiltration.
Research
Security News
Malicious npm packages posing as developer tools target macOS Cursor IDE users, stealing credentials and modifying files to gain persistent backdoor access.