uilib-native 3.0.4 → 3.0.8

package/components/WheelPicker/WheelPickerItem.tsx

@@ -0,0 +1,21 @@
+import {Component} from 'react';
+
+type WheelPickerItemProps = {
+  /**
+   * the picker item value
+   */
+  value: string | number;
+  /**
+   * the picker item display label
+   */
+  label: string;
+};
+
+export default class WheelPickerItem extends Component<WheelPickerItemProps> {
+  static displayName = 'WheelPicker.Item';
+
+  render() {
+    // These items don't get rendered directly.
+    return null;
+  }
+}

package/components/WheelPicker/{index.js → index.tsx}

@@ -1,70 +1,87 @@
 import _ from 'lodash';
-import PropTypes from 'prop-types';
 import React, {Component} from 'react';
-import {DeviceEventEmitter, requireNativeComponent, StyleSheet, View} from 'react-native';
-import {Picker} from '@react-native-community/picker';
+import {DeviceEventEmitter, requireNativeComponent, StyleSheet, View, ViewStyle, TextStyle} from 'react-native';
+
 import WheelPickerItem from './WheelPickerItem';
-import {Constants} from '../../../src/helpers';
+import {Constants} from '../../../src/commons/new';
+import {LogService} from '../../../src/services';
 import {Typography, Colors} from '../../../src/style';
 
-const WheelPickerNative = requireNativeComponent('WheelPicker', null);
+import {PickerPackage, CommunityPickerPackage} from '../../../src/optionalDependencies';
+const Picker = PickerPackage?.Picker || CommunityPickerPackage?.Picker || (() => null);
 
