rn-native-wrapper 1.0.2 → 1.0.3

package/README.md

@@ -1,6 +1,10 @@
 # RN Native Wrapper
 
-A React Native wrapper component for the native date picker, providing a simple and type-safe interface to `react-native-date-picker`.
+React Native wrapper package providing:
+
+- **RNNativeDatePicker** – type-safe interface to `react-native-date-picker`
+- **Speech recognition** – re-exports from `expo-speech-recognition` (APIs, hooks, constants, types)
+- **Permission helpers** – internal helpers to check/request microphone and speech recognition permissions
 
 ## Installation
 
@@ -12,16 +16,28 @@ yarn add rn-native-wrapper
 
 ### Peer Dependencies
 
-This package requires the following peer dependencies:
-
 ```bash
 npm install react react-native
 ```
 
-The package automatically includes `react-native-date-picker` as a dependency.
+The package includes `react-native-date-picker` and `expo-speech-recognition` as dependencies.
+
+---
+
+## Exports (from `index.ts`)
+
+| Category | Exports |
+|----------|--------|
+| **Date Picker** | `RNNativeDatePicker` (default + named) |
+| **Permission helpers** | `checkSpeechRecognitionPermissions`, `requestSpeechRecognitionPermissions`, `checkMicrophonePermission`, `requestMicrophonePermission`, `checkSpeechRecognizerPermission`, `requestSpeechRecognizerPermission`, `ensureSpeechRecognitionPermissions`, `SpeechRecognitionPermissionResult` |
+| **Speech recognition** | All exports from `expo-speech-recognition` (e.g. `ExpoSpeechRecognitionModule`, `ExpoWebSpeechRecognition`, `useSpeechRecognitionEvent`, constants, types) |
+
+---
 
 ## Usage
 
+### RNNativeDatePicker
+
 ```tsx
 import React, { useState } from 'react';
 import { View, Button } from 'react-native';
@@ -34,7 +50,6 @@ export default function App() {
   return (
     <View>
       <Button title="Open Date Picker" onPress={() => setOpen(true)} />
-      
       <RNNativeDatePicker
         modal
         open={open}
@@ -43,32 +58,78 @@ export default function App() {
           setOpen(false);
           setDate(selectedDate);
         }}
-        onCancel={() => {
-          setOpen(false);
-        }}
+        onCancel={() => setOpen(false)}
       />
     </View>
   );
 }
 ```
 
