@buoy-gg/shared-ui 1.7.2

package/package.json

@@ -0,0 +1,172 @@
+{
+  "name": "@buoy-gg/shared-ui",
+  "version": "1.7.2",
+  "description": "Shared UI components, hooks, and utilities",
+  "main": "lib/commonjs/index.js",
+  "module": "lib/module/index.js",
+  "types": "lib/typescript/module/index.d.ts",
+  "react-native": "src/index.ts",
+  "source": "src/index.ts",
+  "exports": {
+    ".": {
+      "react-native": "./src/index.ts",
+      "import": {
+        "default": "./lib/module/index.js",
+        "types": "./lib/typescript/module/index.d.ts"
+      },
+      "require": {
+        "default": "./lib/commonjs/index.js",
+        "types": "./lib/typescript/commonjs/index.d.ts"
+      }
+    },
+    "./ui": {
+      "react-native": "./src/ui/index.ts",
+      "import": {
+        "default": "./lib/module/ui/index.js",
+        "types": "./lib/typescript/module/ui/index.d.ts"
+      },
+      "require": {
+        "default": "./lib/commonjs/ui/index.js",
+        "types": "./lib/typescript/commonjs/ui/index.d.ts"
+      }
+    },
+    "./hooks": {
+      "react-native": "./src/hooks/index.ts",
+      "import": {
+        "default": "./lib/module/hooks/index.js",
+        "types": "./lib/typescript/module/hooks/index.d.ts"
+      },
+      "require": {
+        "default": "./lib/commonjs/hooks/index.js",
+        "types": "./lib/typescript/commonjs/hooks/index.d.ts"
+      }
+    },
+    "./utils": {
+      "react-native": "./src/utils/index.ts",
+      "import": {
+        "default": "./lib/module/utils/index.js",
+        "types": "./lib/typescript/module/utils/index.d.ts"
+      },
+      "require": {
+        "default": "./lib/commonjs/utils/index.js",
+        "types": "./lib/typescript/commonjs/utils/index.d.ts"
+      }
+    },
+    "./dataViewer": {
+      "react-native": "./src/dataViewer/index.ts",
+      "import": {
+        "default": "./lib/module/dataViewer/index.js",
+        "types": "./lib/typescript/module/dataViewer/index.d.ts"
+      },
+      "require": {
+        "default": "./lib/commonjs/dataViewer/index.js",
+        "types": "./lib/typescript/commonjs/dataViewer/index.d.ts"
+      }
+    }
+  },
+  "typesVersions": {
+    "*": {
+      "ui": [
+        "lib/typescript/module/ui/index.d.ts"
+      ],
+      "ui/*": [
+        "lib/typescript/module/ui/*"
+      ],
+      "hooks": [
+        "lib/typescript/module/hooks/index.d.ts"
+      ],
+      "hooks/*": [
+        "lib/typescript/module/hooks/*"
+      ],
+      "utils": [
+        "lib/typescript/module/utils/index.d.ts"
+      ],
+      "utils/*": [
+        "lib/typescript/module/utils/*"
+      ],
+      "dataViewer": [
+        "lib/typescript/module/dataViewer/index.d.ts"
+      ],
+      "dataViewer/*": [
+        "lib/typescript/module/dataViewer/*"
+      ]
+    }
+  },
+  "files": [
+    "lib",
+    "scripts"
+  ],
+  "sideEffects": false,
+  "scripts": {
+    "postinstall": "node scripts/detect-clipboard.js && node scripts/detect-safe-area.js",
+    "build": "bob build",
+    "typecheck": "tsc --noEmit",
+    "prepublishOnly": "REACT_BUOY_FALLBACK=1 node scripts/detect-clipboard.js && REACT_BUOY_FALLBACK=1 node scripts/detect-safe-area.js && bob build",
+    "clean": "rimraf lib",
+    "test": "pnpm run typecheck"
+  },
+  "dependencies": {
+    "@buoy-gg/floating-tools-core": "workspace:*"
+  },
+  "peerDependencies": {
+    "react": "*",
+    "react-native": "*",
+    "expo-clipboard": "*",
+    "@react-native-clipboard/clipboard": "*",
+    "react-native-safe-area-context": "*",
+    "expo-file-system": "*"
+  },
+  "peerDependenciesMeta": {
+    "expo-clipboard": {
+      "optional": true
+    },
+    "@react-native-clipboard/clipboard": {
+      "optional": true
+    },
+    "react-native-safe-area-context": {
+      "optional": true
+    },
+    "expo-file-system": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "@types/react": "^19.1.0",
+    "@types/react-native": "^0.73.0",
+    "typescript": "~5.8.3"
+  },
+  "react-native-builder-bob": {
+    "source": "src",
+    "output": "lib",
+    "targets": [
+      [
+        "commonjs",
+        {
+          "esm": true,
+          "sourceMaps": false
+        }
+      ],
+      [
+        "module",
+        {
+          "esm": true,
+          "sourceMaps": false
+        }
+      ],
+      "typescript"
+    ]
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/LovesWorking/react-native-buoy.git",
+    "directory": "packages/shared"
+  },
+  "bugs": {
+    "url": "https://github.com/LovesWorking/react-native-buoy/issues"
+  },
+  "homepage": "https://github.com/LovesWorking/react-native-buoy/tree/main/packages/shared#readme",
+  "publishConfig": {
+    "access": "public",
+    "tag": "latest"
+  }
+}