-class WheelPicker extends Component {
-  static displayName = 'WheelPicker';
+if (!PickerPackage) {
+  if (CommunityPickerPackage) {
+    console.warn(`RNUILib Picker will soon migrate to use "@react-native-picker/picker" package instead of '@react-native-community/picker'`);
+  } else {
+    console.error(`RNUILib Picker requires installing "@react-native-picker/picker" dependency`);
+  }
+}
 
-  static propTypes = {
-    /**
+const WheelPickerNative = requireNativeComponent('WheelPicker');
+
+export type WheelPickerProps = {
+   /**
      * the current selected value of the picker
      */
-    selectedValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), //eslint-disable-line
+    selectedValue?: string | number; 
     /**
      * callback for when a value change
      */
-    onValueChange: PropTypes.func,
+    onValueChange?: (value: string | number, index: number) => void;
     /**
      * pass custom style
      */
-    style: PropTypes.oneOfType([PropTypes.object, PropTypes.number]),
+    style?: ViewStyle;
     /**
      * pass custom label style: fontSize, fontFamily, color<br>
      * Note: label's color will override the text color (hex only)
      */
-    labelStyle: PropTypes.oneOfType([PropTypes.object, PropTypes.number]),
+    labelStyle?: TextStyle;
     /**
      * The height of the selected item
      */
-    itemHeight: PropTypes.number,
+    itemHeight?: number;
     /**
      * The color of the wheel picker (hex only)
      */
-    color: PropTypes.string,
+    color?: string; 
     /**
      * pass custom style for the picker item
      */
-    itemStyle: PropTypes.oneOfType([PropTypes.object, PropTypes.number]), //eslint-disable-line
-  };
+    itemStyle?: ViewStyle;
+    children?: JSX.Element | JSX.Element[];
+}
+
+class WheelPicker extends Component<WheelPickerProps> {
+  static displayName = 'WheelPicker';
 
   static defaultProps = {
-    labelStyle: {fontSize: Typography.text70.fontSize, fontFamily: Typography.text70.fontFamily},
-    color: Colors.blue30
+    labelStyle: {fontSize: Typography.text70?.fontSize, fontFamily: Typography.text70?.fontFamily},
+    color: Colors.primary
   };
 
-  constructor(props) {
+  static Item: typeof WheelPickerItem;
+  
+  constructor(props: WheelPickerProps) {
     super(props);
     this.onValueChange = this.onValueChange.bind(this); //eslint-disable-line
     this.getItems();
     DeviceEventEmitter.addListener('log', this.onLogReceived); // TODO: consider moving to a more generic place (base class?)
+
+    LogService.componentDeprecationWarn({oldComponent: 'WheelPicker', newComponent: 'Incubator.WheelPicker'});
   }
 
   state = {
-    items: this.getItems(),
+    items: this.getItems()
   };
 
-  onLogReceived = (event) => {
+  onLogReceived = (event: any) => {
+    // @ts-expect-error
     console[event.LogType](event.TAG, event.text);
-  }
+  };
 
-  onValueChange(event) {
+  onValueChange(event: any) {
     const index = event.nativeEvent.itemIndex;
     const {onValueChange} = this.props;
     if (onValueChange) {
@@ -74,9 +91,13 @@ class WheelPicker extends Component {
   }
 
   getItems() {
-    const items = _.map(React.Children.toArray(this.props.children), child => ({
+    const {children} = this.props;
+      
+    const items = _.map(React.Children.toArray(children), child => ({
+      //@ts-expect-error
       value: child.props.value,
-      label: child.props.label,
+      //@ts-expect-error
+      label: child.props.label
     }));
     return items;
   }
@@ -93,37 +114,36 @@ class WheelPicker extends Component {
 
   render() {
     const {style, color, labelStyle, itemHeight} = this.props;
-    const {fontSize, fontFamily} = labelStyle;
-    let {color: labelColor} = labelStyle;
 
     return (
-      <View collapsable={false} style={styles.container} >
+      <View collapsable={false} style={styles.container}>
         <WheelPickerNative
+          // @ts-expect-error
           data={this.extractLabelsFromItems()}
           initialIndex={this.getInitialIndex()}
           onChange={this.onValueChange}
           style={[styles.wheelPicker, style]}
           color={color}
-          labelColor={labelColor || color}
-          fontSize={fontSize}
+          labelColor={labelStyle?.color || color}
+          fontSize={labelStyle?.fontSize}
           itemHeight={itemHeight}
-          fontFamily={fontFamily}
+          fontFamily={labelStyle?.fontFamily}
         />
       </View>
     );
   }
 }
 
+WheelPicker.Item = WheelPickerItem;
+
 const styles = StyleSheet.create({
   container: {
-    overflow: 'hidden',
+    overflow: 'hidden'
   },
   wheelPicker: {
     width: 200,
-    height: 200,
-  },
+    height: 200
+  }
 });
 
-WheelPicker.Item = WheelPickerItem;
-
-export default (Constants.isAndroid ? WheelPicker : Picker);
+export default Constants.isAndroid ? WheelPicker : Picker;

package/components/index.ts

@@ -0,0 +1,16 @@
+import HighlighterOverlayView from './HighlighterOverlayView';
+import SafeAreaSpacerView from './SafeArea/SafeAreaSpacerView';
+import WheelPicker, {WheelPickerProps} from './WheelPicker';
+import SafeAreaInsetsManager from './SafeArea/SafeAreaInsetsManager';
+import Keyboard, {KeyboardTrackingViewProps, KeyboardAccessoryViewProps} from './Keyboard';
+
+export {
+  HighlighterOverlayView,
+  SafeAreaSpacerView,
+  WheelPicker,
+  WheelPickerProps,
+  SafeAreaInsetsManager,
+  Keyboard,
+  KeyboardTrackingViewProps,
+  KeyboardAccessoryViewProps
+};

package/ios/reactnativeuilib/keyboardtrackingview/KeyboardTrackingViewTempManager.m

@@ -50,6 +50,9 @@ typedef NS_ENUM(NSUInteger, KeyboardTrackingScrollBehavior) {
 @property (nonatomic) CGFloat originalHeight;
 @property (nonatomic) KeyboardTrackingScrollBehavior scrollBehavior;
 @property (nonatomic) BOOL addBottomView;
+@property (nonatomic, strong) UIColor *bottomViewColor;
+@property (nonatomic) BOOL useSafeArea;
+@property (nonatomic) BOOL usesBottomTabs;
 @property (nonatomic) BOOL scrollToFocusedInput;
 @property (nonatomic) BOOL allowHitsOutsideBounds;
 
@@ -80,7 +83,9 @@ typedef NS_ENUM(NSUInteger, KeyboardTrackingScrollBehavior) {
         _bottomViewHeight = kBottomViewHeightTemp;
         
         self.addBottomView = NO;
+        self.bottomViewColor = [UIColor whiteColor];
         self.scrollToFocusedInput = NO;
+        self.usesBottomTabs = NO;
         
         [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(rctContentDidAppearNotification:) name:RCTContentDidAppearNotification object:nil];
     }
@@ -440,15 +445,26 @@ typedef NS_ENUM(NSUInteger, KeyboardTrackingScrollBehavior) {
 -(void)setAddBottomView:(BOOL)addBottomView
 {
     _addBottomView = addBottomView;
+    
     [self addBottomViewIfNecessary];
 }
 
+-(void)setBottomViewColor:(UIColor *)bottomViewColor
+{
+    _bottomViewColor = bottomViewColor;
+
+    if (self.addBottomView && _bottomView != nil) {
+        _bottomView.backgroundColor = _bottomViewColor;
+    }
+}
+
 -(void)addBottomViewIfNecessary
 {
     if (self.addBottomView && _bottomView == nil)
     {
         _bottomView = [UIView new];
-        _bottomView.backgroundColor = [UIColor whiteColor];
+        _bottomView.backgroundColor = self.bottomViewColor;
+        
         [self addSubview:_bottomView];
         [self updateBottomViewFrame];
     }
@@ -483,7 +499,7 @@ typedef NS_ENUM(NSUInteger, KeyboardTrackingScrollBehavior) {
 {
     CGFloat bottomSafeArea = 0;
 #if __IPHONE_OS_VERSION_MAX_ALLOWED > __IPHONE_10_3
-    if (@available(iOS 11.0, *)) {
+    if (@available(iOS 11.0, *) && self.useSafeArea) {
         bottomSafeArea = self.superview ? self.superview.safeAreaInsets.bottom : self.safeAreaInsets.bottom;
     }
 #endif
@@ -502,12 +518,30 @@ typedef NS_ENUM(NSUInteger, KeyboardTrackingScrollBehavior) {
     });
 }
 
+#pragma mark - TabBarController
+
+-(CGFloat)getTabBarHeight
+{
+    if (@available(iOS 11.0, *)) {
+        if (self.usesBottomTabs == YES)
+        {
+            UITabBarController *tabBarController = [UITabBarController new];
+            CGFloat tabBarHeight = tabBarController.tabBar.frame.size.height;
+            UIWindow *window = UIApplication.sharedApplication.windows.firstObject;
+            CGFloat bottomPadding = window.safeAreaInsets.bottom;
+            return tabBarHeight + bottomPadding;
+        }
+    }
+    return 0;
+}
+
 #pragma mark - ObservingInputAccessoryViewTempDelegate methods
 
 -(void)updateTransformAndInsets
 {
     CGFloat bottomSafeArea = [self getBottomSafeArea];
-    CGFloat accessoryTranslation = MIN(-bottomSafeArea, -_ObservingInputAccessoryViewTemp.keyboardHeight);
+    CGFloat tabBarHeight = [self getTabBarHeight];
+    CGFloat accessoryTranslation = MIN(-bottomSafeArea, -_ObservingInputAccessoryViewTemp.keyboardHeight + tabBarHeight);
     
     if (_ObservingInputAccessoryViewTemp.keyboardHeight <= bottomSafeArea) {
         _bottomViewHeight = kBottomViewHeightTemp;
@@ -632,6 +666,9 @@ RCT_REMAP_VIEW_PROPERTY(revealKeyboardInteractive, revealKeyboardInteractive, BO
 RCT_REMAP_VIEW_PROPERTY(manageScrollView, manageScrollView, BOOL)
 RCT_REMAP_VIEW_PROPERTY(requiresSameParentToManageScrollView, requiresSameParentToManageScrollView, BOOL)
 RCT_REMAP_VIEW_PROPERTY(addBottomView, addBottomView, BOOL)
+RCT_REMAP_VIEW_PROPERTY(bottomViewColor, bottomViewColor, UIColor)
+RCT_REMAP_VIEW_PROPERTY(useSafeArea, useSafeArea, BOOL)
+RCT_REMAP_VIEW_PROPERTY(usesBottomTabs, usesBottomTabs, BOOL)
 RCT_REMAP_VIEW_PROPERTY(scrollToFocusedInput, scrollToFocusedInput, BOOL)
 RCT_REMAP_VIEW_PROPERTY(allowHitsOutsideBounds, allowHitsOutsideBounds, BOOL)
 

package/ios/reactnativeuilib.xcodeproj/xcuserdata/{michaelle.xcuserdatad → inbalti.xcuserdatad}/xcschemes/xcschememanagement.plist

@@ -4,11 +4,6 @@
 <dict>
 	<key>SchemeUserState</key>
 	<dict>
-		<key>reactnativeuilib.xcscheme</key>
-		<dict>
-			<key>orderHint</key>
-			<integer>6</integer>
-		</dict>
 		<key>reactnativeuilib.xcscheme_^#shared#^_</key>
 		<dict>
 			<key>orderHint</key>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "uilib-native",
-  "version": "3.0.4",
+  "version": "3.0.8",
   "homepage": "https://github.com/wix/react-native-ui-lib",
   "description": "uilib native components (separated from js components)",
   "main": "components/index.js",

package/android/.idea/codeStyles/Project.xml

@@ -1,116 +0,0 @@
-<component name="ProjectCodeStyleConfiguration">
-  <code_scheme name="Project" version="173">
-    <codeStyleSettings language="XML">
-      <indentOptions>
-        <option name="CONTINUATION_INDENT_SIZE" value="4" />
-      </indentOptions>
-      <arrangement>
-        <rules>
-          <section>
-            <rule>
-              <match>
-                <AND>
-                  <NAME>xmlns:android</NAME>
-                  <XML_ATTRIBUTE />
-                  <XML_NAMESPACE>^$</XML_NAMESPACE>
-                </AND>
-              </match>
-            </rule>
-          </section>
-          <section>
-            <rule>
-              <match>
-                <AND>
-                  <NAME>xmlns:.*</NAME>
-                  <XML_ATTRIBUTE />
-                  <XML_NAMESPACE>^$</XML_NAMESPACE>
-                </AND>
-              </match>
-              <order>BY_NAME</order>
-            </rule>
-          </section>
-          <section>
-            <rule>
-              <match>
-                <AND>
-                  <NAME>.*:id</NAME>
-                  <XML_ATTRIBUTE />
-                  <XML_NAMESPACE>http://schemas.android.com/apk/res/android</XML_NAMESPACE>
-                </AND>
-              </match>
-            </rule>
-          </section>
-          <section>
-            <rule>
-              <match>
-                <AND>
-                  <NAME>.*:name</NAME>
-                  <XML_ATTRIBUTE />
-                  <XML_NAMESPACE>http://schemas.android.com/apk/res/android</XML_NAMESPACE>
-                </AND>
-              </match>
-            </rule>
-          </section>
-          <section>
-            <rule>
-              <match>
-                <AND>
-                  <NAME>name</NAME>
-                  <XML_ATTRIBUTE />
-                  <XML_NAMESPACE>^$</XML_NAMESPACE>
-                </AND>
-              </match>
-            </rule>
-          </section>
-          <section>
-            <rule>
-              <match>
-                <AND>
-                  <NAME>style</NAME>
-                  <XML_ATTRIBUTE />
-                  <XML_NAMESPACE>^$</XML_NAMESPACE>
-                </AND>
-              </match>
-            </rule>
-          </section>
-          <section>
-            <rule>
-              <match>
-                <AND>
-                  <NAME>.*</NAME>
-                  <XML_ATTRIBUTE />
-                  <XML_NAMESPACE>^$</XML_NAMESPACE>
-                </AND>
-              </match>
-              <order>BY_NAME</order>
-            </rule>
-          </section>
-          <section>
-            <rule>
-              <match>
-                <AND>
-                  <NAME>.*</NAME>
-                  <XML_ATTRIBUTE />
-                  <XML_NAMESPACE>http://schemas.android.com/apk/res/android</XML_NAMESPACE>
-                </AND>
-              </match>
-              <order>ANDROID_ATTRIBUTE_ORDER</order>
-            </rule>
-          </section>
-          <section>
-            <rule>
-              <match>
-                <AND>
-                  <NAME>.*</NAME>
-                  <XML_ATTRIBUTE />
-                  <XML_NAMESPACE>.*</XML_NAMESPACE>
-                </AND>
-              </match>
-              <order>BY_NAME</order>
-            </rule>
-          </section>
-        </rules>
-      </arrangement>
-    </codeStyleSettings>
-  </code_scheme>
-</component>

package/android/.idea/encodings.xml

@@ -1,4 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="Encoding" addBOMForNewFiles="with NO BOM" />
-</project>

package/android/.idea/gradle.xml

@@ -1,12 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="GradleSettings">
-    <option name="linkedExternalProjectsSettings">
-      <GradleProjectSettings>
-        <option name="distributionType" value="DEFAULT_WRAPPED" />
-        <option name="externalProjectPath" value="$PROJECT_DIR$" />
-        <option name="resolveModulePerSourceSet" value="false" />
-      </GradleProjectSettings>
-    </option>
-  </component>
-</project>

package/android/.idea/misc.xml

@@ -1,9 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="ProjectRootManager">
-    <output url="file://$PROJECT_DIR$/build/classes" />
-  </component>
-  <component name="ProjectType">
-    <option name="id" value="Android" />
-  </component>
-</project>

package/android/.idea/modules.xml

@@ -1,8 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="ProjectModuleManager">
-    <modules>
-      <module fileurl="file://$PROJECT_DIR$/android.iml" filepath="$PROJECT_DIR$/android.iml" />
-    </modules>
-  </component>
-</project>

package/android/.idea/runConfigurations.xml

@@ -1,12 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="RunConfigurationProducerService">
-    <option name="ignoredProducers">
-      <set>
-        <option value="org.jetbrains.plugins.gradle.execution.test.runner.AllInPackageGradleConfigurationProducer" />
-        <option value="org.jetbrains.plugins.gradle.execution.test.runner.TestClassGradleConfigurationProducer" />
-        <option value="org.jetbrains.plugins.gradle.execution.test.runner.TestMethodGradleConfigurationProducer" />
-      </set>
-    </option>
-  </component>
-</project>

package/android/.idea/vcs.xml

@@ -1,6 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="VcsDirectoryMappings">
-    <mapping directory="$PROJECT_DIR$/../.." vcs="Git" />
-  </component>
-</project>