Separate uilib-native package

ReactNativeUiLib.podspec

@@ -1,6 +1,6 @@
 require 'json'
 
-package = JSON.parse(File.read(File.join(__dir__, 'lib/package.json')))
+package = JSON.parse(File.read(File.join(__dir__, 'package.json')))
 
 Pod::Spec.new do |s|
   s.name         = "ReactNativeUiLib"
@@ -15,7 +15,7 @@ Pod::Spec.new do |s|
   s.module_name  = 'ReactNativeUiLib'
 
   s.source       = { :git => "https://github.com/wix/react-native-ui-lib.git", :tag => "#{s.version}" }
-  s.source_files  = "lib/ios/**/*.{h,m}"
+  s.source_files  = "node_modules/uilib-native/ios/**/*.{h,m}"
 
   s.dependency 'React'
   s.frameworks = 'UIKit'

jestSetup/jest-setup.js

@@ -1,4 +1,4 @@
-import {NativeModules, AccessibilityInfo, Animated} from 'react-native';
+import {AccessibilityInfo, Animated} from 'react-native';
 // ========= Mock Object.defineProperty to always allow overriding =========
 const originalDefineProperty = Object.defineProperty;
 Object.defineProperty = (obj, prop, desc) => {

lib/package.json

@@ -3,7 +3,7 @@
   "version": "4.3.2",
   "homepage": "https://github.com/wix/react-native-ui-lib",
   "description": "uilib native components (separated from js components)",
-  "main": "components/index.js",
+  "main": "components/index",
   "scripts": {
     "releaseNative": "node ./scripts/releaseNative.js"
   },

package.json

@@ -55,6 +55,7 @@
     "semver": "^5.5.0",
     "tinycolor2": "^1.4.2",
     "url-parse": "^1.2.0",
+    "uilib-native": "^4.3.2",
     "wix-react-native-text-size": "~1.0.0"
   },
   "devDependencies": {
@@ -132,7 +133,7 @@
   "jest": {
     "preset": "react-native",
     "transformIgnorePatterns": [
-      "node_modules/(?!(@react-native|react-native|react-native-reanimated|react-native-redash)/)"
+      "node_modules/(?!(@react-native|react-native|react-native-reanimated|react-native-redash|uilib-native)/)"
     ],
     "testPathIgnorePatterns": [
       "/e2e/",

scripts/buildPackages/buildCustomPackages.js

@@ -4,7 +4,7 @@ const _ = require('lodash');
 const packages = [
   {
     filename: 'keyboard.js',
-    content: `module.exports = require('./lib/components/Keyboard').default;\n`
+    content: `module.exports = require('uilib-native').Keyboard;\n`
   },
   {
     filename: 'assets.js',

src/components/featureHighlight/index.tsx

@@ -10,14 +10,13 @@ import {
   TouchableWithoutFeedbackProps,
   LayoutChangeEvent
 } from 'react-native';
+import {HighlighterOverlayView} from 'uilib-native';
 import {Colors, Typography} from '../../style';
 import {Constants, asBaseComponent} from '../../commons/new';
 import View from '../view';
 import Text from '../text';
 import Button, {ButtonProps, ButtonSize} from '../button';
 import PageControl, {PageControlProps} from '../pageControl';
-//@ts-expect-error
-import {HighlighterOverlayView} from '../../nativeComponents';
 
 const defaultOverlayColor = Colors.rgba(Colors.black, 0.82);
 const defaultTextColor = Colors.white;
@@ -180,7 +179,7 @@ class FeatureHighlight extends Component<FeatureHighlightProps, State> {
     if (prevState?.getTarget === nextProps?.getTarget) {
       return null;
     }
-    
+
     const target = nextProps?.getTarget?.();
     const node = FeatureHighlight.findTargetNode(target);
     if (node && node !== prevState?.node) {
@@ -223,8 +222,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 +258,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/index.ts

@@ -3,7 +3,7 @@ export {default as Assets} from './assets';
 export type {emojis as EmojisAssetsType} from './assets/emojis';
 export * from './style';
 export * from './services';
-export * from '../lib/components';
+export * from 'uilib-native';
 export {
   asBaseComponent,
   Config,

yarn.lock

@@ -4044,7 +4044,7 @@ eslint-plugin-react@^7.20.0, eslint-plugin-react@^7.24.0:
     string.prototype.matchall "^4.0.10"
 
 "eslint-plugin-uilib@file:./eslint-rules":
-  version "2.1.7"
+  version "2.2.4"
   dependencies:
     lodash "^4.0.0"
     requireindex "~1.1.0"
@@ -8170,6 +8170,14 @@ uglify-es@^3.1.9:
     commander "~2.13.0"
     source-map "~0.6.1"
 
+uilib-native@^4.3.2:
+  version "4.3.2"
+  resolved "https://registry.npmjs.org/uilib-native/-/uilib-native-4.3.2.tgz#d0e28d0b4c390411f80ab7f16a26905ed6dcd7d4"
+  integrity sha512-L3NyrO9rHlNZ6D/F4t2G8xLkTe0BDqoj90H4StDUwyoZ9j4Oo9YBuqtiPzG75bSRPlptB2eeRp4UZThnyr++tQ==
+  dependencies:
+    lodash "^4.0.0"
+    prop-types "^15.5.10"
+
 unbox-primitive@^1.0.2:
   version "1.0.2"
   resolved "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.0.2.tgz#29032021057d5e6cdbd08c5129c226dff8ed6f9e"