@rn-tools/core 3.0.1

package/CHANGELOG.md

@@ -0,0 +1,7 @@
+# @rn-tools/core
+
+## 3.0.1
+
+### Patch Changes
+
+- e62a766: Initial changeset publish

package/README.md

@@ -0,0 +1,3 @@
+# @rn-tools/core
+
+Core utilities for rn-tools, including safe-area insets and a minimal external store helper.

package/android/build.gradle

@@ -0,0 +1,47 @@
+apply plugin: 'com.android.library'
+
+group = 'expo.modules.rntoolscore'
+version = '0.1.0'
+
+def expoModulesCorePlugin = new File(project(":expo-modules-core").projectDir.absolutePath, "ExpoModulesCorePlugin.gradle")
+apply from: expoModulesCorePlugin
+applyKotlinExpoModulesCorePlugin()
+useCoreDependencies()
+useExpoPublishing()
+
+def useManagedAndroidSdkVersions = false
+if (useManagedAndroidSdkVersions) {
+  useDefaultAndroidSdkVersions()
+} else {
+  buildscript {
+    ext.safeExtGet = { prop, fallback ->
+      rootProject.ext.has(prop) ? rootProject.ext.get(prop) : fallback
+    }
+  }
+  project.android {
+    compileSdkVersion safeExtGet("compileSdkVersion", 34)
+    defaultConfig {
+      minSdkVersion safeExtGet("minSdkVersion", 21)
+      targetSdkVersion safeExtGet("targetSdkVersion", 34)
+    }
+  }
+}
+
+android {
+  namespace "expo.modules.rntoolscore"
+  defaultConfig {
+    versionCode 1
+    versionName "0.1.0"
+  }
+  lintOptions {
+    abortOnError false
+  }
+
+  repositories {
+    mavenCentral()
+  }
+
+  dependencies {
+    implementation 'com.facebook.react:react-native:+'
+  }
+}

package/android/src/main/AndroidManifest.xml

@@ -0,0 +1,2 @@
+<manifest>
+</manifest>

package/android/src/main/java/expo/modules/rntoolscore/RNToolsCoreModule.kt

