Capacitor

// npm i @capacitor/camera @capacitor/filesystem @capacitor/share
import { Camera, CameraResultType, CameraSource } from '@capacitor/camera';
import { Filesystem, Directory, Encoding } from '@capacitor/filesystem';
import { Share } from '@capacitor/share';

// 1) Take a photo (uses the native camera on device, file picker on web)
const photo = await Camera.getPhoto({
  quality: 80,
  resultType: CameraResultType.DataUrl,   // 'base64' or 'uri' also work
  source: CameraSource.Camera,
  saveToGallery: false,
  promptLabelHeader: 'Photo for receipt',
});

// 2) Write the photo bytes to app storage
const base64 = photo.dataUrl!.split(',')[1];
const fileName = \`receipt-${Date.now()}.${photo.format}\`;

const saved = await Filesystem.writeFile({
  path: fileName,
  data: base64,
  directory: Directory.Data,
});

// 3) Read it back as text or convert to a Blob for upload
const read = await Filesystem.readFile({
  path: fileName,
  directory: Directory.Data,
});

// 4) Share the file via the system share sheet
await Share.share({
  title: 'Receipt',
  text: 'Latest receipt photo',
  url: saved.uri,           // native file:// URI
  dialogTitle: 'Share receipt',
});

// 5) Capability check before calling — useful when targeting web fallback
import { Capacitor } from '@capacitor/core';
if (Capacitor.isPluginAvailable('Camera')) { /* ... */ }

// 6) Permission patterns:
// iOS: add NSCameraUsageDescription, NSPhotoLibraryUsageDescription to Info.plist
// Android: <uses-permission android:name="android.permission.CAMERA"/> in Manifest
// Capacitor will prompt the user the first time you call getPhoto().

npm install @capacitor/core @capacitor/cli
npx cap init MyApp com.example.myapp
npx cap add ios && npx cap add android
npx cap sync