react-native-native-select 1.0.2 → 1.1.1

package/LICENSE

@@ -0,0 +1,20 @@
+MIT License
+
+Copyright (c) 2026 Wayan NEEL
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,5 +1,18 @@
 # react-native-native-select
 
+<p>
+	<a href="https://github.com/wneel/react-native-native-select/blob/HEAD/LICENSE">
+		<img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="React Native Wheel Picker is released under the MIT license." />
+	</a>
+	<a href="https://www.npmjs.com/package/wneel/react-native-native-select">
+		<img src="https://img.shields.io/npm/v/react-native-native-select?color=brightgreen&label=npm%20package" alt="Current npm package version." />
+	</a>
+	<a href="https://www.npmjs.com/package/wneel/react-native-native-select">
+		<img src="https://img.shields.io/npm/dm/react-native-native-select" alt="Number of downloads per week." />
+	</a>
+</p>
+
+
 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.
@@ -8,7 +21,7 @@ It leverages actual OS primitives: `UIMenu` (iOS 14+), `UIPickerView` (iOS Wheel
 
 | iOS (Dropdown Mode) | iOS (Dialog/Wheel Mode) | Android |
 |:---:|:---:|:---:|
-| ![react-native-native-select-dropdown](https://github.com/user-attachments/assets/8a65c76b-f0a8-4f89-88d3-49000abe354d) | ![react-native-native-select-wheel](https://github.com/user-attachments/assets/71d98f6c-984a-49e8-bc98-abbfb86de535) | ![react-native-native-select-android](https://github.com/user-attachments/assets/5936637a-e63a-445c-9c9f-3a05940b6f9e) |
+| <img src="https://github.com/user-attachments/assets/8a65c76b-f0a8-4f89-88d3-49000abe354d" height="300" /> | <img src="https://github.com/user-attachments/assets/71d98f6c-984a-49e8-bc98-abbfb86de535" height="300" /> | <img src="https://github.com/user-attachments/assets/5936637a-e63a-445c-9c9f-3a05940b6f9e" height="300" /> |
 | *Native UIMenu (iOS 14+)* | *Classic UIPickerView* | *Native AppCompatSpinner* |
 
 ## Why this library?
@@ -97,6 +110,7 @@ Please take a look at this [Android example usage](./tests/android_demo.tsx) bec
 | **`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.* |
+| **`textColor`** | `ColorValue` | No | **iOS only.** Custom text color for the picker. Overrides the system's default Light/Dark mode colors. Accepts any standard React Native color format (e.g., `'#FF0000'`, `'red'`, `'rgba(0,0,0,0.5)'`). |
 | **`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. |
 

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

@@ -79,5 +79,12 @@ public class SelectViewManager extends SimpleViewManager<SelectView>
 	@ReactProp(name = "mode")
 	public void setMode(SelectView view, @Nullable String value) {}
 
+	@Override
+	@ReactProp(name = "textColor", customType = "Color")
+	public void setTextColor(SelectView view, @Nullable Integer value) {
+		// iOS-only feature: we don't do anything on Android,
+ 		// but the method must exist to satisfy the interface generated by TypeScript.
+	}
+
 	public void setOnValueChange(SelectView view, @Nullable Object value) {}
 }

package/ios/RTNSelect.mm

@@ -1,5 +1,6 @@
 #import "RTNSelect.h"
 #import <React/RCTComponent.h>
+#import <React/RCTConversions.h>
 
 #import <react/renderer/components/RTNSelectSpec/ComponentDescriptors.h>
 #import <react/renderer/components/RTNSelectSpec/EventEmitters.h>
@@ -39,13 +40,10 @@ using namespace facebook::react;
 		_pickerView.delegate = self;
 		_pickerView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
 
-		_button = [UIButton buttonWithType:UIButtonTypeSystem];
+		_button = [UIButton buttonWithType:UIButtonTypeCustom];
 		_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;
@@ -55,6 +53,8 @@ using namespace facebook::react;
 
 		[self addSubview:_pickerView];
 		[self addSubview:_button];
+
+		[self applyTextColor:nil];
 	}
 
 	return self;
@@ -67,7 +67,22 @@ using namespace facebook::react;
 }
 
 // ============================================================================