package/scripts/detect-clipboard.js

@@ -0,0 +1,137 @@
+#!/usr/bin/env node
+/**
+ * Clipboard Detection Script
+ *
+ * This postinstall script detects which clipboard library is installed
+ * and generates the appropriate implementation file.
+ *
+ * This approach provides TRUE zero-config because:
+ * 1. No metro.config.js changes needed
+ * 2. Detection happens at install time (not bundle time)
+ * 3. Metro sees static imports only
+ * 4. Works with any Metro version
+ *
+ * IMPORTANT: During npm publish (prepublishOnly), REACT_BUOY_FALLBACK=1 is set
+ * to ensure the published package contains the fallback implementation.
+ * This ensures the package works out of the box even if postinstall doesn't run.
+ * When users install the package, postinstall runs and upgrades to native if available.
+ */
+
+const fs = require("fs");
+const path = require("path");
+
+const OUTPUT_FILE = path.join(__dirname, "..", "src", "clipboard", "clipboard-impl.ts");
+
+// Check for explicit fallback override (used during publishing)
+const forceFallback = process.env.REACT_BUOY_FALLBACK === "1";
+
+function moduleExists(name) {
+  try {
+    require.resolve(name);
+    return true;
+  } catch (e) {
+    return false;
+  }
+}
+
+let content;
+let detectedModule;
+
+if (!forceFallback && moduleExists("expo-clipboard")) {
+  detectedModule = "expo-clipboard";
+  content = `/**
+ * Auto-generated clipboard implementation
+ * Detected: expo-clipboard
+ * Generated at: ${new Date().toISOString()}
+ *
+ * DO NOT EDIT - This file is generated by scripts/detect-clipboard.js
+ */
+
+import { setStringAsync } from "expo-clipboard";
+
+export type ClipboardFunction = (text: string) => Promise<boolean>;
+
+export const clipboardType: "expo" | "react-native" | null = "expo";
+
+export const isClipboardAvailable = (): boolean => true;
+
+export const clipboardFunction: ClipboardFunction = async (text: string): Promise<boolean> => {
+  try {
+    await setStringAsync(text);
+    return true;
+  } catch (error) {
+    console.error("[RnBetterDevTools] Clipboard copy failed:", error);
+    return false;
+  }
+};
+`;
+} else if (!forceFallback && moduleExists("@react-native-clipboard/clipboard")) {
+  detectedModule = "@react-native-clipboard/clipboard";
+  content = `/**
+ * Auto-generated clipboard implementation
+ * Detected: @react-native-clipboard/clipboard
+ * Generated at: ${new Date().toISOString()}
+ *
+ * DO NOT EDIT - This file is generated by scripts/detect-clipboard.js
+ */
+
+import Clipboard from "@react-native-clipboard/clipboard";
+
+export type ClipboardFunction = (text: string) => Promise<boolean>;
+
+export const clipboardType: "expo" | "react-native" | null = "react-native";
+
+export const isClipboardAvailable = (): boolean => true;
+
+export const clipboardFunction: ClipboardFunction = async (text: string): Promise<boolean> => {
+  try {
+    Clipboard.setString(text);
+    return true;
+  } catch (error) {
+    console.error("[RnBetterDevTools] Clipboard copy failed:", error);
+    return false;
+  }
+};
+`;
+} else {
+  detectedModule = null;
+  content = `/**
+ * Auto-generated clipboard implementation
+ * Detected: none
+ * Generated at: ${new Date().toISOString()}
+ *
+ * DO NOT EDIT - This file is generated by scripts/detect-clipboard.js
+ *
+ * No clipboard library found. Install one of:
+ * - expo-clipboard (for Expo projects)
+ * - @react-native-clipboard/clipboard (for RN CLI projects)
+ */
+
+export type ClipboardFunction = (text: string) => Promise<boolean>;
+
+export const clipboardType: "expo" | "react-native" | null = null;
+
+export const isClipboardAvailable = (): boolean => false;
+
+export const clipboardFunction: ClipboardFunction = async (text: string): Promise<boolean> => {
+  console.error(
+    "[RnBetterDevTools] Copy failed: No clipboard library found.\\n" +
+      \`Attempted to copy: \${text.substring(0, 50)}\${text.length > 50 ? "..." : ""}\\n\` +
+      "Install expo-clipboard or @react-native-clipboard/clipboard, or provide a custom onCopy function."
+  );
+  return false;
+};
+`;
+}
+
+// Ensure directory exists
+const dir = path.dirname(OUTPUT_FILE);
+if (!fs.existsSync(dir)) {
+  fs.mkdirSync(dir, { recursive: true });
+}
+
+fs.writeFileSync(OUTPUT_FILE, content);
+
+console.log(
+  `[@buoy/shared-ui] Clipboard implementation configured: ${detectedModule || "none"}`
+);

