react-native-native-select 1.0.0

package/README.md

@@ -0,0 +1,109 @@
+# react-native-native-select
+
+A strictly native, performant Select component for React Native built exclusively for the **New Architecture**.
+
+It leverages actual OS primitives: `UIMenu` (iOS 14+), `UIPickerView` (iOS Wheel), and `AppCompatSpinner` (Android), offering a truly native look and feel that JS-based libraries cannot match.
+
+## Preview
+
+| iOS (Dropdown Mode) | iOS (Dialog/Wheel Mode) | Android |
+|:---:|:---:|:---:|
+| *[Insert Screenshot of iOS Select with open Menu]* | *[Insert Screenshot of iOS Bottom Wheel picker]* | *[Insert Screenshot of Android Dropdown]* |
+| *Native UIMenu (iOS 14+)* | *Classic UIPickerView* | *Native AppCompatSpinner* |
+
+## Why this library?
+
+Most Select/Picker libraries in the React Native ecosystem fall into two categories:
+1.  **JS-based Simulations:** They render a Modal with a FlatList. They are customizable but feel "off" compared to the OS native UI and often lack accessibility standards like [`react-native-picker-select`](https://www.npmjs.com/package/react-native-picker-select).
+2.  **Legacy Wrappers:** Libraries like [`@react-native-picker/picker`](https://www.npmjs.com/package/@react-native-picker/picker) are excellent but often rely on the old bridge or split functionality across different components.
+
+**react-native-native-select** is designed for modern apps:
+* **Zero JS Thread Overhead:** Fully native implementation using Fabric.
+* **Modern iOS UI:** Supports the iOS 14+ `pull-down` menu style out of the box.
+* **Native Performance:** Interactions run on the UI thread.
+
+## Requirements
+
+* **React Native:** >= 0.71.0
+* **Architecture:** New Architecture **Enabled**
+* **iOS:** 14.0+ (for Dropdown mode), 11.0+ (for Dialog mode)
+
+## Installation
+
+```bash
+npm install react-native-native-select
+# or
+yarn add react-native-native-select
+```
+
+### iOS Setup
+
+Since this library uses native modules, you must run pod install:
+
+```bash
+cd ios && pod install
+```
+
+## Usage
+
+```tsx
+import { StyleSheet, View, Text } from 'react-native';
+import { Select } from 'react-native-native-select';
+
+export default function App() {
+	return (
+		<View style={styles.container}>
+			<Text style={styles.label}>Choose a fruit:</Text>
+
+			<Select
+				style={styles.select}
+				mode="dropdown"
+				options={["Apple", "Banana", "Orange", "Mango"]}
+				selectedIndex={0}
+				onValueChange={(e) => {
+					console.log("Selected Item:", e.nativeEvent.value); // Ex: "Apple"
+					console.log("Selected Index:", e.nativeEvent.index); // Ex: 0
+				}}
+			/>
+		</View>
+	);
+}
+
+const styles = StyleSheet.create({
+	container: {
+		flex: 1,
+		justifyContent: 'center',
+		padding: 20,
+	},
+	label: {
+		marginBottom: 10,
+		fontSize: 16,
+	},
+	select: {
+		width: '100%',
+		height: 50, // Height is required for layout calculation
+	},
+});
+```
+
+### Android Usage
+
+Please take a look at this [Android example usage](./tests/android_demo.tsx) because the native component is not updating the visual state at the moment
+
+## Props
+
+| Prop | Type | Required | Description |
+| :--- | :--- | :---: | :--- |
+| **`options`** | `string[]` | **Yes** | An array of strings to display in the list. |
+| **`selectedIndex`** | `number` | No | The index of the currently selected item. Defaults to `0`. |
+| **`mode`** | `'dropdown' \| 'dialog'` | No | **iOS Only.** <br>`dropdown`: Uses `UIMenu` (Modern iOS 14+). <br>`dialog`: Uses `UIPickerView` (Classic Wheel). <br> *On Android, this prop is ignored as it always uses the native Spinner.* |
+| **`onValueChange`** | `function` | No | Callback fired when an item is selected. Returns `{ value: string, index: number }`. |
+| **`style`** | `ViewStyle` | No | Standard style prop. **Note:** You must define `width` and `height` for the view to render correctly. |
+
+## Troubleshooting
+
+**The component is visible but empty (Empty space)**
+Ensure you have defined a `width` and `height` in the `style` prop. Native views on iOS require explicit dimensions or Flexbox constraints to render their subviews correctly.
+
+**App crashes on launch**
+Ensure `RCT_NEW_ARCH_ENABLED=1` was present when you ran `pod install`. This library does not support the old React Native Bridge.

package/android/build.gradle

@@ -0,0 +1,36 @@
+buildscript {
+	ext.safeExtGet = {prop, fallback ->
+		rootProject.ext.has(prop) ? rootProject.ext.get(prop) : fallback
+	}
+	repositories {
+		google()
+		gradlePluginPortal()
+	}
+	dependencies {
+		classpath("com.android.tools.build:gradle:7.2.0")
+	}
+}
+
+apply plugin: 'com.android.library'
+apply plugin: 'com.facebook.react'
+
+android {
+	compileSdkVersion safeExtGet('compileSdkVersion', 31)
+
+	defaultConfig {
+		minSdkVersion safeExtGet('minSdkVersion', 21)
+		targetSdkVersion safeExtGet('targetSdkVersion', 31)
+	}
+}
+
+repositories {
+	maven {
+		url "$projectDir/../node_modules/react-native/android"
+	}
+	mavenCentral()
+	google()
+}
+
+dependencies {
+	implementation 'com.facebook.react:react-native:+'
+}

package/android/src/main/AndroidManifest.xml

@@ -0,0 +1,3 @@
+<manifest xmlns:android="http://schemas.android.com/apk/res/android"
+	package="com.rtnselect">
+</manifest>

package/android/src/main/java/com/rtnselect/SelectView.java

@@ -0,0 +1,127 @@
+package com.rtnselect;
+
+import android.content.Context;
+import android.util.AttributeSet;
+import android.util.Log;
+import android.view.View;
+import android.widget.AdapterView;
+import android.widget.ArrayAdapter;
+import androidx.annotation.Nullable;
+import androidx.appcompat.widget.AppCompatSpinner;
+
+import com.facebook.react.bridge.Arguments;
+import com.facebook.react.bridge.ReactContext;
+import com.facebook.react.bridge.WritableMap;
+import com.facebook.react.uimanager.events.RCTEventEmitter;
+
+import java.util.List;
+
+public class SelectView extends AppCompatSpinner implements AdapterView.OnItemSelectedListener {
+
+	private final String TAG = "RTNSelect";
+
+	public SelectView(Context context) {
+		super(context);
+		init();
+	}
+
+	public SelectView(Context context, @Nullable AttributeSet attrs) {
+		super(context, attrs);
+		init();
+	}
+
+	public SelectView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
+		super(context, attrs, defStyleAttr);
+		init();
+	}
+
+	private void init() {
+		this.setOnItemSelectedListener(this);
+	}
+
+	@Override
+	public boolean performClick() {
+		boolean result = super.performClick();
+		return result;
+	}
+
+	@Override
+	protected void onAttachedToWindow() {
+		super.onAttachedToWindow();
+	}
+
+	@Override
+	protected void onDetachedFromWindow() {
+		super.onDetachedFromWindow();
+	}
+
+	public void setOptions(List<String> options) {
+
+		ArrayAdapter<String> adapter = new ArrayAdapter<>(getContext(), android.R.layout.simple_spinner_item, options);
+		adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
+
+		this.setAdapter(adapter);
+	}
+
+	@Override
+	public void setSelection(int position) {
+
+		this.post(new Runnable() {
+			@Override
+			public void run() {
+				SelectView.super.setSelection(position);
+			}
+		});
+
+		ReactContext reactContext = (ReactContext) getContext();
+		if (reactContext != null) {
+			String val = "unknown";
+			if (getAdapter() != null && getAdapter().getCount() > position) {
+				Object item = getAdapter().getItem(position);
+				if (item != null) val = item.toString();
+			}
+
+			WritableMap event = Arguments.createMap();
+			event.putString("value", val);
+			event.putInt("index", position);
+
+			try {
+				reactContext.getJSModule(RCTEventEmitter.class).receiveEvent(
+					getId(),
+					"topValueChange",
+					event
+				);
+			} catch (Exception e) {
+			}
+		}
+	}
+
+	@Override
+	public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
+		String val = "null";
+		if (parent != null && parent.getItemAtPosition(position) != null) {
+			val = parent.getItemAtPosition(position).toString();
+		}
+
+		ReactContext reactContext = (ReactContext) getContext();
+		if (reactContext != null) {
+			WritableMap event = Arguments.createMap();
+			event.putString("value", val);
+			event.putInt("index", position);
+
+			try {
+				reactContext.getJSModule(RCTEventEmitter.class).receiveEvent(
+					getId(),
+					"topValueChange",
+					event
+				);
+			} catch (Exception e) {
+			}
+		} else {
+		}
+	}
+
+	@Override
+	public void onNothingSelected(AdapterView<?> parent) {
+	}
+}

