@nebula-rn/host-apis 0.0.1

package/src/NebulaHostScanModal.tsx

@@ -0,0 +1,263 @@
+import React, { useEffect, useRef, useState } from 'react';
+import {
+  Dimensions,
+  Image,
+  PermissionsAndroid,
+  Platform,
+  StatusBar,
+  StyleSheet,
+  TouchableOpacity,
+  View,
+} from 'react-native';
+import {
+  Camera,
+  useCameraDevice,
+  useCodeScanner,
+} from 'react-native-vision-camera';
+import type { Code, CodeType } from 'react-native-vision-camera';
+import { NebulaAPI } from '@nebula-rn/sdk';
+import type { NebulaApiInvokeResult } from '@nebula-rn/sdk';
+import { scanCodeChannel } from './scanCodeRuntime';
+
+const { width, height } = Dimensions.get('screen');
+
+function createFailureResult(
+  code:
+    | 'PERMISSION_DENIED'
+    | 'USER_CANCELLED'
+    | 'UNSUPPORTED_SOURCE'
+    | 'SCAN_FAILED',
+  message: string,
+): NebulaApiInvokeResult {
+  return {
+    ok: false,
+    error: {
+      code,
+      message,
+    },
+  };
+}
+
+function createSuccessResult(code: Code): NebulaApiInvokeResult {
+  return {
+    ok: true,
+    data: {
+      result: code.value,
+      scanType: code.type,
+      rawData: code,
+    },
+  };
+}
+
+export default function NebulaHostScanModal(): React.ReactElement | null {
+  const [request, setRequest] = useState(scanCodeChannel.getCurrent());
+  const [isActive, setIsActive] = useState(true);
+  const [hasPermission, setHasPermission] = useState(Platform.OS !== 'android');
+  const didHandleScanRef = useRef(false);
+  const device = useCameraDevice('back');
+  const scanTypes = (request?.scanTypes ?? [
+    'qr',
+    'ean-13',
+    'code-128',
+  ]) as CodeType[];
+  const codeScanner = useCodeScanner({
+    codeTypes: scanTypes,
+    onCodeScanned: codes => {
+      if (!codes[0] || !isActive || didHandleScanRef.current) {
+        return;
+      }
+
+      didHandleScanRef.current = true;
+      setIsActive(false);
+      closeWithResult(createSuccessResult(codes[0]));
+    },
+  });
+
+  const closeWithResult = (result: NebulaApiInvokeResult) => {
+    NebulaAPI.dismissHostModal()
+      .catch(() => {})
+      .finally(() => {
+        scanCodeChannel.settle(result);
+      });
+  };
+
+  useEffect(() => {
+    return scanCodeChannel.subscribe(nextRequest => {
+      didHandleScanRef.current = false;
+      setRequest(nextRequest);
+      setIsActive(true);
+      setHasPermission(Platform.OS !== 'android');
+    });
+  }, []);
+
+  useEffect(() => {
+    if (!request) {
+      return;
+    }
+
+    return () => {
+      if (didHandleScanRef.current) {
+        return;
+      }
+      didHandleScanRef.current = true;
+      scanCodeChannel.settle(
+        createFailureResult('USER_CANCELLED', 'scanCode:fail cancel'),
+      );
+    };
+  }, [request]);
+
+  useEffect(() => {
+    if (Platform.OS !== 'android' || !request) {
+      return;
+    }
+
+    let cancelled = false;
+
+    const requestAndroidPermission = async () => {
+      const granted = await PermissionsAndroid.request(
+        PermissionsAndroid.PERMISSIONS.CAMERA,
+      );
+
+      if (cancelled || didHandleScanRef.current) {
+        return;
+      }
+
+      if (granted === PermissionsAndroid.RESULTS.GRANTED) {
+        setHasPermission(true);
+        return;
+      }
+
+      didHandleScanRef.current = true;
+      closeWithResult(
+        createFailureResult(
+          'PERMISSION_DENIED',
+          'scanCode:fail permission denied',
+        ),
+      );
+    };
+
+    requestAndroidPermission().catch(() => {
+      if (cancelled || didHandleScanRef.current) {
+        return;
+      }
+      didHandleScanRef.current = true;
+      closeWithResult(
+        createFailureResult(
+          'SCAN_FAILED',
+          'scanCode:fail unable to request camera permission',
+        ),
+      );
+    });
+
+    return () => {
+      cancelled = true;
+    };
+  }, [request]);
+
+  if (!request) {
+    return null;
+  }
+
+  if (Platform.OS === 'android' && !hasPermission) {
+    return <View style={styles.container} />;
+  }
+
+  if (!device) {
+    return <View style={styles.container} />;
+  }
+
+  const safePaddingTop = Platform.OS === 'ios' ? 54 : 20;
+
+  return (
+    <View style={styles.container}>
+      <StatusBar
+        translucent
+        backgroundColor="transparent"
+        barStyle="light-content"
+      />
+      <Camera
+        codeScanner={codeScanner}
+        device={device}
+        isActive={isActive}
+        style={StyleSheet.absoluteFill}
+      />
+
+      <TouchableOpacity
+        style={[styles.closeIcon, { paddingTop: safePaddingTop }]}
+        onPress={() => {
+          if (didHandleScanRef.current) {
+            return;
+          }
+          didHandleScanRef.current = true;
+          closeWithResult(
+            createFailureResult('USER_CANCELLED', 'scanCode:fail cancel'),
+          );
+        }}
+      >
+        <Image
+          source={require('./assets/icon_close.png')}
+          style={styles.closeImg}
+        />
+      </TouchableOpacity>
+
+      {!request.onlyFromCamera ? (
+        <TouchableOpacity
+          style={styles.albumIcon}
+          onPress={() => {
+            if (didHandleScanRef.current) {
+              return;
+            }
+            didHandleScanRef.current = true;
+            closeWithResult(
+              createFailureResult(
+                'UNSUPPORTED_SOURCE',
+                'scanCode:fail album selection not implemented',
+              ),
+            );
+          }}
+        >
+          <Image
+            source={require('./assets/icon_pic.png')}
+            style={styles.albumImg}
+          />
+        </TouchableOpacity>
+      ) : null}
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    position: 'absolute',
+    top: 0,
+    left: 0,
+    width,
+    height,
+    backgroundColor: '#000',
+  },
+  closeIcon: {
+    position: 'absolute',
+    left: 20,
+    top: 0,
+    zIndex: 1010,
+  },
+  closeImg: {
+    width: 26,
+    height: 26,
+    tintColor: '#FFF',
+  },
+  albumIcon: {
+    position: 'absolute',
+    right: 20,
+    bottom: 40,
+    zIndex: 1010,
+    backgroundColor: 'rgba(0,0,0,0.5)',
+    padding: 12,
+    borderRadius: 30,
+  },
+  albumImg: {
+    width: 24,
+    height: 24,
+    tintColor: '#FFF',
+  },
+});