+### Permission helpers (speech / microphone)
+
+Request or check permissions before starting speech recognition:
+
+```tsx
+import {
+  ensureSpeechRecognitionPermissions,
+  type SpeechRecognitionPermissionResult,
+} from 'rn-native-wrapper';
+
+// Before starting recognition: check, then request if needed
+const result = await ensureSpeechRecognitionPermissions();
+if (result.granted) {
+  // Start speech recognition
+} else if (!result.canAskAgain) {
+  // Open app settings
+} else {
+  // User denied; show message
+}
+```
+
+Available helpers:
+
+- **`checkSpeechRecognitionPermissions()`** – Check both speech + microphone (no dialog).
+- **`requestSpeechRecognitionPermissions()`** – Request both (shows system dialog).
+- **`ensureSpeechRecognitionPermissions()`** – Check first; request if not granted.
+- **`checkMicrophonePermission()`** / **`requestMicrophonePermission()`** – Microphone only.
+- **`checkSpeechRecognizerPermission()`** / **`requestSpeechRecognizerPermission()`** – Speech recognizer only (mainly iOS).
+
+**`SpeechRecognitionPermissionResult`**: `{ granted, canAskAgain, status, response }`.
+
+### Speech recognition (expo-speech-recognition)
+
+All APIs from `expo-speech-recognition` are re-exported. Use them as you would from that package:
+
+```tsx
+import {
+  ExpoSpeechRecognitionModule,
+  useSpeechRecognitionEvent,
+} from 'rn-native-wrapper';
+```
+
+See [expo-speech-recognition](https://www.npmjs.com/package/expo-speech-recognition) for full API and setup (e.g. config plugin, permissions in `app.json`).
+
+---
+
 ## API
 
-The `RNNativeDatePicker` component accepts all props from [`react-native-date-picker`](https://github.com/henninghall/react-native-date-picker). Please refer to their documentation for detailed prop descriptions.
+### RNNativeDatePicker
 
-### Common Props
+Accepts all props from [`react-native-date-picker`](https://github.com/henninghall/react-native-date-picker).
 
-- `modal`: boolean - Display as modal
-- `open`: boolean - Modal open state
-- `date`: Date - Currently selected date
-- `onConfirm`: (date: Date) => void - Callback when date is confirmed
-- `onCancel`: () => void - Callback when picker is cancelled
-- `mode`: 'date' | 'time' | 'datetime' - Picker mode
-- `locale`: string - Locale for date formatting
+| Prop | Type | Description |
+|------|------|--------------|
+| `modal` | boolean | Display as modal |
+| `open` | boolean | Modal open state |
+| `date` | Date | Currently selected date |
+| `onConfirm` | (date: Date) => void | Called when date is confirmed |
+| `onCancel` | () => void | Called when picker is cancelled |
+| `mode` | 'date' \| 'time' \| 'datetime' | Picker mode |
+| `locale` | string | Locale for date formatting |
 
 ## TypeScript
 
-This package is written in TypeScript and includes full type definitions out of the box.
+This package is written in TypeScript and ships with type definitions.
 
 ## License
 

package/ios/Podfile.lock

@@ -57,6 +57,8 @@ PODS:
     - ReactCommon/turbomodule/core
     - ReactNativeDependencies
     - Yoga
+  - ExpoSpeechRecognition (3.1.0):
+    - ExpoModulesCore
   - FBLazyVector (0.81.5)
   - hermes-engine (0.81.5):
     - hermes-engine/Pre-built (= 0.81.5)
@@ -1813,6 +1815,7 @@ DEPENDENCIES:
   - ExpoFont (from `../node_modules/expo-font/ios`)
   - ExpoKeepAwake (from `../node_modules/expo-keep-awake/ios`)
   - ExpoModulesCore (from `../node_modules/expo-modules-core`)
+  - ExpoSpeechRecognition (from `../node_modules/expo-speech-recognition/ios`)
   - FBLazyVector (from `../node_modules/react-native/Libraries/FBLazyVector`)
   - hermes-engine (from `../node_modules/react-native/sdks/hermes-engine/hermes-engine.podspec`)
   - RCTDeprecation (from `../node_modules/react-native/ReactApple/Libraries/RCTFoundation/RCTDeprecation`)
@@ -1900,6 +1903,8 @@ EXTERNAL SOURCES:
     :path: "../node_modules/expo-keep-awake/ios"
   ExpoModulesCore:
     :path: "../node_modules/expo-modules-core"
+  ExpoSpeechRecognition:
+    :path: "../node_modules/expo-speech-recognition/ios"
   FBLazyVector:
     :path: "../node_modules/react-native/Libraries/FBLazyVector"
   hermes-engine:
@@ -2050,6 +2055,7 @@ SPEC CHECKSUMS:
   ExpoFont: f543ce20a228dd702813668b1a07b46f51878d47
   ExpoKeepAwake: 55f75eca6499bb9e4231ebad6f3e9cb8f99c0296
   ExpoModulesCore: f3da4f1ab5a8375d0beafab763739dbee8446583
+  ExpoSpeechRecognition: d8dfddcc6d998399f57803a9547aa7a0c63777b9
   FBLazyVector: e95a291ad2dadb88e42b06e0c5fb8262de53ec12
   hermes-engine: 9f4dfe93326146a1c99eb535b1cb0b857a3cd172
   RCTDeprecation: 943572d4be82d480a48f4884f670135ae30bf990

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rn-native-wrapper",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "description": "React Native wrapper for native date picker component",
   "main": "lib/index.js",
   "module": "lib/index.js",
@@ -10,6 +10,7 @@
   "files": [
     "lib",
     "src",
+    "scripts",
     "ios",
     "android",
     "!**/__tests__",
@@ -21,6 +22,7 @@
     "!android/.gradle"
   ],
   "scripts": {
+    "postinstall": "node ./scripts/postinstall.js",
     "start": "expo start",
     "reset-project": "node ./scripts/reset-project.js",
     "android": "expo run:android",
@@ -32,12 +34,13 @@
     "clean": "rm -rf lib"
   },
   "dependencies": {
-    "expo-speech-recognition": "^3.1.0",
-    "react-native-date-picker": "^5.0.13"
+
   },
   "peerDependencies": {
     "react": "*",
-    "react-native": "*"
+    "react-native": "*",
+    "expo-speech-recognition": "*",
+    "react-native-date-picker": "*"
   },
   "devDependencies": {
     "@types/react": "~19.1.0",

package/scripts/postinstall.js

@@ -0,0 +1,90 @@
+/**
+ * When rn-native-wrapper is installed as a dependency (directly or via another library),
+ * install peer packages expo-speech-recognition and react-native-date-picker in the
+ * host/root project so the app has them available.
+ */
+const path = require('path');
+const fs = require('fs');
+const { execSync } = require('child_process');
+
+const PACKAGES_TO_INSTALL = ['expo-speech-recognition', 'react-native-date-picker'];
+
+function findHostProjectRoot() {
+  // This script runs from rn-native-wrapper/scripts, so __dirname is .../rn-native-wrapper/scripts
+  // Package root = rn-native-wrapper
+  let dir = path.resolve(__dirname, '..');
+
+  while (dir !== path.dirname(dir)) {
+    const parent = path.dirname(dir);
+    const parentBasename = path.basename(parent);
+    // We're inside node_modules when our parent folder is named "node_modules"
+    if (parentBasename === 'node_modules') {
+      const candidateRoot = path.dirname(parent);
+      const pkgJson = path.join(candidateRoot, 'package.json');
+      if (fs.existsSync(pkgJson)) {
+        return candidateRoot;
+      }
+    }
+    dir = parent;
+  }
+
+  return null;
+}
+
+function getPackageManager(root) {
+  if (fs.existsSync(path.join(root, 'yarn.lock'))) return 'yarn';
+  if (fs.existsSync(path.join(root, 'pnpm-lock.yaml'))) return 'pnpm';
+  return 'npm';
+}
+
+function installInHost(hostRoot, packagesToAdd) {
+  const pm = getPackageManager(hostRoot);
+  const packages = packagesToAdd.join(' ');
+
+  try {
+    if (pm === 'yarn') {
+      execSync(`yarn add ${packages}`, { cwd: hostRoot, stdio: 'inherit' });
+    } else if (pm === 'pnpm') {
+      execSync(`pnpm add ${packages}`, { cwd: hostRoot, stdio: 'inherit' });
+    } else {
+      execSync(`npm install ${packages}`, { cwd: hostRoot, stdio: 'inherit' });
+    }
+  } catch (err) {
+    console.warn(
+      '[rn-native-wrapper] postinstall: could not auto-install peer packages in root project. Please run:\n' +
+        `  ${pm} add ${packages}\n` +
+        '  in your project root.'
+    );
+  }
+}
+
+function main() {
+  // Only run when we are installed as a dependency (inside node_modules)
+  const packageRoot = path.resolve(__dirname, '..');
+  if (!packageRoot.includes('node_modules')) {
+    return;
+  }
+
+  const hostRoot = findHostProjectRoot();
+  if (!hostRoot) {
+    return;
+  }
+
+  const pkgJsonPath = path.join(hostRoot, 'package.json');
+  let pkgJson;
+  try {
+    pkgJson = JSON.parse(fs.readFileSync(pkgJsonPath, 'utf8'));
+  } catch {
+    return;
+  }
+
+  const deps = { ...pkgJson.dependencies, ...pkgJson.devDependencies };
+  const missing = PACKAGES_TO_INSTALL.filter((p) => !deps[p]);
+  if (missing.length === 0) {
+    return;
+  }
+
+  installInHost(hostRoot, missing);
+}
+
+main();

package/scripts/reset-project.js

@@ -0,0 +1,112 @@
+#!/usr/bin/env node
+
+/**
+ * This script is used to reset the project to a blank state.
+ * It deletes or moves the /app, /components, /hooks, /scripts, and /constants directories to /app-example based on user input and creates a new /app directory with an index.tsx and _layout.tsx file.
+ * You can remove the `reset-project` script from package.json and safely delete this file after running it.
+ */
+
+const fs = require("fs");
+const path = require("path");
+const readline = require("readline");
+
+const root = process.cwd();
+const oldDirs = ["app", "components", "hooks", "constants", "scripts"];
+const exampleDir = "app-example";
+const newAppDir = "app";
+const exampleDirPath = path.join(root, exampleDir);
+
+const indexContent = `import { Text, View } from "react-native";
+
+export default function Index() {
+  return (
+    <View
+      style={{
+        flex: 1,
+        justifyContent: "center",
+        alignItems: "center",
+      }}
+    >
+      <Text>Edit app/index.tsx to edit this screen.</Text>
+    </View>
+  );
+}
+`;
+
+const layoutContent = `import { Stack } from "expo-router";
+
+export default function RootLayout() {
+  return <Stack />;
+}
+`;
+
+const rl = readline.createInterface({
+  input: process.stdin,
+  output: process.stdout,
+});
+
+const moveDirectories = async (userInput) => {
+  try {
+    if (userInput === "y") {
+      // Create the app-example directory
+      await fs.promises.mkdir(exampleDirPath, { recursive: true });
+      console.log(`📁 /${exampleDir} directory created.`);
+    }
+
+    // Move old directories to new app-example directory or delete them
+    for (const dir of oldDirs) {
+      const oldDirPath = path.join(root, dir);
+      if (fs.existsSync(oldDirPath)) {
+        if (userInput === "y") {
+          const newDirPath = path.join(root, exampleDir, dir);
+          await fs.promises.rename(oldDirPath, newDirPath);
+          console.log(`➡️ /${dir} moved to /${exampleDir}/${dir}.`);
+        } else {
+          await fs.promises.rm(oldDirPath, { recursive: true, force: true });
+          console.log(`❌ /${dir} deleted.`);
+        }
+      } else {
+        console.log(`➡️ /${dir} does not exist, skipping.`);
+      }
+    }
+
+    // Create new /app directory
+    const newAppDirPath = path.join(root, newAppDir);
+    await fs.promises.mkdir(newAppDirPath, { recursive: true });
+    console.log("\n📁 New /app directory created.");
+
+    // Create index.tsx
+    const indexPath = path.join(newAppDirPath, "index.tsx");
+    await fs.promises.writeFile(indexPath, indexContent);
+    console.log("📄 app/index.tsx created.");
+
+    // Create _layout.tsx
+    const layoutPath = path.join(newAppDirPath, "_layout.tsx");
+    await fs.promises.writeFile(layoutPath, layoutContent);
+    console.log("📄 app/_layout.tsx created.");
+
+    console.log("\n✅ Project reset complete. Next steps:");
+    console.log(
+      `1. Run \`npx expo start\` to start a development server.\n2. Edit app/index.tsx to edit the main screen.${
+        userInput === "y"
+          ? `\n3. Delete the /${exampleDir} directory when you're done referencing it.`
+          : ""
+      }`
+    );
+  } catch (error) {
+    console.error(`❌ Error during script execution: ${error.message}`);
+  }
+};
+
+rl.question(
+  "Do you want to move existing files to /app-example instead of deleting them? (Y/n): ",
+  (answer) => {
+    const userInput = answer.trim().toLowerCase() || "y";
+    if (userInput === "y" || userInput === "n") {
+      moveDirectories(userInput).finally(() => rl.close());
+    } else {
+      console.log("❌ Invalid input. Please enter 'Y' or 'N'.");
+      rl.close();
+    }
+  }
+);