From 76eecd84a3b4c9de7462ab49d8d655f9af19fa4c Mon Sep 17 00:00:00 2001
From: Lidor Dafna <lidord@wix.com>
Date: Wed, 16 Mar 2022 18:13:46 +0200
Subject: [PATCH] add separatorsStyle prop to WheelPicker

---
 generatedTypes/src/incubator/WheelPicker/index.d.ts | 6 +++++-
 src/incubator/WheelPicker/index.tsx                 | 7 ++++++-
 src/incubator/WheelPicker/wheelPicker.api.json      | 3 ++-
 3 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/generatedTypes/src/incubator/WheelPicker/index.d.ts b/generatedTypes/src/incubator/WheelPicker/index.d.ts
index 12a07f1204..2d1c23a3c1 100644
--- a/generatedTypes/src/incubator/WheelPicker/index.d.ts
+++ b/generatedTypes/src/incubator/WheelPicker/index.d.ts
@@ -62,12 +62,16 @@ export interface WheelPickerProps {
      * Align the content to center, right ot left (default: center)
      */
     align?: WheelPickerAlign;
+    /**
+     * Extra style for the separators
+     */
+    separatorsStyle?: ViewStyle;
     testID?: string;
 }
 declare const _default: React.ComponentClass<WheelPickerProps & {
     useCustomTheme?: boolean | undefined;
 }, any> & {
-    ({ items: propItems, itemHeight, numberOfVisibleRows, activeTextColor, inactiveTextColor, textStyle, label, labelStyle, labelProps, onChange, align, style, children, initialValue, testID }: WheelPickerProps): JSX.Element;
+    ({ items: propItems, itemHeight, numberOfVisibleRows, activeTextColor, inactiveTextColor, textStyle, label, labelStyle, labelProps, onChange, align, style, children, initialValue, separatorsStyle, testID }: WheelPickerProps): JSX.Element;
     alignments: typeof WheelPickerAlign;
     displayName: string;
 };
diff --git a/src/incubator/WheelPicker/index.tsx b/src/incubator/WheelPicker/index.tsx
index 0f379de653..44ea1c695a 100644
--- a/src/incubator/WheelPicker/index.tsx
+++ b/src/incubator/WheelPicker/index.tsx
@@ -73,6 +73,10 @@ export interface WheelPickerProps {
    * Align the content to center, right ot left (default: center)
    */
   align?: WheelPickerAlign;
+  /**
+   * Extra style for the separators
+   */
+  separatorsStyle?: ViewStyle;
   testID?: string;
 }
 
@@ -91,6 +95,7 @@ const WheelPicker = ({
   style,
   children,
   initialValue = 0,
+  separatorsStyle,
   testID
 }: WheelPickerProps) => {
   const scrollView = useRef<Animated.ScrollView>();
@@ -244,7 +249,7 @@ const WheelPicker = ({
   const separators = useMemo(() => {
     return (
       <View absF centerV pointerEvents="none">
-        <View style={styles.separators}/>
+        <View style={[styles.separators, separatorsStyle]}/>
       </View>
     );
   }, []);
diff --git a/src/incubator/WheelPicker/wheelPicker.api.json b/src/incubator/WheelPicker/wheelPicker.api.json
index 5e211f1d7a..bcd8c82d1e 100644
--- a/src/incubator/WheelPicker/wheelPicker.api.json
+++ b/src/incubator/WheelPicker/wheelPicker.api.json
@@ -32,7 +32,8 @@
       "description": "Align the content to center, right ot left",
       "default": "center"
     },
-    {"name": "testID", "type": "string", "description": "Align the content to center, right ot left"}
+    {"name": "separatorsStyle", "type": "ViewStyle", "description": "Extra style for the separators"},
+    {"name": "testID", "type": "string", "description": "test identifier"}
   ],
   "snippet": [
     "<WheelPicker",