package/src/PreviewImageHostBridge.tsx

@@ -0,0 +1,36 @@
+import { createHostModalApiFeature } from '@nebula-rn/sdk';
+import NebulaHostPreviewImageModal from './NebulaHostPreviewImageModal';
+import { previewImageChannel } from './previewImageRuntime';
+
+export type PreviewImagePayload = {
+  urls: string[];
+  current?: string;
+  showMenu?: boolean;
+  saveMediaText?: string;
+  cancelText?: string;
+};
+
+export const previewImageHostApi = createHostModalApiFeature<
+  PreviewImagePayload,
+  PreviewImagePayload
+>({
+  apiName: 'previewImage',
+  description: {
+    summary:
+      'Open a host-managed fullscreen image preview modal for one or more image URLs.',
+    description:
+      'Supports selecting the initial image and optionally showing save actions in the preview UI.',
+    tags: ['media', 'image', 'modal'],
+  },
+  component: NebulaHostPreviewImageModal,
+  channel: previewImageChannel,
+  createRequest: payload => ({
+    urls: payload.urls,
+    current: payload.current,
+    showMenu: payload.showMenu,
+    saveMediaText: payload.saveMediaText,
+    cancelText: payload.cancelText,
+  }),
+  onUnmountErrorMessage:
+    'previewImage:fail host preview was unmounted before completion',
+});

package/src/ScanCodeHostBridge.tsx

@@ -0,0 +1,58 @@
+import { Camera } from 'react-native-vision-camera';
+import {
+  createHostApiFailure,
+  createHostModalApiFeature,
+} from '@nebula-rn/sdk';
+import NebulaHostScanModal from './NebulaHostScanModal';
+import { scanCodeChannel } from './scanCodeRuntime';
+import { Platform } from 'react-native';
+
+type ScanCodePayload = {
+  onlyFromCamera?: boolean;
+  scanType?: string[];
+};
+
+function normalizeScanTypes(scanTypes?: string[]): string[] {
+  const defaultTypes = ['qr', 'ean-13', 'code-128'];
+  if (!scanTypes || scanTypes.length === 0) {
+    return defaultTypes;
+  }
+
+  const normalized = scanTypes.filter(Boolean);
+  return normalized.length > 0 ? normalized : defaultTypes;
+}
+
+export const scanCodeHostApi = createHostModalApiFeature<
+  ScanCodePayload,
+  { onlyFromCamera?: boolean; scanTypes: string[] }
+>({
+  apiName: 'scanCode',
+  description: {
+    summary:
+      'Open a host-managed scanner modal and return the first detected barcode or QR code.',
+    description:
+      'Supports camera-based scanning and returns structured scan metadata when successful.',
+    tags: ['camera', 'scanner', 'modal'],
+  },
+  component: NebulaHostScanModal,
+  channel: scanCodeChannel,
+  createRequest: payload => ({
+    onlyFromCamera: payload.onlyFromCamera,
+    scanTypes: normalizeScanTypes(payload.scanType),
+  }),
+  onBeforeOpen: async () => {
+    if (Platform.OS === 'android') {
+      return null;
+    }
+    const permission = await Camera.requestCameraPermission();
+    if (permission !== 'granted') {
+      return createHostApiFailure(
+        'PERMISSION_DENIED',
+        'scanCode:fail permission denied',
+      );
+    }
+    return null;
+  },
+  onUnmountErrorMessage:
+    'scanCode:fail host scanner was unmounted before completion',
+});