@@ -0,0 +1,118 @@
+package expo.modules.rntoolscore
+
+import android.view.View
+import android.view.ViewGroup
+import com.facebook.react.bridge.UiThreadUtil
+import expo.modules.kotlin.modules.Module
+import expo.modules.kotlin.modules.ModuleDefinition
+import java.util.concurrent.CountDownLatch
+import java.util.concurrent.TimeUnit
+
+class RNToolsCoreModule : Module() {
+  private var lastInsets: EdgeInsets? = null
+  private var attachedView: View? = null
+  private var insetsListener: View.OnApplyWindowInsetsListener? = null
+
+  override fun definition() = ModuleDefinition {
+    Name("RNToolsCore")
+
+    Events("onSafeAreaInsetsChange")
+
+    Function("getSafeAreaInsets") {
+      val fallback = mapOf(
+        "top" to 0f,
+        "right" to 0f,
+        "bottom" to 0f,
+        "left" to 0f
+      )
+
+      val activity = appContext.currentActivity ?: return@Function fallback
+      val decorView = activity.window?.decorView as? ViewGroup ?: return@Function fallback
+
+      if (UiThreadUtil.isOnUiThread()) {
+        val insets = getSafeAreaInsets(decorView) ?: return@Function fallback
+        return@Function insetsToMap(insets)
+      }
+
+      val latch = CountDownLatch(1)
+      var result: Map<String, Float> = fallback
+
+      UiThreadUtil.runOnUiThread {
+        val insets = getSafeAreaInsets(decorView)
+        result = if (insets == null) fallback else insetsToMap(insets)
+        latch.countDown()
+      }
+
+      latch.await(200, TimeUnit.MILLISECONDS)
+      return@Function result
+    }
+
+    OnCreate {
+      attachInsetsListener()
+    }
+
+    OnDestroy {
+      detachInsetsListener()
+    }
+
+    OnActivityEntersForeground {
+      attachInsetsListener()
+    }
+  }
+
+  private fun attachInsetsListener() {
+    UiThreadUtil.runOnUiThread {
+      val activity = appContext.currentActivity ?: return@runOnUiThread
+      val decorView = activity.window?.decorView as? ViewGroup ?: return@runOnUiThread
+
+      attachedView = decorView
+      insetsListener = View.OnApplyWindowInsetsListener { view, insets ->
+        emitSafeAreaInsetsIfChanged(view)
+        view.onApplyWindowInsets(insets)
+      }
+
+      decorView.setOnApplyWindowInsetsListener(insetsListener)
+      decorView.requestApplyInsets()
+      emitSafeAreaInsetsIfChanged(decorView)
+    }
+  }
+
+  private fun detachInsetsListener() {
+    UiThreadUtil.runOnUiThread {
+      attachedView?.setOnApplyWindowInsetsListener(null)
+      attachedView = null
+      insetsListener = null
+    }
+  }
+
+  private fun emitSafeAreaInsetsIfChanged(view: View?) {
+    val target = view ?: return
+    val insets = getSafeAreaInsets(target) ?: return
+
+    if (lastInsets != null && areInsetsEqual(lastInsets!!, insets)) {
+      return
+    }
+
+    lastInsets = insets
+    sendEvent(
+      "onSafeAreaInsetsChange",
+      mapOf("insets" to insetsToMap(insets))
+    )
+  }
+
+  private fun areInsetsEqual(lhs: EdgeInsets, rhs: EdgeInsets): Boolean {
+    return lhs.top == rhs.top &&
+      lhs.right == rhs.right &&
+      lhs.bottom == rhs.bottom &&
+      lhs.left == rhs.left
+  }
+
+  private fun insetsToMap(insets: EdgeInsets): Map<String, Float> {
+    return mapOf(
+      "top" to insets.top,
+      "right" to insets.right,
+      "bottom" to insets.bottom,
+      "left" to insets.left
+    )
+  }
+}

package/android/src/main/java/expo/modules/rntoolscore/SafeAreaUtils.kt

@@ -0,0 +1,87 @@
+package expo.modules.rntoolscore
+
+import android.graphics.Rect
+import android.os.Build
+import android.view.View
+import android.view.WindowInsets
+import androidx.annotation.RequiresApi
+import kotlin.math.max
+import kotlin.math.min
+
+data class EdgeInsets(
+  val top: Float,
+  val right: Float,
+  val bottom: Float,
+  val left: Float
+)
+
+@RequiresApi(Build.VERSION_CODES.R)
+private fun getRootWindowInsetsCompatR(rootView: View): EdgeInsets? {
+  val insets =
+    rootView.rootWindowInsets?.getInsets(
+      WindowInsets.Type.statusBars() or
+        WindowInsets.Type.displayCutout() or
+        WindowInsets.Type.navigationBars() or
+        WindowInsets.Type.captionBar()
+    ) ?: return null
+
+  return EdgeInsets(
+    top = insets.top.toFloat(),
+    right = insets.right.toFloat(),
+    bottom = insets.bottom.toFloat(),
+    left = insets.left.toFloat()
+  )
+}
+
+@RequiresApi(Build.VERSION_CODES.M)
+@Suppress("DEPRECATION")
+private fun getRootWindowInsetsCompatM(rootView: View): EdgeInsets? {
+  val insets = rootView.rootWindowInsets ?: return null
+  return EdgeInsets(
+    top = insets.systemWindowInsetTop.toFloat(),
+    right = insets.systemWindowInsetRight.toFloat(),
+    // Use the min to avoid including the keyboard while still honoring nav bars.
+    bottom = min(insets.systemWindowInsetBottom, insets.stableInsetBottom).toFloat(),
+    left = insets.systemWindowInsetLeft.toFloat()
+  )
+}
+
+private fun getRootWindowInsetsCompatBase(rootView: View): EdgeInsets? {
+  val visibleRect = Rect()
+  rootView.getWindowVisibleDisplayFrame(visibleRect)
+  return EdgeInsets(
+    top = visibleRect.top.toFloat(),
+    right = (rootView.width - visibleRect.right).toFloat(),
+    bottom = (rootView.height - visibleRect.bottom).toFloat(),
+    left = visibleRect.left.toFloat()
+  )
+}
+
+private fun getRootWindowInsetsCompat(rootView: View): EdgeInsets? {
+  return when {
+    Build.VERSION.SDK_INT >= Build.VERSION_CODES.R -> getRootWindowInsetsCompatR(rootView)
+    Build.VERSION.SDK_INT >= Build.VERSION_CODES.M -> getRootWindowInsetsCompatM(rootView)
+    else -> getRootWindowInsetsCompatBase(rootView)
+  }
+}
+
+fun getSafeAreaInsets(view: View): EdgeInsets? {
+  if (view.height == 0) {
+    return null
+  }
+
+  val rootView = view.rootView
+  val windowInsets = getRootWindowInsetsCompat(rootView) ?: return null
+
+  val windowWidth = rootView.width.toFloat()
+  val windowHeight = rootView.height.toFloat()
+  val visibleRect = Rect()
+  view.getGlobalVisibleRect(visibleRect)
+
+  return EdgeInsets(
+    top = max(windowInsets.top - visibleRect.top, 0f),
+    right = max(min(visibleRect.left + view.width - windowWidth, 0f) + windowInsets.right, 0f),
+    bottom = max(min(visibleRect.top + view.height - windowHeight, 0f) + windowInsets.bottom, 0f),
+    left = max(windowInsets.left - visibleRect.left, 0f)
+  )
+}

