feat(mobile): PinInput component — 6-digit numeric pad

apps/mobile/vitest.rn-shim.ts

@@ -0,0 +1,84 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+// Minimal `react-native` surface used by vitest tests. Each visible
+// primitive is a forwardRef component that renders a lower-case React
+// element so react-test-renderer treats it as a regular host node, and
+// @testing-library/react-native's queries can traverse the tree.
+// The shim is loaded by Module._resolveFilename in vitest.setup.ts.
+import * as React from 'react';
+
+function makeHost(name: string) {
+  const C: any = React.forwardRef(function HostComponent(
+    props: Record<string, unknown>,
+    ref: unknown,
+  ) {
+    return React.createElement(name, { ...props, ref });
+  });
+  C.displayName = name;
+  return C;
+}
+
+export const View = makeHost('View');
+export const Text = makeHost('Text');
+export const TextInput = makeHost('TextInput');
+export const Pressable = makeHost('Pressable');
+export const Image = makeHost('Image');
+export const ScrollView = makeHost('ScrollView');
+export const Modal = makeHost('Modal');
+export const Switch = makeHost('Switch');
+
+export const Platform = { OS: 'test', select: (m: any) => m.default ?? m.test ?? null };
+
+export const StyleSheet = {
+  create<T extends Record<string, unknown>>(s: T): T {
+    return s;
+  },
+  flatten(s: unknown): unknown {
+    if (Array.isArray(s)) {
+      const flat: Record<string, unknown> = {};
+      for (const part of s) Object.assign(flat, part ?? {});
+      return flat;
+    }
+    return s ?? {};
+  },
+  hairlineWidth: 1,
+  absoluteFill: {},
+  absoluteFillObject: {},
+};
+
+export const Dimensions = { get: () => ({ width: 360, height: 640 }) };
+export const NativeModules: Record<string, unknown> = {};
+export const Animated = { View, Text, Image, createAnimatedComponent: (c: unknown) => c };
+export const Linking = { openURL: async () => undefined };
+export const Alert = { alert: () => undefined };
+export const Appearance = { getColorScheme: () => 'dark' };
+export const AccessibilityInfo = {
+  isScreenReaderEnabled: async () => false,
+  addEventListener: () => ({ remove: () => undefined }),
+};
+export const PixelRatio = { get: () => 2 };
+export const Keyboard = { dismiss: () => undefined };
+export const useWindowDimensions = () => ({ width: 360, height: 640 });
+
+const defaultExport = {
+  View,
+  Text,
+  TextInput,
+  Pressable,
+  Image,
+  ScrollView,
+  Modal,
+  Switch,
+  Platform,
+  StyleSheet,
+  Dimensions,
+  NativeModules,
+  Animated,
+  Linking,
+  Alert,
+  Appearance,
+  AccessibilityInfo,
+  PixelRatio,
+  Keyboard,
+  useWindowDimensions,
+};
+export default defaultExport;