package/android/src/main/java/com/rtnselect/SelectViewManager.java

@@ -0,0 +1,83 @@
+package com.rtnselect;
+
+import androidx.annotation.NonNull;
+import androidx.annotation.Nullable;
+
+import com.facebook.react.bridge.ReactApplicationContext;
+import com.facebook.react.bridge.ReactContext;
+import com.facebook.react.bridge.ReadableArray;
+import com.facebook.react.common.MapBuilder;
+import com.facebook.react.module.annotations.ReactModule;
+import com.facebook.react.uimanager.SimpleViewManager;
+import com.facebook.react.uimanager.ThemedReactContext;
+import com.facebook.react.uimanager.ViewManagerDelegate;
+import com.facebook.react.uimanager.annotations.ReactProp;
+import com.facebook.react.viewmanagers.RTNSelectManagerDelegate;
+import com.facebook.react.viewmanagers.RTNSelectManagerInterface;
+
+import java.util.ArrayList;
+import java.util.Map;
+
+@ReactModule(name = SelectViewManager.REACT_CLASS)
+public class SelectViewManager extends SimpleViewManager<SelectView>
+		implements RTNSelectManagerInterface<SelectView> {
+
+	public static final String REACT_CLASS = "RTNSelect";
+	private final ViewManagerDelegate<SelectView> mDelegate;
+
+	public SelectViewManager(ReactApplicationContext reactContext) {
+		mDelegate = new RTNSelectManagerDelegate<>(this);
+	}
+
+	@Nullable
+	@Override
+	protected ViewManagerDelegate<SelectView> getDelegate() {
+		return mDelegate;
+	}
+
+	@NonNull
+	@Override
+	public String getName() {
+		return REACT_CLASS;
+	}
+
+	@Nullable
+	@Override
+	public Map<String, Object> getExportedCustomDirectEventTypeConstants() {
+		// Strict mapping: Native 'topValueChange' -> JS 'onValueChange'
+		return MapBuilder.of(
+				"topValueChange",
+				MapBuilder.of("registrationName", "onValueChange")
+		);
+	}
+
+	@NonNull
+	@Override
+	protected SelectView createViewInstance(@NonNull ThemedReactContext reactContext) {
+		return new SelectView(reactContext);
+	}
+
+	@Override
+	@ReactProp(name = "options")
+	public void setOptions(SelectView view, @Nullable ReadableArray value) {
+		ArrayList<String> list = new ArrayList<>();
+		if (value != null) {
+			for (int i = 0; i < value.size(); i++) {
+				list.add(value.getString(i));
+			}
+		}
+		view.setOptions(list);
+	}
+
+	@Override
+	@ReactProp(name = "selectedIndex")
+	public void setSelectedIndex(SelectView view, int value) {
+		view.setSelection(value);
+	}
+
+	@Override
+	@ReactProp(name = "mode")
+	public void setMode(SelectView view, @Nullable String value) {}
+
+	public void setOnValueChange(SelectView view, @Nullable Object value) {}
+}