package/scripts/detect-safe-area.js

@@ -0,0 +1,130 @@
+#!/usr/bin/env node
+/**
+ * Safe Area Detection Script
+ *
+ * This postinstall script detects if react-native-safe-area-context is installed
+ * and generates the appropriate implementation file.
+ *
+ * This approach provides TRUE zero-config because:
+ * 1. No metro.config.js changes needed
+ * 2. Detection happens at install time (not bundle time)
+ * 3. Metro sees static imports only
+ * 4. Works with any Metro version
+ *
+ * Key insight: When the package IS installed, we use SafeAreaInsetsContext
+ * directly with useContext() instead of useSafeAreaInsets(). This allows us
+ * to detect when SafeAreaProvider is missing (returns null) without throwing
+ * an error, enabling graceful fallback to pure JS implementation.
+ *
+ * IMPORTANT: During npm publish (prepublishOnly), REACT_BUOY_FALLBACK=1 is set
+ * to ensure the published package contains the fallback implementation.
+ * This ensures the package works out of the box even if postinstall doesn't run.
+ * When users install the package, postinstall runs and upgrades to native if available.
+ */
+
+const fs = require("fs");
+const path = require("path");
+
+const OUTPUT_FILE = path.join(__dirname, "..", "src", "hooks", "safe-area-impl.ts");
+
+// Check for explicit fallback override (used during publishing)
+const forceFallback = process.env.REACT_BUOY_FALLBACK === "1";
+
+function moduleExists(name) {
+  try {
+    require.resolve(name);
+    return true;
+  } catch (e) {
+    return false;
+  }
+}
+
+let content;
+let detectedModule;
+
+if (!forceFallback && moduleExists("react-native-safe-area-context")) {
+  detectedModule = "react-native-safe-area-context";
+  content = `/**
+ * Auto-generated safe area implementation
+ * Detected: react-native-safe-area-context
+ * Generated at: ${new Date().toISOString()}
+ *
+ * DO NOT EDIT - This file is generated by scripts/detect-safe-area.js
+ *
+ * This implementation uses SafeAreaInsetsContext directly with useContext()
+ * instead of the useSafeAreaInsets() hook. This allows graceful fallback
+ * when SafeAreaProvider is not present (useContext returns null instead of throwing).
+ */
+
+import { useContext } from "react";
+import { SafeAreaInsetsContext } from "react-native-safe-area-context";
+
+export interface NativeSafeAreaInsets {
+  top: number;
+  bottom: number;
+  left: number;
+  right: number;
+}
+
+export const safeAreaType: "native" | "pure-js" = "native";
+
+export const hasSafeAreaPackage = true;
+
+/**
+ * Hook that attempts to get native safe area insets.
+ * Returns null if SafeAreaProvider is not present (no error thrown).
+ *
+ * Unlike useSafeAreaInsets() from react-native-safe-area-context which throws
+ * when no provider is found, this uses useContext directly which returns null.
+ */
+export const useNativeSafeAreaInsets = (): NativeSafeAreaInsets | null => {
+  // useContext returns null when no provider is present - no error!
+  const insets = useContext(SafeAreaInsetsContext);
+  return insets;
+};
+`;
+} else {
+  detectedModule = null;
+  content = `/**
+ * Auto-generated safe area implementation
+ * Detected: none
+ * Generated at: ${new Date().toISOString()}
+ *
+ * DO NOT EDIT - This file is generated by scripts/detect-safe-area.js
+ *
+ * No react-native-safe-area-context found. Using pure JS fallback only.
+ * Install react-native-safe-area-context for more accurate safe area values.
+ */
+
+export interface NativeSafeAreaInsets {
+  top: number;
+  bottom: number;
+  left: number;
+  right: number;
+}
+
+export const safeAreaType: "native" | "pure-js" = "pure-js";
+
+export const hasSafeAreaPackage = false;
+
+/**
+ * Hook that returns null since react-native-safe-area-context is not installed.
+ * The main useSafeAreaInsets hook will use pure JS fallback.
+ */
+export const useNativeSafeAreaInsets = (): NativeSafeAreaInsets | null => {
+  return null;
+};
+`;
+}
+
+// Ensure directory exists
+const dir = path.dirname(OUTPUT_FILE);
+if (!fs.existsSync(dir)) {
+  fs.mkdirSync(dir, { recursive: true });
+}
+
+fs.writeFileSync(OUTPUT_FILE, content);
+
+console.log(
+  `[@buoy/shared-ui] Safe area implementation configured: ${detectedModule || "pure-js fallback"}`
+);