Feat/incubator.toast optional icon

lib/components/Keyboard/KeyboardInput/CustomKeyboardView/index.web.tsx

@@ -1,11 +1,6 @@
-import React from 'react';
-
 console.log('keyboard is not supported on web');
 const CustomKeyboardView = () => {
-
-  return (
-    null
-  );
+  return null;
 };
 
 export default CustomKeyboardView;

lib/components/Keyboard/KeyboardTracking/KeyboardTrackingView/index.web.tsx

@@ -1,9 +1,6 @@
-import React from 'react';
-
 console.log('KeyboardTrackingView not supported on web');
 const KeyboardTrackingView = () => {
-  return (null
-  );
+  return null;
 };
 
 export default KeyboardTrackingView;

src/components/KeyboardAwareScrollView/KeyboardAwareListView.js

@@ -17,9 +17,7 @@ export default class KeyboardAwareListView extends KeyboardAwareBase {
 
   constructor(props) {
     super(props);
-    LogService.warn(
-      'RNUILib: Please stop Using KeyboardAwareListView, use either KeyboardAwareScrollView or KeyboardAwareFlatList'
-    );
+    LogService.warn('RNUILib: Please stop Using KeyboardAwareListView, use either KeyboardAwareScrollView or KeyboardAwareFlatList');
   }
 
   render() {

src/components/carousel/index.tsx

@@ -239,10 +239,8 @@ class Carousel extends Component<CarouselProps, CarouselState> {
     if (containerWidth) {
       const spacings = pageWidth === containerWidth ? 0 : this.getItemSpacings(this.props);
       const initialBreak = pageWidth - (containerWidth - pageWidth - spacings) / 2;
-      const snapToOffsets = _.times(
-        presenter.getChildrenLength(this.props),
-        index => initialBreak + index * pageWidth + this.getContainerMarginHorizontal()
-      );
+      const snapToOffsets = _.times(presenter.getChildrenLength(this.props),
+        index => initialBreak + index * pageWidth + this.getContainerMarginHorizontal());
       return snapToOffsets;
     }
   };

src/components/chipsInput/Presenter.ts

@@ -23,11 +23,9 @@ export const getCounterText = (count: number, maxLength: number) => {
   return `${Math.min(count, maxLength)} / ${maxLength}`;
 };
 
-export const getChipDismissColor = (
-  chip: ChipsInputChipProps,
+export const getChipDismissColor = (chip: ChipsInputChipProps,
   isSelected: boolean,
-  defaultChipProps?: ChipsInputChipProps
-) => {
+  defaultChipProps?: ChipsInputChipProps) => {
   const dismissColor = defaultChipProps?.dismissColor || Colors.white;
   return !chip.invalid ? dismissColor : isSelected ? Colors.red10 : Colors.red30;
 };

src/components/featureHighlight/index.tsx

@@ -223,8 +223,7 @@ class FeatureHighlight extends Component<FeatureHighlightProps, State> {
         toValue, // Animate to value
         duration: toValue ? 100 : 0, // Make it take a while
         useNativeDriver: true
-      }
-    ).start(); // Starts the animation
+      }).start(); // Starts the animation
   }
 
   setTargetPosition(props = this.props) {
@@ -260,9 +259,7 @@ class FeatureHighlight extends Component<FeatureHighlightProps, State> {
       topPosition = isUnderMin ? topPosition + innerPadding : targetCenter + minRectHeight / 2 + innerPadding / 2;
     }
     if (topPosition < 0 || topPosition + this.contentHeight > Constants.screenHeight) {
-      console.warn(
-        `Content is too long and might appear off screen. Please adjust the message length for better results.`
-      );
+      console.warn(`Content is too long and might appear off screen. Please adjust the message length for better results.`);
     }
     return topPosition;
   }

src/components/pageControl/index.tsx

@@ -114,14 +114,12 @@ class PageControl extends PureComponent<PageControlProps, State> {
 
     if (Array.isArray(props.size)) {
       if (props.size[0] >= props.size[1] || props.size[1] >= props.size[2]) {
-        console.warn(
-          'It is recommended that largeSize > mediumSize > smallSize, currently: smallSize=',
+        console.warn('It is recommended that largeSize > mediumSize > smallSize, currently: smallSize=',
           props.size[0],
           'mediumSize=',
           props.size[1],
           'largeSize=',
-          props.size[2]
-        );
+          props.size[2]);
       }
     }
   }

src/components/panningViews/panListenerView.tsx