package/expo-module.config.json

@@ -0,0 +1,17 @@
+{
+  "platforms": [
+    "apple",
+    "android",
+    "web"
+  ],
+  "apple": {
+    "modules": [
+      "RNToolsCoreModule"
+    ]
+  },
+  "android": {
+    "modules": [
+      "expo.modules.rntoolscore.RNToolsCoreModule"
+    ]
+  }
+}

package/ios/RNToolsCore.podspec

@@ -0,0 +1,30 @@
+require 'json'
+
+ENV['RCT_NEW_ARCH_ENABLED'] ||= '1'
+package = JSON.parse(File.read(File.join(__dir__, '..', 'package.json')))
+new_arch_enabled = ENV['RCT_NEW_ARCH_ENABLED'] == '1'
+
+Pod::Spec.new do |s|
+  s.name           = 'RNToolsCore'
+  s.version        = package['version']
+  s.summary        = package['description']
+  s.description    = package['description']
+  s.license        = package['license']
+  s.author         = package['author']
+  s.homepage       = package['homepage']
+  s.platforms      = {
+    :ios => '16.0',
+    :tvos => '16.0'
+  }
+  s.swift_version  = '5.4'
+  s.source         = { git: 'https://github.com/ajsmth/rn-tools' }
+  s.static_framework = true
+
+  s.dependency 'ExpoModulesCore'
+  s.pod_target_xcconfig = {
+    'DEFINES_MODULE' => 'YES',
+    'OTHER_SWIFT_FLAGS' => '$(inherited)'
+  }
+
+  s.source_files = "**/*.{h,m,mm,swift,hpp,cpp}"
+end

package/ios/RNToolsCoreModule.swift