-// Gestion du Menu Flottant (Dropdown)
+// Core Text Color Logic (KVC)
+// ============================================================================
+
+- (void)applyTextColor:(UIColor *)color {
+	UIColor *resolvedColor = color ?: [UIColor labelColor];
+
+	[_pickerView setValue:resolvedColor forKey:@"textColor"];
+
+	[_button setTitleColor:resolvedColor forState:UIControlStateNormal];
+
+	[_pickerView reloadAllComponents];
+	[self updateButtonMenu];
+}
+
+// ============================================================================
+// Managing the Dropdown Menu
 // ============================================================================
 
 - (void)updateButtonMenu {
@@ -96,7 +111,7 @@ using namespace facebook::react;
 }
 
 // ============================================================================
-// Méthode unifiée de sélection (appelée par Picker ou Dropdown)
+// Unified selection method (Picker or Dropdown)
 // ============================================================================
 
 - (void)selectIndex:(NSInteger)index fromSource:(NSString *)source {
@@ -139,6 +154,7 @@ using namespace facebook::react;
 	bool optionsChanged = oldViewProps.options != newViewProps.options;
 	bool indexChanged = oldViewProps.selectedIndex != newViewProps.selectedIndex;
 	bool modeChanged = oldViewProps.mode != newViewProps.mode;
+	bool textColorChanged = oldViewProps.textColor != newViewProps.textColor;
 
 	if (optionsChanged) {
 		_options = newViewProps.options;
@@ -151,6 +167,11 @@ using namespace facebook::react;
 	[super updateProps:props oldProps:oldProps];
 
 	dispatch_async(dispatch_get_main_queue(), ^{
+		if (textColorChanged) {
+			UIColor *newColor = RCTUIColorFromSharedColor(newViewProps.textColor);
+			[self applyTextColor:newColor];
+		}
+
 		if (optionsChanged) {
 			[self->_pickerView reloadAllComponents];
 			[self updateButtonMenu];
@@ -210,6 +231,12 @@ using namespace facebook::react;
 	});
 }
 
+- (void)setTextColor:(UIColor *)color {
+	dispatch_async(dispatch_get_main_queue(), ^{
+		[self applyTextColor:color];
+	});
+}
+
 - (void)setOnValueChange:(RCTDirectEventBlock)onValueChange {
 	_onValueChangeLegacy = onValueChange;
 }

package/ios/RTNSelectManager.mm

@@ -17,6 +17,7 @@ RCT_EXPORT_MODULE(RTNSelect)
 RCT_EXPORT_VIEW_PROPERTY(options, NSArray)
 RCT_EXPORT_VIEW_PROPERTY(selectedIndex, NSInteger)
 RCT_EXPORT_VIEW_PROPERTY(mode, NSString)
+RCT_EXPORT_VIEW_PROPERTY(textColor, UIColor)
 RCT_EXPORT_VIEW_PROPERTY(onValueChange, RCTDirectEventBlock)
 
 @end

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "react-native-native-select",
-	"version": "1.0.2",
+	"version": "1.1.1",
 	"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",
@@ -34,6 +34,10 @@
 		"type": "git",
 		"url": "git+https://github.com/wneel/react-native-native-select.git"
 	},
+	"publishConfig": {
+		"access": "public",
+		"registry": "https://registry.npmjs.org/"
+	},
 	"author": "Wayan NEEL <66263633+wneel@users.noreply.github.com> (https://github.com/wneel)",
 	"license": "MIT",
 	"bugs": {

package/src/RTNSelectNativeComponent.ts

@@ -1,6 +1,6 @@
 import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';
 
-import type { HostComponent } from 'react-native';
+import type { ColorValue, 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';
 
@@ -12,7 +12,8 @@ type OnChangeEvent = Readonly<{
 export interface NativeProps extends ViewProps {
 	options: ReadonlyArray<string>;
 	selectedIndex?: Int32;
-	mode?: WithDefault<'dialog' | 'dropdown', 'dialog'>;
+	mode?: WithDefault<'dialog' | 'dropdown', 'dialog'>; // iOS only
+	textColor?: ColorValue; // iOS only
 	onValueChange?: DirectEventHandler<OnChangeEvent>;
 }