package/android/src/main/java/com/rtnselect/SelectViewPackage.java

@@ -0,0 +1,21 @@
+package com.rtnselect;
+
+import com.facebook.react.ReactPackage;
+import com.facebook.react.bridge.NativeModule;
+import com.facebook.react.bridge.ReactApplicationContext;
+import com.facebook.react.uimanager.ViewManager;
+
+import java.util.Collections;
+import java.util.List;
+
+public class SelectViewPackage implements ReactPackage {
+	@Override
+	public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {
+		return Collections.singletonList(new SelectViewManager(reactContext));
+	}
+
+	@Override
+	public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {
+		return Collections.emptyList();
+	}
+}

package/ios/RTNSelect.h

@@ -0,0 +1,10 @@
+#import <React/RCTViewComponentView.h>
+#import <UIKit/UIKit.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+@interface RTNSelect : RCTViewComponentView <UIPickerViewDataSource, UIPickerViewDelegate>
+
+@end
+
+NS_ASSUME_NONNULL_END

package/ios/RTNSelect.mm

@@ -0,0 +1,245 @@
+#import "RTNSelect.h"
+#import <React/RCTComponent.h>
+
+#import <react/renderer/components/RTNSelectSpec/ComponentDescriptors.h>
+#import <react/renderer/components/RTNSelectSpec/EventEmitters.h>
+#import <react/renderer/components/RTNSelectSpec/Props.h>
+#import <react/renderer/components/RTNSelectSpec/RCTComponentViewHelpers.h>
+
+#import "RCTFabricComponentsPlugins.h"
+
+using namespace facebook::react;
+
+@interface RTNSelect () <RCTRTNSelectViewProtocol>
+@end
+
+@implementation RTNSelect {
+	UIPickerView *_pickerView;
+	UIButton *_button;
+
+	std::vector<std::string> _options;
+	NSInteger _selectedIndex;
+	RCTDirectEventBlock _onValueChangeLegacy;
+}
+
++ (ComponentDescriptorProvider)componentDescriptorProvider
+{
+	return concreteComponentDescriptorProvider<RTNSelectComponentDescriptor>();
+}
+
+- (instancetype)initWithFrame:(CGRect)frame
+{
+	if (self = [super initWithFrame:frame]) {
+		static const auto defaultProps = std::make_shared<const RTNSelectProps>();
+		_props = defaultProps;
+		_selectedIndex = 0;
+
+		_pickerView = [[UIPickerView alloc] initWithFrame:self.bounds];
+		_pickerView.dataSource = self;
+		_pickerView.delegate = self;
+		_pickerView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
+
+		_button = [UIButton buttonWithType:UIButtonTypeSystem];
+		_button.frame = self.bounds;
+		_button.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
+
+		// Style du bouton (alignement à gauche, couleur noire pour le texte)
+		_button.contentHorizontalAlignment = UIControlContentHorizontalAlignmentLeft;
+		[_button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
+
+		if (@available(iOS 14.0, *)) {
+			_button.showsMenuAsPrimaryAction = YES;
+		}
+
+		_button.hidden = YES;
+
+		[self addSubview:_pickerView];
+		[self addSubview:_button];
+	}
+
+	return self;
+}
+
+- (void)layoutSubviews {
+	[super layoutSubviews];
+	_pickerView.frame = self.bounds;
+	_button.frame = self.bounds;
+}
+
+// ============================================================================
+// Gestion du Menu Flottant (Dropdown)
+// ============================================================================
+
+- (void)updateButtonMenu {
+	if (@available(iOS 14.0, *)) {
+		NSMutableArray<UIAction *> *actions = [NSMutableArray array];
+
+		for (int i = 0; i < _options.size(); i++) {
+			std::string optionString = _options[i];
+			NSString *title = [NSString stringWithUTF8String:optionString.c_str()];
+
+			UIAction *action = [UIAction actionWithTitle:title image:nil identifier:nil handler:^(__kindof UIAction * _Nonnull action) {
+					[self selectIndex:i fromSource:@"dropdown"];
+			}];
+
+			if (i == _selectedIndex) {
+				action.state = UIMenuElementStateOn;
+				[_button setTitle:title forState:UIControlStateNormal];
+			}
+
+			[actions addObject:action];
+		}
+
+		UIMenu *menu = [UIMenu menuWithTitle:@"" children:actions];
+		_button.menu = menu;
+	}
+}
+
+// ============================================================================
+// Méthode unifiée de sélection (appelée par Picker ou Dropdown)
+// ============================================================================
+
+- (void)selectIndex:(NSInteger)index fromSource:(NSString *)source {
+	if (index >= _options.size()) return;
+
+	_selectedIndex = index;
+
+	if ([source isEqualToString:@"dropdown"]) {
+		[_pickerView selectRow:index inComponent:0 animated:NO];
+		[self updateButtonMenu];
+	} else {
+		[self updateButtonMenu];
+	}
+
+	if (_eventEmitter) {
+		auto emitter = std::static_pointer_cast<RTNSelectEventEmitter const>(_eventEmitter);
+		emitter->onValueChange({
+			.value = _options[index],
+			.index = (int)index
+		});
+	}
+
+	if (_onValueChangeLegacy) {
+		_onValueChangeLegacy(@{
+			@"value": [NSString stringWithUTF8String:_options[index].c_str()],
+			@"index": @(index)
+		});
+	}
+}
+
+// ============================================================================
+// 1. FABRIC (New Architecture) Implementation
+// ============================================================================
+
+- (void)updateProps:(Props::Shared const &)props oldProps:(Props::Shared const &)oldProps
+{
+	const auto &oldViewProps = *std::static_pointer_cast<const RTNSelectProps>(_props);
+	const auto &newViewProps = *std::static_pointer_cast<const RTNSelectProps>(props);
+
+	bool optionsChanged = oldViewProps.options != newViewProps.options;
+	bool indexChanged = oldViewProps.selectedIndex != newViewProps.selectedIndex;
+	bool modeChanged = oldViewProps.mode != newViewProps.mode;
+
+	if (optionsChanged) {
+		_options = newViewProps.options;
+	}
+
+	if (indexChanged) {
+		_selectedIndex = newViewProps.selectedIndex;
+	}
+
+	[super updateProps:props oldProps:oldProps];
+
+	dispatch_async(dispatch_get_main_queue(), ^{
+		if (optionsChanged) {
+			[self->_pickerView reloadAllComponents];
+			[self updateButtonMenu];
+		}
+
+		if (indexChanged && newViewProps.selectedIndex < self->_options.size()) {
+			[self->_pickerView selectRow:newViewProps.selectedIndex inComponent:0 animated:YES];
+			[self updateButtonMenu];
+		}
+
+		if (modeChanged || optionsChanged) {
+			if (newViewProps.mode == RTNSelectMode::Dropdown) {
+				self->_pickerView.hidden = YES;
+				self->_button.hidden = NO;
+			} else {
+				self->_pickerView.hidden = NO;
+				self->_button.hidden = YES;
+			}
+		}
+	});
+}
+
+// ============================================================================
+// 2. LEGACY / INTEROP Implementation
+// ============================================================================
+
+- (void)setOptions:(NSArray<NSString *> *)options {
+	_options.clear();
+	for (NSString *option in options) {
+		_options.push_back([option UTF8String]);
+	}
+	dispatch_async(dispatch_get_main_queue(), ^{
+		[self->_pickerView reloadAllComponents];
+		[self updateButtonMenu];
+	});
+}
+
+- (void)setSelectedIndex:(NSInteger)selectedIndex {
+	_selectedIndex = selectedIndex;
+	dispatch_async(dispatch_get_main_queue(), ^{
+		if (selectedIndex < self->_options.size()) {
+			[self->_pickerView selectRow:selectedIndex inComponent:0 animated:YES];
+			[self updateButtonMenu];
+		}
+	});
+}
+
+- (void)setMode:(NSString *)mode {
+	dispatch_async(dispatch_get_main_queue(), ^{
+		if ([mode isEqualToString:@"dropdown"]) {
+			self->_pickerView.hidden = YES;
+			self->_button.hidden = NO;
+		} else {
+			self->_pickerView.hidden = NO;
+			self->_button.hidden = YES;
+		}
+	});
+}
+
+- (void)setOnValueChange:(RCTDirectEventBlock)onValueChange {
+	_onValueChangeLegacy = onValueChange;
+}
+
+// ============================================================================
+// 3. UIPickerView Delegate Methods
+// ============================================================================
+
+- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView {
+	return 1;
+}
+
+- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component {
+	return _options.size();
+}
+
+- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component {
+	if (row < _options.size()) {
+		return [NSString stringWithUTF8String:_options[row].c_str()];
+	}
+	return @"";
+}
+
+- (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component {
+	[self selectIndex:row fromSource:@"picker"];
+}
+
+@end
+
+Class<RCTComponentViewProtocol> RTNSelectCls(void)
+{
+	return RTNSelect.class;
+}

package/ios/RTNSelectManager.mm

@@ -0,0 +1,22 @@
+#import <React/RCTLog.h>
+#import <React/RCTUIManager.h>
+#import <React/RCTViewManager.h>
+#import "RTNSelect.h"
+
+@interface RTNSelectManager : RCTViewManager
+@end
+
+@implementation RTNSelectManager
+
+RCT_EXPORT_MODULE(RTNSelect)
+
+- (UIView *)view {
+	return [[RTNSelect alloc] init];
+}
+
+RCT_EXPORT_VIEW_PROPERTY(options, NSArray)
+RCT_EXPORT_VIEW_PROPERTY(selectedIndex, NSInteger)
+RCT_EXPORT_VIEW_PROPERTY(mode, NSString)
+RCT_EXPORT_VIEW_PROPERTY(onValueChange, RCTDirectEventBlock)
+
+@end

package/package.json

@@ -0,0 +1,43 @@
+{
+	"name": "react-native-native-select",
+	"version": "1.0.0",
+	"description": "react-native-native-select is a strictly native, performant Select component for React Native built exclusively for the New Architecture.",
+
+	"main": "src/index.ts",
+	"react-native": "src/index.ts",
+	"types": "src/index.ts",
+
+	"source": "src/index",
+	"files": [
+		"src",
+		"android",
+		"ios",
+		"react-native-native-select.podspec",
+		"!android/build",
+		"!ios/build",
+		"!tests",
+		"!**/__tests__",
+		"!**/__fixtures__",
+		"!**/__mocks__"
+	],
+	"keywords": ["react-native", "ios", "android", "picker", "dropdown", "select", "input select", "new architecture", "typescript", "native-module"],
+	"repository": "https://github.com/wneel/react-native-native-select",
+	"author": "Wayan NEEL <66263633+wneel@users.noreply.github.com> (https://github.com/wneel)",
+	"license": "MIT",
+	"bugs": {
+		"url": "https://github.com/wneel/react-native-native-select/issues"
+	},
+	"homepage": "https://github.com/wneel/react-native-native-select#readme",
+	"peerDependencies": {
+		"react": "*",
+		"react-native": ">=0.71.0"
+	},
+	"codegenConfig": {
+		"name": "RTNSelectSpec",
+		"type": "components",
+		"jsSrcsDir": "src",
+		"android": {
+			"javaPackageName": "com.rtnselect"
+		}
+	}
+}

package/react-native-native-select.podspec

@@ -0,0 +1,19 @@
+require "json"
+
+package = JSON.parse(File.read(File.join(__dir__, "package.json")))
+
+Pod::Spec.new do |s|
+	s.name            = "react-native-native-select"
+	s.version         = package["version"]
+	s.summary         = "A strictly native, performant Select component for React Native."
+	s.description     = package["description"]
+	s.homepage        = "https://github.com/wneel/react-native-native-select"
+	s.license         = package["license"]
+	s.platforms       = { :ios => "11.0" }
+	s.author          = package["author"]
+	s.source          = { :git => "https://github.com/wneel/react-native-native-select.git", :tag => "#{s.version}" }
+
+	s.source_files    = "ios/**/*.{h,m,mm,swift}"
+
+	install_modules_dependencies(s)
+end

package/src/RTNSelectNativeComponent.ts

@@ -0,0 +1,21 @@
+import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';
+
+import type { HostComponent } from 'react-native';
+import type { ViewProps } from 'react-native/Libraries/Components/View/ViewPropTypes';
+import type { Int32, DirectEventHandler, WithDefault } from 'react-native/Libraries/Types/CodegenTypes';
+
+type OnChangeEvent = Readonly<{
+	value: string;
+	index: Int32;
+}>;
+
+export interface NativeProps extends ViewProps {
+	options: ReadonlyArray<string>;
+	selectedIndex?: Int32;
+	mode?: WithDefault<'dialog' | 'dropdown', 'dialog'>;
+	onValueChange?: DirectEventHandler<OnChangeEvent>;
+}
+
+export default codegenNativeComponent<NativeProps>(
+	'RTNSelect'
+) as HostComponent<NativeProps>;

package/src/index.ts

@@ -0,0 +1,2 @@
+export { default as Select } from './RTNSelectNativeComponent';
+export * from './RTNSelectNativeComponent';