@@ -0,0 +1,110 @@
+import ExpoModulesCore
+import UIKit
+
+public class RNToolsCoreModule: Module {
+    private var lastInsets: UIEdgeInsets?
+    private var observers: [NSObjectProtocol] = []
+
+    public func definition() -> ModuleDefinition {
+        Name("RNToolsCore")
+
+        Events("onSafeAreaInsetsChange")
+
+        Function("getSafeAreaInsets") { () -> [String: CGFloat] in
+            if Thread.isMainThread {
+                return self.safeAreaInsetsDictionary()
+            }
+
+            var result = self.safeAreaInsetsDictionary()
+            DispatchQueue.main.sync {
+                result = self.safeAreaInsetsDictionary()
+            }
+            return result
+        }
+
+        OnCreate {
+            self.startObservingSafeArea()
+        }
+
+        OnDestroy {
+            self.stopObservingSafeArea()
+        }
+
+        OnAppBecomesActive {
+            self.emitSafeAreaInsetsIfChanged()
+        }
+    }
+
+    private func startObservingSafeArea() {
+        UIDevice.current.beginGeneratingDeviceOrientationNotifications()
+        let center = NotificationCenter.default
+        let names: [NSNotification.Name] = [
+            UIApplication.didBecomeActiveNotification,
+            UIApplication.willEnterForegroundNotification,
+            UIDevice.orientationDidChangeNotification,
+            UIApplication.didChangeStatusBarFrameNotification,
+        ]
+
+        observers = names.map { name in
+            center.addObserver(forName: name, object: nil, queue: .main) { [weak self] _ in
+                self?.emitSafeAreaInsetsIfChanged()
+            }
+        }
+
+        emitSafeAreaInsetsIfChanged()
+    }
+
+    private func stopObservingSafeArea() {
+        let center = NotificationCenter.default
+        observers.forEach { center.removeObserver($0) }
+        observers.removeAll()
+        UIDevice.current.endGeneratingDeviceOrientationNotifications()
+    }
+
+    private func emitSafeAreaInsetsIfChanged() {
+        let send = { [weak self] in
+            guard let self else { return }
+            let windowInsets = self.keyWindow()?.safeAreaInsets ?? .zero
+            if let last = self.lastInsets, self.areInsetsEqual(last, windowInsets) {
+                return
+            }
+            self.lastInsets = windowInsets
+            self.sendEvent("onSafeAreaInsetsChange", ["insets": self.safeAreaInsetsDictionary(windowInsets)])
+        }
+
+        if Thread.isMainThread {
+            send()
+        } else {
+            DispatchQueue.main.async { send() }
+        }
+    }
+
+    private func safeAreaInsetsDictionary(_ insets: UIEdgeInsets? = nil) -> [String: CGFloat] {
+        let resolved = insets ?? keyWindow()?.safeAreaInsets ?? .zero
+        return [
+            "top": resolved.top,
+            "right": resolved.right,
+            "bottom": resolved.bottom,
+            "left": resolved.left,
+        ]
+    }
+
+    private func areInsetsEqual(_ lhs: UIEdgeInsets, _ rhs: UIEdgeInsets) -> Bool {
+        return lhs.top == rhs.top &&
+            lhs.right == rhs.right &&
+            lhs.bottom == rhs.bottom &&
+            lhs.left == rhs.left
+    }
+
+    private func keyWindow() -> UIWindow? {
+        let scenes = UIApplication.shared.connectedScenes
+            .compactMap { $0 as? UIWindowScene }
+            .flatMap { $0.windows }
+
+        if let window = scenes.first(where: { $0.isKeyWindow }) {
+            return window
+        }
+
+        return UIApplication.shared.windows.first(where: { $0.isKeyWindow })
+    }
+}

package/mocks/react-native.mock.ts

@@ -0,0 +1,21 @@
+export const Platform = {
+  OS: "ios",
+  select: (options: Record<string, unknown>) => options.ios,
+};
+
+export const Keyboard = {
+  addListener: () => ({ remove: () => {} }),
+};
+
+export const StyleSheet = {
+  absoluteFill: {},
+  create: (styles: Record<string, unknown>) => styles,
+};
+
+export function View(props: { children?: unknown }) {
+  return props.children;
+}
+
+export function Text(props: { children?: unknown }) {
+  return props.children;
+}

package/mocks/render-node-probe.tsx

