react-native-ui-lib 7.44.0-snapshot.7216 → 7.44.0-snapshot.7227

package/babel.config.js

@@ -1,17 +1,5 @@
 module.exports = {
   presets: ['module:@react-native/babel-preset'],
-  env: {
-    test: {
-      presets: [
-        [
-          'module:@react-native/babel-preset',
-          {
-            disableStaticViewConfigsCodegen: true
-          }
-        ]
-      ]
-    }
-  },
   plugins: [
     'react-native-reanimated/plugin',
     [

package/lib/components/HighlighterOverlayView/HighlighterViewNativeComponent.d.ts

@@ -0,0 +1,61 @@
+/// <reference types="react-native/types/modules/codegen" />
+import type { ViewProps } from 'react-native';
+import type { Float, Int32, WithDefault } from 'react-native/Libraries/Types/CodegenTypes';
+export interface HighlightFrame {
+    x: Float;
+    y: Float;
+    width: Float;
+    height: Float;
+}
+export interface MinimumRectSize {
+    width: Float;
+    height: Float;
+}
+export interface HighlightViewTagParams {
+    paddingLeft?: WithDefault<Float, 0>;
+    paddingTop?: WithDefault<Float, 0>;
+    paddingRight?: WithDefault<Float, 0>;
+    paddingBottom?: WithDefault<Float, 0>;
+    offsetX?: WithDefault<Float, 0>;
+    offsetY?: WithDefault<Float, 0>;
+}
+export interface NativeProps extends ViewProps {
+    /**
+     * The frame to highlight with x, y, width, height coordinates
+     */
+    highlightFrame?: HighlightFrame;
+    /**
+     * The overlay color (processed color int for Android)
+     */
+    overlayColor?: WithDefault<Int32, 0>;
+    /**
+     * The border radius for the highlighted area
+     */
+    borderRadius?: WithDefault<Float, 0>;
+    /**
+     * The stroke color (processed color int for Android)
+     */
+    strokeColor?: WithDefault<Int32, 0>;
+    /**
+     * The stroke width
+     */
+    strokeWidth?: WithDefault<Float, 0>;
+    /**
+     * The React tag of the view to highlight
+     */
+    highlightViewTag?: Int32;
+    /**
+     * Parameters for view-based highlighting including padding and offset
+     */
+    highlightViewTagParams?: HighlightViewTagParams;
+    /**
+     * Minimum rectangle size for the highlight area
+     */
+    minimumRectSize?: MinimumRectSize;
+    /**
+     * Inner padding for the highlight area
+     */
+    innerPadding?: WithDefault<Float, 0>;
+}
+declare const _default: import("react-native/Libraries/Utilities/codegenNativeComponent").NativeComponentType<NativeProps>;
+export default _default;

package/lib/components/HighlighterOverlayView/HighlighterViewNativeComponent.js

@@ -0,0 +1,2 @@
+import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';
+export default codegenNativeComponent('HighlighterView');

package/lib/components/HighlighterOverlayView/index.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { processColor, StyleSheet, Modal } from 'react-native';
 // Import the Codegen specification for New Architecture
-import HighlighterViewNativeComponent from "../../specs/HighlighterViewNativeComponent";
+import HighlighterViewNativeComponent from "./HighlighterViewNativeComponent";
 const DefaultOverlayColor = 'rgba(0, 0, 0, 0.5)';
 const HighlighterOverlayView = props => {
   const {

package/lib/components/HighlighterOverlayView/index.web.d.ts

@@ -19,7 +19,7 @@ export type HighlighterOverlayViewProps = {
     onRequestClose?: () => void;
     highlightFrame?: HighlightFrameType;
     style?: ViewStyle;
-    highlightViewTag?: number;
+    highlightViewTag?: number | null;
     children?: JSX.Element[] | JSX.Element;
     highlightViewTagParams?: HighlightViewTagParams;
     minimumRectSize?: Pick<HighlightFrameType, 'width' | 'height'>;

package/lib/components/Keyboard/KeyboardTrackingView/KeyboardTrackingView.ios.js

@@ -1,7 +1,7 @@
 import React, { PureComponent } from 'react';
 import ReactNative, { NativeModules } from 'react-native';
 // Import the Codegen specification for New Architecture
-import KeyboardTrackingViewNativeComponent from "../../../specs/KeyboardTrackingViewNativeComponent";
+import KeyboardTrackingViewNativeComponent from "./KeyboardTrackingViewNativeComponent";
 const KeyboardTrackingViewTempManager = NativeModules.KeyboardTrackingViewTempManager;
 
 /**

package/lib/components/Keyboard/KeyboardTrackingView/KeyboardTrackingViewNativeComponent.d.ts

@@ -0,0 +1,58 @@
+/// <reference types="react-native/types/modules/codegen" />
+import type { ViewProps } from 'react-native';
+import type { Int32, WithDefault } from 'react-native/Libraries/Types/CodegenTypes';
+export interface NativeProps extends ViewProps {
+    /**
+     * Enables tracking of the keyboard when it's dismissed interactively (false by default).
+     */
+    trackInteractive?: WithDefault<boolean, false>;
+    /**
+     * iOS only.
+     * Show the keyboard on a negative scroll
+     */
+    revealKeyboardInteractive?: WithDefault<boolean, false>;
+    /**
+     * iOS only.
+     * Set to false to turn off inset management and manage it yourself
+     */
+    manageScrollView?: WithDefault<boolean, true>;
+    /**
+     * iOS only.
+     * Set to true manageScrollView is set to true and still does not work
+     */
+    requiresSameParentToManageScrollView?: WithDefault<boolean, false>;
+    /**
+     * iOS only.
+     * Allow hitting sub-views that are placed beyond the view bounds
+     */
+    allowHitsOutsideBounds?: WithDefault<boolean, false>;
+    /**
+     * Should the scrollView scroll to the focused input
+     */
+    scrollToFocusedInput?: WithDefault<boolean, false>;
+    /**
+     * iOS only.
+     * The scrolling behavior (NONE | SCROLL_TO_BOTTOM_INVERTED_ONLY | FIXED_OFFSET)
+     */
+    scrollBehavior?: WithDefault<Int32, 0>;
+    /**
+     * iOS only.
+     * Add a SafeArea view beneath the KeyboardAccessoryView
+     */
+    addBottomView?: WithDefault<boolean, false>;
+    /**
+     * iOS only.
+     * The bottom view's color
+     */
+    bottomViewColor?: string;
+    /**
+     * Allow control safe area
+     */
+    useSafeArea?: WithDefault<boolean, false>;
+    /**
+     * Whether or not to include bottom tab bar inset
+     */
+    usesBottomTabs?: WithDefault<boolean, false>;
+}
+declare const _default: import("react-native/Libraries/Utilities/codegenNativeComponent").NativeComponentType<NativeProps>;
+export default _default;

package/lib/components/Keyboard/KeyboardTrackingView/KeyboardTrackingViewNativeComponent.js

@@ -0,0 +1,2 @@
+import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';
+export default codegenNativeComponent('KeyboardTrackingViewTemp');

package/lib/components/SafeArea/SafeAreaInsetsManager.js

@@ -2,7 +2,7 @@ import _isEqual from "lodash/isEqual";
 import _remove from "lodash/remove";
 import _forEach from "lodash/forEach";
 /* eslint no-underscore-dangle: 0 */
-import { NativeModules, DeviceEventEmitter } from 'react-native';
+import { NativeModules, DeviceEventEmitter, Platform } from 'react-native';
 let SafeAreaInsetsCache = null;
 class SafeAreaInsetsManager {
   _defaultInsets = {
@@ -45,6 +45,9 @@ class SafeAreaInsetsManager {
     }
   }
   setupEventListener() {
+    if (Platform.OS !== 'ios') {
+      return;
+    }
     try {
       // Use DeviceEventEmitter instead of NativeEventEmitter to avoid getConstants      
       DeviceEventEmitter.addListener('SafeAreaInsetsDidChangeEvent', data => {

package/lib/components/SafeArea/SafeAreaSpacerView.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import { ViewStyle, StyleProp } from 'react-native';
+import { ViewStyle } from 'react-native';
 export type SafeAreaSpacerViewProps = {
-    style?: StyleProp<ViewStyle>;
+    style?: ViewStyle;
 };
 declare const SafeAreaSpacerView: {
     ({ style }: SafeAreaSpacerViewProps): React.JSX.Element;

package/lib/components/SafeArea/SafeAreaSpacerView.js

@@ -1,4 +1,4 @@
-import React, { useState, useCallback, useEffect, useMemo } from 'react';
+import React, { useState, useCallback, useEffect } from 'react';
 import { View, Dimensions } from 'react-native';
 import SafeAreaInsetsManager from "./SafeAreaInsetsManager";
 const SafeAreaSpacerView = ({
@@ -10,7 +10,6 @@ const SafeAreaSpacerView = ({
     bottom: 0,
     right: 0
   });
-  const [componentHeight, setComponentHeight] = useState(0);
   const [spacerHeight, setSpacerHeight] = useState(0);
   useEffect(() => {
     const getSafeAreaInsets = async () => {
@@ -44,24 +43,22 @@ const SafeAreaSpacerView = ({
     const {
       y
     } = event.nativeEvent.layout;
-    setComponentHeight(y);
-  }, []);
-  useEffect(() => {
     const screenHeight = Dimensions.get('window').height;
     let height = 0;
     // Check if positioned within safe area bounds
-    if (componentHeight < safeAreaInsets.top) {
+    if (y < safeAreaInsets.top) {
       height = safeAreaInsets.top;
-    } else if (componentHeight > screenHeight - safeAreaInsets.bottom) {
+    } else if (y > screenHeight - safeAreaInsets.bottom) {
       height = safeAreaInsets.bottom;
     }
     if (height !== spacerHeight) {
       setSpacerHeight(height);
     }
-  }, [componentHeight, safeAreaInsets, spacerHeight]);
-  const spacerStyle = useMemo(() => [{
-    height: spacerHeight
-  }, style], [spacerHeight, style]);
+  }, [safeAreaInsets, spacerHeight]);
+  const spacerStyle = {
+    height: spacerHeight,
+    ...style
+  };
   return <View style={spacerStyle} onLayout={handleLayout} />;
 };
 SafeAreaSpacerView.displayName = 'SafeAreaSpacerView';

package/lib/components/index.d.ts

@@ -1,6 +1,6 @@
 import DynamicFonts, { FontExtension } from './DynamicFonts';
 import HighlighterOverlayView from './HighlighterOverlayView';
-import SafeAreaSpacerView from './SafeArea';
+import SafeAreaSpacerView from './SafeArea/SafeAreaSpacerView';
 import SafeAreaInsetsManager from './SafeArea/SafeAreaInsetsManager';
 import Keyboard, { KeyboardTrackingViewProps, KeyboardAccessoryViewProps } from './Keyboard';
 export { DynamicFonts, FontExtension, HighlighterOverlayView, SafeAreaSpacerView, SafeAreaInsetsManager, Keyboard, KeyboardTrackingViewProps, KeyboardAccessoryViewProps };

package/lib/components/index.js

@@ -1,6 +1,6 @@
 import DynamicFonts, { FontExtension } from "./DynamicFonts";
 import HighlighterOverlayView from "./HighlighterOverlayView";
-import SafeAreaSpacerView from "./SafeArea";
+import SafeAreaSpacerView from "./SafeArea/SafeAreaSpacerView";
 import SafeAreaInsetsManager from "./SafeArea/SafeAreaInsetsManager";
 import Keyboard, { KeyboardTrackingViewProps, KeyboardAccessoryViewProps } from "./Keyboard";
 export { DynamicFonts, FontExtension, HighlighterOverlayView, SafeAreaSpacerView, SafeAreaInsetsManager, Keyboard, KeyboardTrackingViewProps, KeyboardAccessoryViewProps };

package/lib/package.json

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-ui-lib",
-  "version": "7.44.0-snapshot.7216",
+  "version": "7.44.0-snapshot.7227",
   "main": "src/index.js",
   "types": "src/index.d.ts",
   "author": "Ethan Sharabi <ethan.shar@gmail.com>",
@@ -56,7 +56,7 @@
     "react-native-redash": "^12.0.3",
     "semver": "^5.5.0",
     "tinycolor2": "^1.4.2",
-    "uilib-native": "5.0.0-snapshot.7212",
+    "uilib-native": "4.5.1",
     "url-parse": "^1.2.0",
     "wix-react-native-text-size": "1.0.9"
   },

package/src/components/KeyboardAwareScrollView/KeyboardAwareBase.js

@@ -107,7 +107,7 @@ export default class KeyboardAwareBase extends Component {
           setTimeout(() => {
             this._keyboardAwareView
               .getScrollResponder()
-              .scrollResponderScrollNativeHandleToKeyboard(this.findNodeHandle(textInputRef),
+              .scrollResponderScrollNativeHandleToKeyboard(ReactNative.findNodeHandle(textInputRef),
                 this.props.scrollToInputAdditionalOffset,
                 true);
           }, 0);
@@ -117,10 +117,6 @@ export default class KeyboardAwareBase extends Component {
     }
   }
 
-  findNodeHandle(ref) {
-    return ref.current?.getNodeHandle?.() || ref?.getNodeHandle?.() || ReactNative.findNodeHandle(ref.current || ref);
-  }
-
   _onKeyboardWillShow(event) {
     this._scrollToFocusedTextInput();
 

package/src/components/featureHighlight/index.d.ts

@@ -100,7 +100,7 @@ export type FeatureHighlightProps = {
 interface State {
     fadeAnim: Animated.Value;
     contentTopPosition?: number;
-    node?: number;
+    node?: number | null;
     getTarget?: () => any;
 }
 /**

package/lib/components/SafeArea/index.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-import { ViewStyle, StyleProp } from 'react-native';
-export type SafeAreaSpacerViewProps = {
-    style?: StyleProp<ViewStyle>;
-};
-declare const SafeAreaSpacerView: {
-    ({ style }: SafeAreaSpacerViewProps): React.JSX.Element;
-    displayName: string;
-};
-export default SafeAreaSpacerView;

package/lib/components/SafeArea/index.js

@@ -1,11 +0,0 @@
-import React from 'react';
-import { View, Platform } from 'react-native';
-import SafeAreaSpacerViewIos from "./SafeAreaSpacerView";
-const isIOS = Platform.OS === 'ios';
-const SafeAreaSpacerView = ({
-  style
-}) => {
-  return isIOS ? <SafeAreaSpacerViewIos style={style} /> : <View style={style} />;
-};
-SafeAreaSpacerView.displayName = 'SafeAreaSpacerView';
-export default SafeAreaSpacerView;