@tamagui/fake-react-native 2.7.7 → 3.0.0-0.canary.1791056644527

package/index.js

@@ -18,24 +18,68 @@ const emtpyComponent = () => null
 // Mock usePressability for testing - returns empty event handlers
 const usePressabilityMock = () => ({})
 
+// real context: consumers (tamagui's useChildren) call React.useContext on it,
+// the proxyWorm fallback object would break that
+const TextAncestorContext = React.createContext(false)
+const Animated = {
+  createAnimatedComponent: (Component) => Component,
+}
+const Keyboard = {
+  addListener: () => ({ remove: () => {} }),
+  removeAllListeners: () => {},
+  dismiss: () => {},
+}
+const useWindowDimensions = () => ({
+  width: 1024,
+  height: 768,
+  scale: 2,
+  fontScale: 1,
+})
+const PanResponder = {
+  create: (handlers) => ({ panHandlers: handlers }),
+}
+const TurboModuleRegistry = {
+  get: () => null,
+}
+const PixelRatio = {
+  get: () => 2,
+  getFontScale: () => 1,
+  getPixelSizeForLayoutSize: (size) => Math.round(size * 2),
+  roundToNearestPixel: (size) => Math.round(size * 2) / 2,
+}
+const codegenNativeCommands = () => ({})
+const codegenNativeComponent = (name) => createMockComponent(name)
+
 function proxyWorm() {
   return new Proxy(
     {
       StyleSheet: {
         create() {},
       },
+      unstable_TextAncestorContext: TextAncestorContext,
       Platform: {
         OS: 'web',
+        select: (options) => options.web ?? options.default,
       },
       Image: emtpyComponent,
       View: createMockComponent('View'),
       Text: createMockComponent('Text'),
       TextInput: createMockComponent('TextInput'),
       ScrollView: createMockComponent('ScrollView'),
+      FlatList: createMockComponent('FlatList'),
+      Pressable: createMockComponent('Pressable'),
+      Animated,
+      NativeModules: {},
+      PanResponder,
+      TurboModuleRegistry,
+      PixelRatio,
+      processColor: (color) => color,
       Dimensions: {
-        get: () => ({ width: 1024, height: 768 }),
+        get: () => ({ width: 1024, height: 768, scale: 2, fontScale: 1 }),
         addEventListener: () => ({ remove: () => {} }),
       },
+      useWindowDimensions,
+      Keyboard,
       Appearance: {
         getColorScheme: () => 'light',
         addChangeListener: () => {},
@@ -73,5 +117,17 @@ module.exports.View = proxy.View
 module.exports.Text = proxy.Text
 module.exports.TextInput = proxy.TextInput
 module.exports.ScrollView = proxy.ScrollView
+module.exports.FlatList = proxy.FlatList
+module.exports.Pressable = proxy.Pressable
+module.exports.Animated = proxy.Animated
+module.exports.NativeModules = proxy.NativeModules
+module.exports.PanResponder = proxy.PanResponder
+module.exports.TurboModuleRegistry = proxy.TurboModuleRegistry
+module.exports.PixelRatio = PixelRatio
+module.exports.processColor = proxy.processColor
 module.exports.Dimensions = proxy.Dimensions
+module.exports.useWindowDimensions = useWindowDimensions
+module.exports.Keyboard = Keyboard
 module.exports.Appearance = proxy.Appearance
+module.exports.codegenNativeCommands = codegenNativeCommands
+module.exports.codegenNativeComponent = codegenNativeComponent

package/index.mjs

@@ -1,11 +1,18 @@
+import React from 'react'
+
 const emtpyComponent = () => null
 
+// real context: consumers (tamagui's useChildren) call React.useContext on it,
+// the proxyWorm fallback object would break that
+const TextAncestorContext = React.createContext(false)
+
 function proxyWorm() {
   return new Proxy(
     {
       StyleSheet: {
         create() {},
       },
+      unstable_TextAncestorContext: TextAncestorContext,
       Platform: {
         OS: 'web',
       },
@@ -15,8 +22,15 @@ function proxyWorm() {
       TextInput: emtpyComponent,
       ScrollView: emtpyComponent,
       Dimensions: {
+        get: () => ({ width: 1024, height: 768, scale: 2, fontScale: 1 }),
         addEventListener(cb) {},
       },
+      PixelRatio: {
+        get: () => 2,
+        getFontScale: () => 1,
+        getPixelSizeForLayoutSize: (size) => Math.round(size * 2),
+        roundToNearestPixel: (size) => Math.round(size * 2) / 2,
+      },
       Appearance: {
         getColorScheme: () => 'light',
         addChangeListener: () => {},
@@ -46,12 +60,16 @@ export const Text = proxy.Text
 export const TextInput = proxy.TextInput
 export const ScrollView = proxy.ScrollView
 export const Dimensions = proxy.Dimensions
+export const PixelRatio = proxy.PixelRatio
 export const Pressable = proxy.Pressable
 export const Animated = proxy.Animated
 export const Easing = proxy.Easing
 export const Appearance = proxy.Appearance
 export const findNodeHandle = proxy.findNodeHandle
 export const unstable_batchedUpdates = proxy.unstable_batchedUpdates
+export const unstable_TextAncestorContext = proxy.unstable_TextAncestorContext
+export const codegenNativeCommands = () => ({})
+export const codegenNativeComponent = () => emtpyComponent
 
 // Default export
 export default proxy

package/package.json

@@ -1,6 +1,7 @@
 {
   "name": "@tamagui/fake-react-native",
-  "version": "2.7.7",
+  "version": "3.0.0-0.canary.1791056644527",
+  "license": "MIT",
   "gitHead": "a49cc7ea6b93ba384e77a4880ae48ac4a5635c14",
   "main": "index.js",
   "module": "index.mjs",
@@ -10,14 +11,36 @@
       "module": "./index.mjs",
       "import": "./index.mjs",
       "require": "./index.js"
+    },
+    "./pressability": "./pressability.js",
+    "./pressEvent": {
+      "types": "./pressEvent.d.ts",
+      "default": "./pressEvent.js"
     }
   },
   "publishConfig": {
     "access": "public"
   },
+  "peerDependencies": {
+    "@babel/core": "*",
+    "@react-native/babel-preset": "*",
+    "react-native": "*"
+  },
+  "peerDependenciesMeta": {
+    "@babel/core": {
+      "optional": true
+    },
+    "@react-native/babel-preset": {
+      "optional": true
+    },
+    "react-native": {
+      "optional": true
+    }
+  },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/tamagui/tamagui.git",
     "directory": "code/packages/fake-react-native"
-  }
+  },
+  "releaseSourceCommit": "e09267246167b52afd620a498678f5cce456cb5a"
 }

package/pressEvent.d.ts

@@ -0,0 +1,18 @@
+// a responder event for react native press tests: the view measurement and
+// touch coordinates its press handler reads, with move and cancel support.
+export declare function pressEvent(
+  pageX?: number,
+  pageY?: number
+): {
+  currentTarget: { measure(callback: (...bounds: number[]) => void): void }
+  target: { measure(callback: (...bounds: number[]) => void): void }
+  nativeEvent: {
+    pageX: number
+    pageY: number
+    timestamp: number
+    touches: { pageX: number; pageY: number }[]
+    changedTouches: { pageX: number; pageY: number }[]
+  }
+  persist(): void
+  stopPropagation(): void
+}

package/pressEvent.js

@@ -0,0 +1,24 @@
+// responder fixtures include the native view measurement and touch coordinates
+// consumed by react native's press handler, including move and cancel events.
+function pressEvent(pageX = 10, pageY = 10) {
+  const target = {
+    measure(callback) {
+      callback(0, 0, 100, 100, 0, 0)
+    },
+  }
+  return {
+    currentTarget: target,
+    target,
+    nativeEvent: {
+      pageX,
+      pageY,
+      timestamp: Date.now(),
+      touches: [{ pageX, pageY }],
+      changedTouches: [{ pageX, pageY }],
+    },
+    persist() {},
+    stopPropagation() {},
+  }
+}
+
+exports.pressEvent = pressEvent

package/pressability.js

@@ -0,0 +1,62 @@
+const { readFileSync } = require('node:fs')
+const { dirname, join, resolve } = require('node:path')
+const Module = require('node:module')
+const { transformSync } = require('@babel/core')
+
+// run react native's actual press state machine in native tests. only the
+// platform bindings are mocked; geometry, timers and cancellation stay real.
+// published so any native test setup, in or out of this repo, aliases
+// react-native/Libraries/Pressability/usePressability to this one file.
+const root = dirname(require.resolve('react-native/package.json'))
+const platform = require('./index.js').Platform
+const bindings = new Map([
+  [join(root, 'Libraries/Utilities/Platform.js'), platform],
+  [
+    join(root, 'Libraries/ReactNative/UIManager.js'),
+    {
+      measure() {
+        throw new Error('native press tests must provide a measurable responder')
+      },
+    },
+  ],
+  [join(root, 'Libraries/Components/Sound/SoundManager.js'), { playTouchSound() {} }],
+  [
+    join(root, 'src/private/featureflags/ReactNativeFeatureFlags.js'),
+    {
+      shouldPressibilityUseW3CPointerEventsForHover: () => false,
+    },
+  ],
+])
+const cache = new Map()
+
+function load(filename) {
+  if (bindings.has(filename)) return bindings.get(filename)
+  if (cache.has(filename)) return cache.get(filename).exports
+  const compiled = new Module(filename, module)
+  compiled.paths = Module._nodeModulePaths(dirname(filename))
+  compiled.require = (request) => {
+    if (request.startsWith('.')) {
+      const path = resolve(dirname(filename), request)
+      return load(path.endsWith('.js') ? path : path + '.js')
+    }
+    return Module.prototype.require.call(compiled, request)
+  }
+  cache.set(filename, compiled)
+  const output = transformSync(readFileSync(filename, 'utf8'), {
+    filename,
+    babelrc: false,
+    configFile: false,
+    presets: [
+      [require.resolve('@react-native/babel-preset'), { enableBabelRuntime: false }],
+    ],
+  })
+  Function(
+    'require',
+    'module',
+    'exports',
+    output.code
+  )(compiled.require, compiled, compiled.exports)
+  return compiled.exports
+}
+
+module.exports = load(join(root, 'Libraries/Pressability/usePressability.js')).default