@@ -0,0 +1,50 @@
+import * as React from "react";
+import {
+  type RenderNode,
+  getRenderNode,
+  getRenderNodeActive,
+  getRenderNodeDepth,
+  getRenderNodeChildren,
+  getRenderNodeParent,
+  useRenderTreeSelector,
+} from "../src/render-tree";
+
+export type RenderNodeProbeData = {
+  node: RenderNode;
+  type: RenderNode["type"];
+  active: boolean;
+  depth: number;
+  parent: RenderNode | null;
+  children: RenderNode[];
+};
+
+export function RenderNodeProbe(props: {
+  render: (data: RenderNodeProbeData) => React.ReactNode;
+}) {
+  const data = useRenderTreeSelector((chart, id) => {
+    const node = getRenderNode(chart, id);
+    if (!node) {
+      return null;
+    }
+
+    const parent = getRenderNodeParent(chart, id);
+    const children = getRenderNodeChildren(chart, id);
+    const depth = getRenderNodeDepth(chart, id);
+    const active = getRenderNodeActive(chart, id);
+
+    return {
+      node,
+      type: node.type,
+      active,
+      depth,
+      parent,
+      children,
+    } satisfies RenderNodeProbeData;
+  });
+
+  if (!data) {
+    return null;
+  }
+
+  return <>{props.render(data)}</>;
+}

package/mocks/setup.ts

@@ -0,0 +1,6 @@
+import { afterEach } from "vitest";
+import { cleanup } from "@testing-library/react";
+
+afterEach(() => {
+  cleanup();
+});

package/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "@rn-tools/core",
+  "version": "3.0.1",
+  "description": "Core utilities for rn-tools",
+  "main": "src/index.ts",
+  "scripts": {
+    "test": "vitest"
+  },
+  "keywords": [
+    "react-native",
+    "expo",
+    "core",
+    "RNToolsCore"
+  ],
+  "repository": "https://github.com/ajsmth/rn-tools/tree/main/packages/core",
+  "bugs": {
+    "url": "https://github.com/ajsmth/rn-tools/issues"
+  },
+  "author": "andy <andydevs123@gmail.com> (ajsmth)",
+  "license": "MIT",
+  "homepage": "https://github.com/ajsmth/rn-tools#readme",
+  "devDependencies": {
+    "@testing-library/react": "^14.2.1",
+    "@types/react": "18.3.12",
+    "@types/react-test-renderer": "^18.0.0",
+    "react-test-renderer": "^18.2.0",
+    "vitest": "^1.6.0"
+  },
+  "dependencies": {
+    "use-sync-external-store": "^1.2.2"
+  },
+  "peerDependencies": {
+    "expo": "*",
+    "react": "*",
+    "react-native": "*"
+  }
+}

package/src/index.ts

@@ -0,0 +1,4 @@
+export * from "./safe-area";
+export * from "./keyboard";
+export * from "./store";
+export * from "./render-tree";

package/src/keyboard.ts

@@ -0,0 +1,43 @@
+import { Keyboard, KeyboardEvent } from "react-native";
+import { createStore, useStore } from "./store";
+
+export type KeyboardState = {
+  height: number;
+};
+
+const fallbackHeight = 0;
+
+export function getKeyboardHeight(): number {
+  return fallbackHeight;
+}
+
+export const keyboardHeightStore = createStore<KeyboardState>({
+  height: getKeyboardHeight(),
+});
+
+const updateHeight = (height: number) => {
+  keyboardHeightStore.setState((state) => {
+    if (state.height === height) {
+      return state;
+    }
+    return { ...state, height };
+  });
+};
+
+const handleShow = (event: KeyboardEvent) => {
+  const nextHeight = event.endCoordinates?.height ?? 0;
+  updateHeight(nextHeight);
+};
+
+const handleHide = () => {
+  updateHeight(0);
+};
+
+Keyboard.addListener("keyboardWillShow", handleShow);
+Keyboard.addListener("keyboardWillHide", handleHide);
+Keyboard.addListener("keyboardDidShow", handleShow);
+Keyboard.addListener("keyboardDidHide", handleHide);
+
+export const useKeyboardHeight = (): number => {
+  return useStore(keyboardHeightStore, (state) => state.height);
+};