├── .watchmanconfig ├── example ├── .node-version ├── _node-version ├── .ruby-version ├── .bundle │ └── config ├── ios │ ├── File.swift │ ├── UnicornExample │ │ ├── Images.xcassets │ │ │ ├── Contents.json │ │ │ └── AppIcon.appiconset │ │ │ │ └── Contents.json │ │ ├── AppDelegate.h │ │ ├── main.m │ │ ├── Info.plist │ │ ├── AppDelegate.mm │ │ └── LaunchScreen.storyboard │ ├── UnicornExample-Bridging-Header.h │ ├── UnicornExample.xcworkspace │ │ ├── contents.xcworkspacedata │ │ └── xcshareddata │ │ │ └── IDEWorkspaceChecks.plist │ ├── Podfile │ └── UnicornExample.xcodeproj │ │ ├── xcshareddata │ │ └── xcschemes │ │ │ └── UnicornExample.xcscheme │ │ └── project.pbxproj ├── android │ ├── app │ │ ├── src │ │ │ ├── main │ │ │ │ ├── res │ │ │ │ │ ├── values │ │ │ │ │ │ ├── strings.xml │ │ │ │ │ │ └── styles.xml │ │ │ │ │ ├── mipmap-hdpi │ │ │ │ │ │ ├── ic_launcher.png │ │ │ │ │ │ └── ic_launcher_round.png │ │ │ │ │ ├── mipmap-mdpi │ │ │ │ │ │ ├── ic_launcher.png │ │ │ │ │ │ └── ic_launcher_round.png │ │ │ │ │ ├── mipmap-xhdpi │ │ │ │ │ │ ├── ic_launcher.png │ │ │ │ │ │ └── ic_launcher_round.png │ │ │ │ │ ├── mipmap-xxhdpi │ │ │ │ │ │ ├── ic_launcher.png │ │ │ │ │ │ └── ic_launcher_round.png │ │ │ │ │ ├── mipmap-xxxhdpi │ │ │ │ │ │ ├── ic_launcher.png │ │ │ │ │ │ └── ic_launcher_round.png │ │ │ │ │ └── drawable │ │ │ │ │ │ └── rn_edit_text_material.xml │ │ │ │ ├── jni │ │ │ │ │ ├── CMakeLists.txt │ │ │ │ │ ├── MainApplicationModuleProvider.h │ │ │ │ │ ├── OnLoad.cpp │ │ │ │ │ ├── MainComponentsRegistry.h │ │ │ │ │ ├── MainApplicationModuleProvider.cpp │ │ │ │ │ ├── MainApplicationTurboModuleManagerDelegate.h │ │ │ │ │ ├── MainApplicationTurboModuleManagerDelegate.cpp │ │ │ │ │ └── MainComponentsRegistry.cpp │ │ │ │ ├── AndroidManifest.xml │ │ │ │ └── java │ │ │ │ │ └── com │ │ │ │ │ └── example │ │ │ │ │ └── reactnativeunicorn │ │ │ │ │ ├── newarchitecture │ │ │ │ │ ├── components │ │ │ │ │ │ └── MainComponentsRegistry.java │ │ │ │ │ ├── modules │ │ │ │ │ │ └── MainApplicationTurboModuleManagerDelegate.java │ │ │ │ │ └── MainApplicationReactNativeHost.java │ │ │ │ │ ├── MainActivity.java │ │ │ │ │ └── MainApplication.java │ │ │ └── debug │ │ │ │ ├── AndroidManifest.xml │ │ │ │ └── java │ │ │ │ └── com │ │ │ │ └── example │ │ │ │ └── reactnativeunicorn │ │ │ │ └── ReactNativeFlipper.java │ │ ├── debug.keystore │ │ ├── proguard-rules.pro │ │ └── build.gradle │ ├── gradle │ │ └── wrapper │ │ │ ├── gradle-wrapper.jar │ │ │ └── gradle-wrapper.properties │ ├── settings.gradle │ ├── gradle.properties │ ├── build.gradle │ ├── gradlew.bat │ └── gradlew ├── index.tsx ├── Gemfile ├── react-native.config.js ├── src │ ├── styles.ts │ ├── getRandomColor.ts │ ├── LongText.tsx │ ├── ImageItem.tsx │ ├── StatefulImage.tsx │ ├── App.tsx │ └── StatefulItem.tsx ├── babel.config.js ├── package.json ├── metro.config.js └── Gemfile.lock ├── src ├── __tests__ │ └── index.test.tsx ├── index.tsx └── UnicornViewNativeComponent.ts ├── .gitattributes ├── tsconfig.build.json ├── issue.png ├── babel.config.js ├── changeimport.png ├── .yarnrc ├── android ├── src │ └── main │ │ ├── AndroidManifest.xml │ │ └── java │ │ └── com │ │ └── reactnativeunicorn │ │ ├── UnicornViewManagerImpl.java │ │ ├── UnicornViewPackage.java │ │ ├── UnicornView.java │ │ └── UnicornViewManager.java ├── gradle.properties └── build.gradle ├── react-native.config.js ├── .editorconfig ├── cpp ├── react │ └── renderer │ │ └── components │ │ └── unicorn │ │ ├── UnicornViewState.cpp │ │ ├── EventEmitters.cpp │ │ ├── EventEmitters.h │ │ ├── ComponentDescriptors.h │ │ ├── Props.h │ │ ├── Props.cpp │ │ ├── ShadowNodes.h │ │ ├── RCTComponentViewHelpers.h │ │ ├── UnicornViewState.h │ │ └── ShadowNodes.cpp ├── unicorn.cpp ├── unicorn.h └── CMakeLists.txt ├── lefthook.yml ├── ios ├── UnicornView.h ├── UnicornViewManager.mm ├── UnicornView.mm └── Unicorn.xcodeproj │ └── project.pbxproj ├── tsconfig.json ├── scripts └── bootstrap.js ├── .gitignore ├── LICENSE ├── react-native-unicorn.podspec ├── UnicornView.m ├── .circleci └── config.yml ├── README.md ├── package.json ├── patch.diff └── CONTRIBUTING.md /.watchmanconfig: -------------------------------------------------------------------------------- 1 | {} -------------------------------------------------------------------------------- /example/.node-version: -------------------------------------------------------------------------------- 1 | 16 -------------------------------------------------------------------------------- /example/_node-version: -------------------------------------------------------------------------------- 1 | 16 -------------------------------------------------------------------------------- /example/.ruby-version: -------------------------------------------------------------------------------- 1 | 2.7.5 2 | -------------------------------------------------------------------------------- /src/__tests__/index.test.tsx: -------------------------------------------------------------------------------- 1 | it.todo('write a test'); 2 | -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | *.pbxproj -text 2 | # specific for windows script files 3 | *.bat text eol=crlf -------------------------------------------------------------------------------- /example/.bundle/config: -------------------------------------------------------------------------------- 1 | BUNDLE_PATH: "vendor/bundle" 2 | BUNDLE_FORCE_RUBY_PLATFORM: 1 3 | -------------------------------------------------------------------------------- /tsconfig.build.json: -------------------------------------------------------------------------------- 1 | 2 | { 3 | "extends": "./tsconfig", 4 | "exclude": ["example"] 5 | } 6 | -------------------------------------------------------------------------------- /issue.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/callstack/fabric-library-with-custom-cpp-example/HEAD/issue.png -------------------------------------------------------------------------------- /babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: ['module:metro-react-native-babel-preset'], 3 | }; 4 | -------------------------------------------------------------------------------- /example/ios/File.swift: -------------------------------------------------------------------------------- 1 | // 2 | // File.swift 3 | // UnicornExample 4 | // 5 | 6 | import Foundation 7 | -------------------------------------------------------------------------------- /changeimport.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/callstack/fabric-library-with-custom-cpp-example/HEAD/changeimport.png -------------------------------------------------------------------------------- /.yarnrc: -------------------------------------------------------------------------------- 1 | # Override Yarn command so we can automatically setup the repo on running `yarn` 2 | 3 | yarn-path "scripts/bootstrap.js" 4 | -------------------------------------------------------------------------------- /example/android/app/src/main/res/values/strings.xml: -------------------------------------------------------------------------------- 1 | 2 | Unicorn Example 3 | 4 | -------------------------------------------------------------------------------- /example/ios/UnicornExample/Images.xcassets/Contents.json: -------------------------------------------------------------------------------- 1 | { 2 | "info" : { 3 | "version" : 1, 4 | "author" : "xcode" 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /example/android/app/debug.keystore: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/callstack/fabric-library-with-custom-cpp-example/HEAD/example/android/app/debug.keystore -------------------------------------------------------------------------------- /example/index.tsx: -------------------------------------------------------------------------------- 1 | import { AppRegistry } from 'react-native'; 2 | import App from './src/App'; 3 | 4 | AppRegistry.registerComponent('main', () => App); 5 | -------------------------------------------------------------------------------- /example/ios/UnicornExample-Bridging-Header.h: -------------------------------------------------------------------------------- 1 | // 2 | // Use this file to import your target's public headers that you would like to expose to Swift. 3 | // 4 | -------------------------------------------------------------------------------- /android/src/main/AndroidManifest.xml: -------------------------------------------------------------------------------- 1 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /example/android/gradle/wrapper/gradle-wrapper.jar: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/callstack/fabric-library-with-custom-cpp-example/HEAD/example/android/gradle/wrapper/gradle-wrapper.jar -------------------------------------------------------------------------------- /android/gradle.properties: -------------------------------------------------------------------------------- 1 | Unicorn_kotlinVersion=1.7.0 2 | Unicorn_minSdkVersion=21 3 | Unicorn_targetSdkVersion=31 4 | Unicorn_compileSdkVersion=31 5 | Unicorn_ndkversion=21.4.7075529 6 | -------------------------------------------------------------------------------- /example/Gemfile: -------------------------------------------------------------------------------- 1 | source 'https://rubygems.org' 2 | 3 | # You may use http://rbenv.org/ or https://rvm.io/ to install and use this version 4 | ruby '2.7.5' 5 | 6 | gem 'cocoapods', '~> 1.11', '>= 1.11.2' 7 | -------------------------------------------------------------------------------- /example/android/app/src/main/res/mipmap-hdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/callstack/fabric-library-with-custom-cpp-example/HEAD/example/android/app/src/main/res/mipmap-hdpi/ic_launcher.png -------------------------------------------------------------------------------- /example/android/app/src/main/res/mipmap-mdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/callstack/fabric-library-with-custom-cpp-example/HEAD/example/android/app/src/main/res/mipmap-mdpi/ic_launcher.png -------------------------------------------------------------------------------- /example/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/callstack/fabric-library-with-custom-cpp-example/HEAD/example/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png -------------------------------------------------------------------------------- /example/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/callstack/fabric-library-with-custom-cpp-example/HEAD/example/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png -------------------------------------------------------------------------------- /example/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/callstack/fabric-library-with-custom-cpp-example/HEAD/example/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png -------------------------------------------------------------------------------- /example/android/app/src/main/res/mipmap-hdpi/ic_launcher_round.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/callstack/fabric-library-with-custom-cpp-example/HEAD/example/android/app/src/main/res/mipmap-hdpi/ic_launcher_round.png -------------------------------------------------------------------------------- /example/android/app/src/main/res/mipmap-mdpi/ic_launcher_round.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/callstack/fabric-library-with-custom-cpp-example/HEAD/example/android/app/src/main/res/mipmap-mdpi/ic_launcher_round.png -------------------------------------------------------------------------------- /example/android/app/src/main/res/mipmap-xhdpi/ic_launcher_round.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/callstack/fabric-library-with-custom-cpp-example/HEAD/example/android/app/src/main/res/mipmap-xhdpi/ic_launcher_round.png -------------------------------------------------------------------------------- /example/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/callstack/fabric-library-with-custom-cpp-example/HEAD/example/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png -------------------------------------------------------------------------------- /example/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/callstack/fabric-library-with-custom-cpp-example/HEAD/example/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png -------------------------------------------------------------------------------- /example/react-native.config.js: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | 3 | module.exports = { 4 | dependencies: { 5 | 'react-native-unicorn': { 6 | root: path.join(__dirname, '..'), 7 | }, 8 | }, 9 | }; 10 | -------------------------------------------------------------------------------- /example/src/styles.ts: -------------------------------------------------------------------------------- 1 | 2 | import { StyleSheet} from 'react-native'; 3 | 4 | const styles = StyleSheet.create({ 5 | itemContainer: { 6 | width: '100%', 7 | padding: 16, 8 | }, 9 | }); 10 | 11 | export {styles}; 12 | -------------------------------------------------------------------------------- /example/ios/UnicornExample/AppDelegate.h: -------------------------------------------------------------------------------- 1 | #import 2 | #import 3 | 4 | @interface AppDelegate : UIResponder 5 | 6 | @property (nonatomic, strong) UIWindow *window; 7 | 8 | @end 9 | -------------------------------------------------------------------------------- /example/android/gradle/wrapper/gradle-wrapper.properties: -------------------------------------------------------------------------------- 1 | distributionBase=GRADLE_USER_HOME 2 | distributionPath=wrapper/dists 3 | distributionUrl=https\://services.gradle.org/distributions/gradle-7.5.1-all.zip 4 | zipStoreBase=GRADLE_USER_HOME 5 | zipStorePath=wrapper/dists 6 | -------------------------------------------------------------------------------- /example/ios/UnicornExample/main.m: -------------------------------------------------------------------------------- 1 | #import 2 | 3 | #import "AppDelegate.h" 4 | 5 | int main(int argc, char *argv[]) 6 | { 7 | @autoreleasepool { 8 | return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class])); 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /react-native.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | dependency: { 3 | platforms: { 4 | android: { 5 | componentDescriptors: ['UnicornViewComponentDescriptor'], 6 | cmakeListsPath: "../cpp/CMakeLists.txt" 7 | }, 8 | }, 9 | }, 10 | }; 11 | -------------------------------------------------------------------------------- /src/index.tsx: -------------------------------------------------------------------------------- 1 | import { Commands } from './UnicornViewNativeComponent'; 2 | import type { UnicornViewType } from './UnicornViewNativeComponent'; 3 | import UnicornViewNativeComponent from './UnicornViewNativeComponent'; 4 | 5 | export { UnicornViewNativeComponent as UnicornView, Commands, UnicornViewType }; 6 | -------------------------------------------------------------------------------- /example/src/getRandomColor.ts: -------------------------------------------------------------------------------- 1 | export function getRandomColor() { 2 | return [Math.random(), Math.random(), Math.random()] 3 | .map((val) => 4 | Math.round(val * 255) 5 | .toString(16) 6 | .padStart(2, '0') 7 | ) 8 | .join('') 9 | .padStart(7, '#'); 10 | } -------------------------------------------------------------------------------- /example/android/app/src/main/jni/CMakeLists.txt: -------------------------------------------------------------------------------- 1 | 2 | cmake_minimum_required(VERSION 3.13) 3 | # Define the library name here. 4 | project(example_appmodules) 5 | # This file includes all the necessary to let you build your application with the New Architecture. 6 | include(${REACT_ANDROID_DIR}/cmake-utils/ReactNative-application.cmake) -------------------------------------------------------------------------------- /example/ios/UnicornExample.xcworkspace/contents.xcworkspacedata: -------------------------------------------------------------------------------- 1 | 2 | 4 | 6 | 7 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /example/ios/UnicornExample.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | IDEDidComputeMac32BitWarning 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | # EditorConfig helps developers define and maintain consistent 2 | # coding styles between different editors and IDEs 3 | # editorconfig.org 4 | 5 | root = true 6 | 7 | [*] 8 | 9 | indent_style = space 10 | indent_size = 2 11 | 12 | end_of_line = lf 13 | charset = utf-8 14 | trim_trailing_whitespace = true 15 | insert_final_newline = true 16 | -------------------------------------------------------------------------------- /example/android/app/src/main/res/values/styles.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /cpp/react/renderer/components/unicorn/UnicornViewState.cpp: -------------------------------------------------------------------------------- 1 | // 2 | // UnicornViewState.c 3 | // React-Codegen 4 | // 5 | // Created by troZee on 22/08/2022. 6 | // 7 | 8 | #include "UnicornViewState.h" 9 | 10 | namespace facebook { 11 | namespace react { 12 | 13 | Size UnicornViewState::getContentSize() const { 14 | return contentBoundingRect.size; 15 | } 16 | 17 | } // namespace react 18 | } // namespace facebook 19 | -------------------------------------------------------------------------------- /lefthook.yml: -------------------------------------------------------------------------------- 1 | pre-commit: 2 | parallel: true 3 | commands: 4 | lint: 5 | files: git diff --name-only @{push} 6 | glob: "*.{js,ts,jsx,tsx}" 7 | run: npx eslint {files} 8 | types: 9 | files: git diff --name-only @{push} 10 | glob: "*.{js,ts, jsx, tsx}" 11 | run: npx tsc --noEmit 12 | commit-msg: 13 | parallel: true 14 | commands: 15 | commitlint: 16 | run: npx commitlint --edit 17 | -------------------------------------------------------------------------------- /example/android/app/src/main/jni/MainApplicationModuleProvider.h: -------------------------------------------------------------------------------- 1 | #pragma once 2 | 3 | #include 4 | #include 5 | 6 | #include 7 | 8 | namespace facebook { 9 | namespace react { 10 | 11 | std::shared_ptr MainApplicationModuleProvider( 12 | const std::string &moduleName, 13 | const JavaTurboModule::InitParams ¶ms); 14 | 15 | } // namespace react 16 | } // namespace facebook 17 | -------------------------------------------------------------------------------- /example/babel.config.js: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | const pak = require('../package.json'); 3 | 4 | module.exports = { 5 | presets: ['module:metro-react-native-babel-preset'], 6 | plugins: [ 7 | [ 8 | 'module-resolver', 9 | { 10 | extensions: ['.tsx', '.ts', '.js', '.json'], 11 | alias: { 12 | [pak.name]: path.join(__dirname, '..', pak.source), 13 | }, 14 | }, 15 | ], 16 | ], 17 | }; 18 | -------------------------------------------------------------------------------- /example/android/app/src/main/jni/OnLoad.cpp: -------------------------------------------------------------------------------- 1 | #include 2 | #include "MainApplicationTurboModuleManagerDelegate.h" 3 | #include "MainComponentsRegistry.h" 4 | 5 | JNIEXPORT jint JNICALL JNI_OnLoad(JavaVM *vm, void *) { 6 | return facebook::jni::initialize(vm, [] { 7 | facebook::react::MainApplicationTurboModuleManagerDelegate:: 8 | registerNatives(); 9 | facebook::react::MainComponentsRegistry::registerNatives(); 10 | }); 11 | } 12 | -------------------------------------------------------------------------------- /ios/UnicornView.h: -------------------------------------------------------------------------------- 1 | 2 | 3 | // This guard prevent this file to be compiled in the old architecture. 4 | #ifdef RCT_NEW_ARCH_ENABLED 5 | #import 6 | #import 7 | 8 | #ifndef NativeComponentExampleComponentView_h 9 | #define NativeComponentExampleComponentView_h 10 | 11 | NS_ASSUME_NONNULL_BEGIN 12 | 13 | @interface UnicornView : RCTViewComponentView 14 | @end 15 | 16 | NS_ASSUME_NONNULL_END 17 | 18 | #endif /* NativeComponentExampleComponentView_h */ 19 | #endif /* RCT_NEW_ARCH_ENABLED */ -------------------------------------------------------------------------------- /cpp/react/renderer/components/unicorn/EventEmitters.cpp: -------------------------------------------------------------------------------- 1 | 2 | /** 3 | * This code was generated by [react-native-codegen](https://www.npmjs.com/package/react-native-codegen). 4 | * 5 | * Do not edit this file as changes may cause incorrect behavior and will be lost 6 | * once the code is regenerated. 7 | * 8 | * @generated by codegen project: GenerateEventEmitterCpp.js 9 | */ 10 | 11 | #include "EventEmitters.h" 12 | 13 | namespace facebook { 14 | namespace react { 15 | 16 | 17 | 18 | } // namespace react 19 | } // namespace facebook 20 | -------------------------------------------------------------------------------- /android/src/main/java/com/reactnativeunicorn/UnicornViewManagerImpl.java: -------------------------------------------------------------------------------- 1 | package com.reactnativeunicorn; 2 | 3 | import com.facebook.react.uimanager.ThemedReactContext; 4 | import android.graphics.Color; 5 | 6 | public class UnicornViewManagerImpl { 7 | 8 | public static final String NAME = "UnicornView"; 9 | 10 | public static UnicornView createViewInstance(ThemedReactContext context) { 11 | return new UnicornView(context); 12 | } 13 | 14 | public static void setColor(UnicornView view, String color) { 15 | view.setBackgroundColor(Color.parseColor(color)); 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /example/android/app/proguard-rules.pro: -------------------------------------------------------------------------------- 1 | # Add project specific ProGuard rules here. 2 | # By default, the flags in this file are appended to flags specified 3 | # in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt 4 | # You can edit the include path and order by changing the proguardFiles 5 | # directive in build.gradle. 6 | # 7 | # For more details, see 8 | # http://developer.android.com/guide/developing/tools/proguard.html 9 | 10 | # Add any project specific keep options here: 11 | 12 | -keep class com.facebook.hermes.unicode.** { *; } 13 | -keep class com.facebook.jni.** { *; } 14 | -------------------------------------------------------------------------------- /example/android/app/src/debug/AndroidManifest.xml: -------------------------------------------------------------------------------- 1 | 2 | 4 | 5 | 6 | 7 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /cpp/unicorn.cpp: -------------------------------------------------------------------------------- 1 | 2 | /** 3 | * This code was generated by [react-native-codegen](https://www.npmjs.com/package/react-native-codegen). 4 | * 5 | * Do not edit this file as changes may cause incorrect behavior and will be lost 6 | * once the code is regenerated. 7 | * 8 | * @generated by codegen project: GenerateModuleJniCpp.js 9 | */ 10 | 11 | #include "unicorn.h" 12 | 13 | namespace facebook { 14 | namespace react { 15 | 16 | 17 | 18 | std::shared_ptr unicorn_ModuleProvider(const std::string &moduleName, const JavaTurboModule::InitParams ¶ms) { 19 | 20 | return nullptr; 21 | } 22 | 23 | } // namespace react 24 | } // namespace facebook 25 | -------------------------------------------------------------------------------- /example/android/settings.gradle: -------------------------------------------------------------------------------- 1 | rootProject.name = 'UnicornExample' 2 | apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings) 3 | include ':app' 4 | includeBuild('../node_modules/react-native-gradle-plugin') 5 | 6 | if (settings.hasProperty("newArchEnabled") && settings.newArchEnabled == "true") { 7 | include(":ReactAndroid") 8 | project(":ReactAndroid").projectDir = file('../node_modules/react-native/ReactAndroid') 9 | include(":ReactAndroid:hermes-engine") 10 | project(":ReactAndroid:hermes-engine").projectDir = file('../node_modules/react-native/ReactAndroid/hermes-engine') 11 | } 12 | 13 | -------------------------------------------------------------------------------- /cpp/react/renderer/components/unicorn/EventEmitters.h: -------------------------------------------------------------------------------- 1 | 2 | /** 3 | * This code was generated by [react-native-codegen](https://www.npmjs.com/package/react-native-codegen). 4 | * 5 | * Do not edit this file as changes may cause incorrect behavior and will be lost 6 | * once the code is regenerated. 7 | * 8 | * @generated by codegen project: GenerateEventEmitterH.js 9 | */ 10 | #pragma once 11 | 12 | #include 13 | 14 | namespace facebook { 15 | namespace react { 16 | 17 | class UnicornViewEventEmitter : public ViewEventEmitter { 18 | public: 19 | using ViewEventEmitter::ViewEventEmitter; 20 | }; 21 | 22 | 23 | } // namespace react 24 | } // namespace facebook 25 | -------------------------------------------------------------------------------- /cpp/react/renderer/components/unicorn/ComponentDescriptors.h: -------------------------------------------------------------------------------- 1 | 2 | /** 3 | * This code was generated by [react-native-codegen](https://www.npmjs.com/package/react-native-codegen). 4 | * 5 | * Do not edit this file as changes may cause incorrect behavior and will be lost 6 | * once the code is regenerated. 7 | * 8 | * @generated by codegen project: GenerateComponentDescriptorH.js 9 | */ 10 | 11 | #pragma once 12 | 13 | #include "ShadowNodes.h" 14 | #include 15 | 16 | namespace facebook { 17 | namespace react { 18 | 19 | using UnicornViewComponentDescriptor = ConcreteComponentDescriptor; 20 | 21 | } // namespace react 22 | } // namespace facebook 23 | -------------------------------------------------------------------------------- /cpp/unicorn.h: -------------------------------------------------------------------------------- 1 | 2 | /** 3 | * This code was generated by [react-native-codegen](https://www.npmjs.com/package/react-native-codegen). 4 | * 5 | * Do not edit this file as changes may cause incorrect behavior and will be lost 6 | * once the code is regenerated. 7 | * 8 | * @generated by codegen project: GenerateModuleJniH.js 9 | */ 10 | 11 | #pragma once 12 | 13 | #include 14 | #include 15 | #include 16 | 17 | namespace facebook { 18 | namespace react { 19 | 20 | 21 | 22 | JSI_EXPORT 23 | std::shared_ptr unicorn_ModuleProvider(const std::string &moduleName, const JavaTurboModule::InitParams ¶ms); 24 | 25 | } // namespace react 26 | } // namespace facebook 27 | -------------------------------------------------------------------------------- /example/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "react-native-unicorn-example", 3 | "description": "Example app for react-native-unicorn", 4 | "version": "0.0.1", 5 | "private": true, 6 | "scripts": { 7 | "android": "react-native run-android", 8 | "ios": "react-native run-ios", 9 | "start": "react-native start", 10 | "postinstall": "patch-package" 11 | }, 12 | "dependencies": { 13 | "react": "18.1.0", 14 | "react-native": "0.70.0", 15 | "react-native-unicorn": "file:.." 16 | }, 17 | "devDependencies": { 18 | "@babel/core": "^7.12.10", 19 | "@babel/runtime": "^7.12.5", 20 | "babel-plugin-module-resolver": "^4.1.0", 21 | "metro-react-native-babel-preset": "^0.72.1", 22 | "patch-package": "^6.4.7", 23 | "postinstall-postinstall": "^2.1.0", 24 | "react-test-renderer": "18.1.0" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": "./", 4 | "paths": { 5 | "react-native-unicorn": ["./src/index"] 6 | }, 7 | "allowUnreachableCode": false, 8 | "allowUnusedLabels": false, 9 | "esModuleInterop": true, 10 | "importsNotUsedAsValues": "error", 11 | "forceConsistentCasingInFileNames": true, 12 | "jsx": "react", 13 | "lib": ["esnext"], 14 | "module": "esnext", 15 | "moduleResolution": "node", 16 | "noFallthroughCasesInSwitch": true, 17 | "noImplicitReturns": true, 18 | "noImplicitUseStrict": false, 19 | "noStrictGenericChecks": false, 20 | "noUncheckedIndexedAccess": true, 21 | "noUnusedLocals": true, 22 | "noUnusedParameters": true, 23 | "resolveJsonModule": true, 24 | "skipLibCheck": true, 25 | "strict": true, 26 | "target": "esnext" 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /src/UnicornViewNativeComponent.ts: -------------------------------------------------------------------------------- 1 | import codegenNativeComponent, { NativeComponentType } from 'react-native/Libraries/Utilities/codegenNativeComponent'; 2 | import codegenNativeCommands from 'react-native/Libraries/Utilities/codegenNativeCommands'; 3 | import type { ViewProps } from 'react-native'; 4 | 5 | interface NativeProps extends ViewProps { 6 | color?: string, 7 | }; 8 | 9 | export type UnicornViewType = NativeComponentType; 10 | 11 | 12 | interface NativeCommands { 13 | changeBackgroundColor: ( 14 | viewRef: React.ElementRef, 15 | color: string, 16 | ) => void; 17 | } 18 | 19 | export const Commands: NativeCommands = codegenNativeCommands({ 20 | supportedCommands: ['changeBackgroundColor'], 21 | }); 22 | 23 | export default codegenNativeComponent('UnicornView',{interfaceOnly:true}); -------------------------------------------------------------------------------- /scripts/bootstrap.js: -------------------------------------------------------------------------------- 1 | const os = require('os'); 2 | const path = require('path'); 3 | const child_process = require('child_process'); 4 | 5 | const root = path.resolve(__dirname, '..'); 6 | const args = process.argv.slice(2); 7 | const options = { 8 | cwd: process.cwd(), 9 | env: process.env, 10 | stdio: 'inherit', 11 | encoding: 'utf-8', 12 | }; 13 | 14 | if (os.type() === 'Windows_NT') { 15 | options.shell = true; 16 | } 17 | 18 | let result; 19 | 20 | if (process.cwd() !== root || args.length) { 21 | // We're not in the root of the project, or additional arguments were passed 22 | // In this case, forward the command to `yarn` 23 | result = child_process.spawnSync('yarn', args, options); 24 | } else { 25 | // If `yarn` is run without arguments, perform bootstrap 26 | result = child_process.spawnSync('yarn', ['bootstrap'], options); 27 | } 28 | 29 | process.exitCode = result.status; 30 | -------------------------------------------------------------------------------- /android/src/main/java/com/reactnativeunicorn/UnicornViewPackage.java: -------------------------------------------------------------------------------- 1 | package com.reactnativeunicorn; 2 | 3 | import com.facebook.react.ReactPackage; 4 | import com.facebook.react.bridge.NativeModule; 5 | import com.facebook.react.bridge.ReactApplicationContext; 6 | import com.facebook.react.uimanager.ViewManager; 7 | 8 | import java.util.ArrayList; 9 | import java.util.Collections; 10 | import java.util.List; 11 | 12 | public class UnicornViewPackage implements ReactPackage { 13 | @Override 14 | public List createViewManagers(ReactApplicationContext reactContext) { 15 | List viewManagers = new ArrayList<>(); 16 | viewManagers.add(new UnicornViewManager(reactContext)); 17 | return viewManagers; 18 | } 19 | 20 | @Override 21 | public List createNativeModules(ReactApplicationContext reactContext) { 22 | return Collections.emptyList(); 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /cpp/react/renderer/components/unicorn/Props.h: -------------------------------------------------------------------------------- 1 | 2 | /** 3 | * This code was generated by [react-native-codegen](https://www.npmjs.com/package/react-native-codegen). 4 | * 5 | * Do not edit this file as changes may cause incorrect behavior and will be lost 6 | * once the code is regenerated. 7 | * 8 | * @generated by codegen project: GeneratePropsH.js 9 | */ 10 | #pragma once 11 | 12 | #include 13 | #include 14 | 15 | namespace facebook { 16 | namespace react { 17 | 18 | class JSI_EXPORT UnicornViewProps final : public ViewProps { 19 | public: 20 | UnicornViewProps() = default; 21 | UnicornViewProps(const PropsParserContext& context, const UnicornViewProps &sourceProps, const RawProps &rawProps); 22 | 23 | #pragma mark - Props 24 | 25 | std::string color{}; 26 | }; 27 | 28 | } // namespace react 29 | } // namespace facebook 30 | -------------------------------------------------------------------------------- /cpp/react/renderer/components/unicorn/Props.cpp: -------------------------------------------------------------------------------- 1 | 2 | /** 3 | * This code was generated by [react-native-codegen](https://www.npmjs.com/package/react-native-codegen). 4 | * 5 | * Do not edit this file as changes may cause incorrect behavior and will be lost 6 | * once the code is regenerated. 7 | * 8 | * @generated by codegen project: GeneratePropsCpp.js 9 | */ 10 | 11 | #include "Props.h" 12 | #include 13 | #include 14 | 15 | namespace facebook { 16 | namespace react { 17 | 18 | UnicornViewProps::UnicornViewProps( 19 | const PropsParserContext &context, 20 | const UnicornViewProps &sourceProps, 21 | const RawProps &rawProps): ViewProps(context, sourceProps, rawProps), 22 | 23 | color(convertRawProp(context, rawProps, "color", sourceProps.color, {})) 24 | {} 25 | 26 | } // namespace react 27 | } // namespace facebook 28 | -------------------------------------------------------------------------------- /example/src/LongText.tsx: -------------------------------------------------------------------------------- 1 | import * as React from 'react'; 2 | 3 | import { Text, View } from 'react-native'; 4 | import { getRandomColor } from './getRandomColor'; 5 | import { styles } from './styles'; 6 | 7 | export default function LongText() { 8 | return ( 9 | 13 | 14 | If you're looking for skilled and trusted React Native developers, 15 | Callstack is definitely the way to go. They've been around since we 16 | first open sourced React Native, and are active members of the 17 | community. Callstack maintains a bunch of important modules, like the 18 | React Native CLI, and also drives all releases. Their experience 19 | positions them well to take on any kind of project from building simple 20 | apps to setting up complex architectures. They're really great to work 21 | with." 22 | 23 | 24 | ); 25 | } 26 | -------------------------------------------------------------------------------- /example/src/ImageItem.tsx: -------------------------------------------------------------------------------- 1 | import * as React from 'react'; 2 | import { Image, View, ViewProps } from 'react-native'; 3 | import { getRandomColor } from './getRandomColor'; 4 | import { styles } from './styles'; 5 | 6 | const images = [ 7 | { 8 | uri: 'https://crossweb.pl/job/wp-content/uploads/header/callstack-company-logo-400x400-1636107289.jpg', 9 | style: { width: 100, height: 100 }, 10 | }, 11 | { 12 | uri: 'https://pbs.twimg.com/profile_images/1219949632610062336/S9rq-fOp_400x400.jpg', 13 | style: { width: 200, height: 200 }, 14 | }, 15 | ]; 16 | interface Props extends ViewProps { 17 | index: 0 | 1; 18 | } 19 | export default function ImageItem({ index }: Props) { 20 | const { uri, style } = images[index] || { uri: '', style: {} }; 21 | return ( 22 | 26 | 32 | 33 | ); 34 | } 35 | -------------------------------------------------------------------------------- /cpp/CMakeLists.txt: -------------------------------------------------------------------------------- 1 | cmake_minimum_required(VERSION 3.13) 2 | set(CMAKE_VERBOSE_MAKEFILE on) 3 | 4 | add_compile_options( 5 | -fexceptions 6 | -frtti 7 | -std=c++17 8 | -Wall 9 | -Wpedantic 10 | -Wno-gnu-zero-variadic-macro-arguments) 11 | 12 | file(GLOB unicorn_SRCS CONFIGURE_DEPENDS *.cpp react/renderer/components/unicorn/*.cpp) 13 | add_library(react_codegen_unicorn SHARED ${unicorn_SRCS}) 14 | 15 | target_include_directories(react_codegen_unicorn PUBLIC . react/renderer/components/unicornview) 16 | 17 | target_link_libraries( 18 | react_codegen_unicorn 19 | fbjni 20 | folly_runtime 21 | glog 22 | jsi 23 | react_codegen_rncore 24 | react_debug 25 | react_nativemodule_core 26 | react_render_core 27 | react_render_debug 28 | react_render_graphics 29 | react_render_mapbuffer 30 | rrc_view 31 | turbomodulejsijni 32 | yoga 33 | ) 34 | 35 | target_compile_options( 36 | react_codegen_unicorn 37 | PRIVATE 38 | -DLOG_TAG=\"ReactNative\" 39 | -fexceptions 40 | -frtti 41 | -std=c++17 42 | -Wall 43 | ) -------------------------------------------------------------------------------- /example/src/StatefulImage.tsx: -------------------------------------------------------------------------------- 1 | import * as React from 'react'; 2 | import { Button, Image, View } from 'react-native'; 3 | import { getRandomColor } from './getRandomColor'; 4 | import { styles } from './styles'; 5 | 6 | export default function StatefulImage() { 7 | const [alignment, setAlignment] = React.useState<'flex-end' | 'flex-start'>( 8 | 'flex-start' 9 | ); 10 | 11 | return ( 12 | 16 | 17 | 23 | 24 | 25 |