@@ -134,13 +134,11 @@ class PanListenerView extends PureComponent<Props> {
     const {dy, dx} = gestureState;
     const {directions, panSensitivity = DEFAULT_PAN_SENSITIVITY} = this.props;
 
-    return Boolean(
-      directions &&
+    return Boolean(directions &&
       ((directions.includes(PanningProvider.Directions.UP) && dy < -panSensitivity) ||
         (directions.includes(PanningProvider.Directions.DOWN) && dy > panSensitivity) ||
         (directions.includes(PanningProvider.Directions.LEFT) && dx < -panSensitivity) ||
-        (directions.includes(PanningProvider.Directions.RIGHT) && dx > panSensitivity))
-    );
+        (directions.includes(PanningProvider.Directions.RIGHT) && dx > panSensitivity)));
   };
 
   handlePanStart = () => {

src/incubator/TextField/withFieldState.tsx

@@ -31,11 +31,9 @@ export interface FieldStateProps extends TextInputProps {
   validate?: Validator | Validator[];
 }
 
-function withFieldState(
-  WrappedComponent: React.ComponentType<
+function withFieldState(WrappedComponent: React.ComponentType<
     FieldStateInjectedProps & TextInputProps
-  >
-) {
+  >) {
   const WithFieldState = ({
     validate,
     validateOnBlur,
@@ -53,52 +51,44 @@ function withFieldState(
       }
     }, []);
 
-    const validateField = useCallback(
-      (valueToValidate = value) => {
-        let _isValid = true;
-        if (_.isFunction(validate)) {
-          _isValid = validate(valueToValidate);
-        } else if (_.isString(validate)) {
-          _isValid = validators[validate]?.(valueToValidate);
-        }
-
-        setIsValid(_isValid);
-      },
-      [value]
-    );
-
-    const onFocus = useCallback(
-      (...args: any) => {
-        setIsFocused(true);
-        //@ts-expect-error
-        props.onFocus?.(...args);
-      },
-      [props.onFocus]
-    );
+    const validateField = useCallback((valueToValidate = value) => {
+      let _isValid = true;
+      if (_.isFunction(validate)) {
+        _isValid = validate(valueToValidate);
+      } else if (_.isString(validate)) {
+        _isValid = validators[validate]?.(valueToValidate);
+      }
 
-    const onBlur = useCallback(
-      (...args: any) => {
-        setIsFocused(false);
-        //@ts-expect-error
-        props.onBlur?.(...args);
-        if (validateOnBlur) {
-          validateField();
-        }
-      },
-      [props.onBlur, validateOnBlur, validateField]
-    );
+      setIsValid(_isValid);
+    },
+    [value]);
+
+    const onFocus = useCallback((...args: any) => {
+      setIsFocused(true);
+      //@ts-expect-error
+      props.onFocus?.(...args);
+    },
+    [props.onFocus]);
+
+    const onBlur = useCallback((...args: any) => {
+      setIsFocused(false);
+      //@ts-expect-error
+      props.onBlur?.(...args);
+      if (validateOnBlur) {
+        validateField();
+      }
+    },
+    [props.onBlur, validateOnBlur, validateField]);
 
-    const onChangeText = useCallback(
-      (text: string) => {
-        setValue(text);
-        props.onChangeText?.(text);
+    const onChangeText = useCallback((text: string) => {
+      setValue(text);
+      props.onChangeText?.(text);
 
-        if (validateOnChange) {
-          validateField(text);
-        }
-      },
-      [props.onChangeText, validateOnChange]
-    );
+      if (validateOnChange) {
+        validateField(text);
+      }
+    },
+    [props.onChangeText, validateOnChange]);
 
     const fieldState = useMemo(() => {
       return {value, hasValue: !_.isEmpty(value), isValid, isFocused};

src/incubator/toast/index.tsx

@@ -1,5 +1,12 @@
 import React, {PropsWithChildren, useCallback, useEffect, useMemo, useRef, useState} from 'react';
-import {ActivityIndicator, StyleSheet, findNodeHandle, AccessibilityInfo, ViewStyle, LayoutChangeEvent} from 'react-native';
+import {
+  ActivityIndicator,
+  StyleSheet,
+  findNodeHandle,
+  AccessibilityInfo,
+  ViewStyle,
+  LayoutChangeEvent
+} from 'react-native';
 import _ from 'lodash';
 import {Constants, asBaseComponent} from '../../commons/new';
 import {useDidUpdate} from '../../hooks';
@@ -169,6 +176,10 @@ const Toast = (props: PropsWithChildren<ToastProps>) => {
   };
 
   const renderIcon = () => {
+    if (!icon) {
+      return null;
+    }
+
     return (
       <Icon source={toastPreset.icon} resizeMode={'contain'} style={styles.icon} tintColor={toastPreset.iconColor}/>
     );