expo-livekit-screen-share 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Arkadiusz Kubaczkowski
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,166 @@
+# expo-livekit-screen-share
+
+Expo config plugin that enables screen sharing for [LiveKit](https://livekit.io) React Native apps on **iOS** and **Android**.
+
+## What it does
+
+### iOS
+
+- Creates a **Broadcast Upload Extension** target in your Xcode project
+- Downloads the [Jitsi reference implementation](https://github.com/jitsi/jitsi-meet-sdk-samples/tree/master/ios/swift-screensharing/JitsiSDKScreenSharingTest/Broadcast%20Extension) Swift files during prebuild (cached locally)
+- Configures **App Groups** for inter-process communication between app and extension
+- Sets up `Info.plist`, entitlements, and Xcode build settings automatically
+
+### Android
+
+- Adds `FOREGROUND_SERVICE_MEDIA_PROJECTION` permission to `AndroidManifest.xml`
+- Enables LiveKit's screen share foreground service
+
+## Installation
+
+```sh
+npx expo install expo-livekit-screen-share
+```
+
+## Configuration
+
+Add the plugin to your `app.json` or `app.config.js`:
+
+```json
+{
+  "plugins": ["expo-livekit-screen-share"]
+}
+```
+
+### Options
+
+All options are optional with sensible defaults:
+
+```json
+{
+  "plugins": [
+    ["expo-livekit-screen-share", {
+      "ios": {
+        "extensionName": "ScreenShareExtension",
+        "deploymentTarget": "16.0",
+        "appGroupIdentifier": "group.com.example.myapp"
+      },
+      "android": {
+        "enableScreenShareService": true,
+        "foregroundServicePermission": true
+      }
+    }]
+  ]
+}
+```
+
+| Option | Platform | Default | Description |
+|--------|----------|---------|-------------|
+| `ios.extensionName` | iOS | `"ScreenShareExtension"` | Name of the Broadcast Upload Extension target |
+| `ios.deploymentTarget` | iOS | `"16.0"` | Minimum iOS deployment target for the extension |
+| `ios.appGroupIdentifier` | iOS | `"group.{bundleIdentifier}"` | Custom App Group identifier (if your project uses a different naming convention) |
+| `android.enableScreenShareService` | Android | `true` | Enable LiveKit's foreground service for screen sharing |
+| `android.foregroundServicePermission` | Android | `true` | Add `FOREGROUND_SERVICE_MEDIA_PROJECTION` permission |
+
+## iOS Setup (Apple Developer Portal)
+
+Before building, you need to register identifiers in the [Apple Developer Portal](https://developer.apple.com). Repeat these steps **for each environment** (development, staging, production):
+
+### 1. Register an App Group
+
+Identifiers > **+** > App Groups:
+- Identifier: `group.{your.bundle.identifier}` (e.g. `group.com.example.myapp`)
+
+### 2. Add App Group to your main App ID
+
+Identifiers > find your App ID > Edit > Capabilities > **App Groups** > select the group from step 1.
+
+### 3. Register Extension Bundle ID
+
+Identifiers > **+** > App IDs > type **App**:
+- Bundle ID: `{your.bundle.identifier}.ScreenShareExtension`
+- Enable **App Groups** capability > select the same group
+
+### 4. Provisioning
+
+If using **Xcode Automatic Signing** (development builds), Xcode handles provisioning profiles automatically.
+
+For **EAS Build**, add `appExtensions` to your config:
+
+```js
+// app.config.js
+extra: {
+  eas: {
+    build: {
+      experimental: {
+        ios: {
+          appExtensions: [{
+            targetName: 'ScreenShareExtension',
+            bundleIdentifier: `${bundleIdentifier}.ScreenShareExtension`,
+            entitlements: {
+              'com.apple.security.application-groups': [
+                `group.${bundleIdentifier}`,
+              ],
+            },
+          }],
+        },
+      },
+    },
+  },
+}
+```
+
+## Usage in your app
+
+### Start screen sharing
+
+```tsx
+import { useRoomContext } from '@livekit/react-native';
+
+// Android — call directly:
+await room.localParticipant.setScreenShareEnabled(true);
+
+// iOS — show broadcast picker first:
+import { ScreenCapturePickerView } from '@livekit/react-native-webrtc';
+import { findNodeHandle, NativeModules, Platform } from 'react-native';
+
+// Mount the invisible picker view somewhere in your component tree:
+<ScreenCapturePickerView ref={pickerRef} />
+
+// Then trigger it:
+if (Platform.OS === 'ios') {
+  const tag = findNodeHandle(pickerRef.current);
+  await NativeModules.ScreenCapturePickerViewManager.show(tag);
+}
+await room.localParticipant.setScreenShareEnabled(true);
+```
+
+### Check screen share state
+
+```tsx
+import { useLocalParticipant } from '@livekit/react-native';
+
+const { isScreenShareEnabled } = useLocalParticipant();
+```
+
+## How it works
+
+The iOS Broadcast Upload Extension runs as a separate process that captures the screen via ReplayKit. It communicates with the main app through a Unix domain socket (`rtc_SSFD`) in the shared App Group container. The `@livekit/react-native-webrtc` native module (`ScreenCapturer`) listens on this socket and feeds received frames into the WebRTC pipeline.
+
+Swift source files are downloaded from the [Jitsi reference implementation](https://github.com/jitsi/jitsi-meet-sdk-samples) during `expo prebuild` and cached in `node_modules/.cache/expo-livekit-screen-share/`. Delete this directory to force re-download.
+
+## Troubleshooting
+
+### Download fails during prebuild
+
+If you're building offline or behind a firewall, manually download the Swift files from [Jitsi SDK samples](https://github.com/jitsi/jitsi-meet-sdk-samples/tree/master/ios/swift-screensharing/JitsiSDKScreenSharingTest/Broadcast%20Extension) and place them in `node_modules/.cache/expo-livekit-screen-share/`.
+
+### iOS screen share doesn't start
+
+- Verify App Group identifiers match between the main app and extension
+- Check that `RTCScreenSharingExtension` and `RTCAppGroupIdentifier` are set in the main app's `Info.plist`
+- Ensure the extension's provisioning profile includes the App Group capability
+
+## License
+
+MIT

package/build/index.d.ts

@@ -0,0 +1,14 @@
+import { type ConfigPlugin } from "@expo/config-plugins";
+type ScreenShareOptions = {
+    ios?: {
+        extensionName?: string;
+        deploymentTarget?: string;
+        appGroupIdentifier?: string;
+    };
+    android?: {
+        enableScreenShareService?: boolean;
+        foregroundServicePermission?: boolean;
+    };
+};
+declare const withScreenShare: ConfigPlugin<ScreenShareOptions | undefined>;
+export default withScreenShare;

package/build/index.js

@@ -0,0 +1,244 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const config_plugins_1 = require("@expo/config-plugins");
+const plist_1 = __importDefault(require("@expo/plist"));
+const fs_1 = __importDefault(require("fs"));
+const https_1 = __importDefault(require("https"));
+const path_1 = __importDefault(require("path"));
+// --- Constants ---
+const DEFAULT_EXTENSION_NAME = "ScreenShareExtension";
+const DEFAULT_DEPLOYMENT_TARGET = "16.0";
+const ANDROID_SCREEN_SHARE_SERVICE_KEY = "io.livekit.reactnative.expo.ENABLE_SCREEN_SHARE_SERVICE";
+const JITSI_BASE_URL = "https://raw.githubusercontent.com/jitsi/jitsi-meet-sdk-samples/master/ios/swift-screensharing/JitsiSDKScreenSharingTest/Broadcast%20Extension";
+const SWIFT_FILES = [
+    "SampleHandler.swift",
+    "SampleUploader.swift",
+    "SocketConnection.swift",
+    "DarwinNotificationCenter.swift",
+    "Atomic.swift",
+];
+const JITSI_APP_GROUP_PLACEHOLDER = "group.com.jitsi.example-screensharing.appgroup";
+const CACHE_DIR = "node_modules/.cache/expo-livekit-screen-share";
+// --- Helpers ---
+function getAppGroupIdentifier(bundleIdentifier) {
+    return `group.${bundleIdentifier}`;
+}
+function getExtensionBundleIdentifier(bundleIdentifier, extensionName) {
+    return `${bundleIdentifier}.${extensionName}`;
+}
+function httpsGet(url) {
+    return new Promise((resolve, reject) => {
+        https_1.default
+            .get(url, (res) => {
+            if (res.statusCode &&
+                res.statusCode >= 300 &&
+                res.statusCode < 400 &&
+                res.headers.location) {
+                httpsGet(res.headers.location).then(resolve, reject);
+                return;
+            }
+            if (res.statusCode !== 200) {
+                reject(new Error(`Failed to download ${url}: ${res.statusCode}`));
+                return;
+            }
+            let data = "";
+            res.on("data", (chunk) => (data += chunk));
+            res.on("end", () => resolve(data));
+        })
+            .on("error", reject);
+    });
+}
+async function downloadSwiftFiles(cacheDir) {
+    const allCached = SWIFT_FILES.every((file) => fs_1.default.existsSync(path_1.default.join(cacheDir, file)));
+    if (allCached) {
+        console.log("[expo-livekit-screen-share] Using cached Swift files");
+        return;
+    }
+    fs_1.default.mkdirSync(cacheDir, { recursive: true });
+    console.log("[expo-livekit-screen-share] Downloading broadcast extension files from Jitsi reference...");
+    for (const file of SWIFT_FILES) {
+        const url = `${JITSI_BASE_URL}/${file}`;
+        try {
+            const content = await httpsGet(url);
+            fs_1.default.writeFileSync(path_1.default.join(cacheDir, file), content);
+            console.log(`  Downloaded ${file}`);
+        }
+        catch (error) {
+            throw new Error(`[expo-livekit-screen-share] Failed to download ${file}. ` +
+                `Ensure you have internet access or manually place the files in ${cacheDir}. ` +
+                `Original error: ${error}`);
+        }
+    }
+}
+// --- iOS Mods ---
+function withScreenShareInfoPlist(config, extensionName, appGroupId) {
+    return (0, config_plugins_1.withInfoPlist)(config, (mod) => {
+        const bundleId = mod.ios?.bundleIdentifier ?? "";
+        const appGroup = appGroupId ?? getAppGroupIdentifier(bundleId);
+        mod.modResults.RTCScreenSharingExtension = getExtensionBundleIdentifier(bundleId, extensionName);
+        mod.modResults.RTCAppGroupIdentifier = appGroup;
+        return mod;
+    });
+}
+function withScreenShareEntitlements(config, appGroupId) {
+    return (0, config_plugins_1.withEntitlementsPlist)(config, (mod) => {
+        const bundleId = mod.ios?.bundleIdentifier ?? "";
+        const appGroup = appGroupId ?? getAppGroupIdentifier(bundleId);
+        const existing = mod.modResults["com.apple.security.application-groups"] ??
+            [];
+        if (!existing.includes(appGroup)) {
+            mod.modResults["com.apple.security.application-groups"] = [
+                ...existing,
+                appGroup,
+            ];
+        }
+        return mod;
+    });
+}
+function withScreenShareXcodeProject(config, extensionName, deploymentTarget) {
+    return (0, config_plugins_1.withXcodeProject)(config, (mod) => {
+        const xcodeProject = mod.modResults;
+        const bundleId = mod.ios?.bundleIdentifier ?? "";
+        const extensionBundleId = getExtensionBundleIdentifier(bundleId, extensionName);
+        const existingTarget = xcodeProject.pbxTargetByName(extensionName);
+        if (existingTarget) {
+            return mod;
+        }
+        const target = xcodeProject.addTarget(extensionName, "app_extension", extensionName, extensionBundleId);
+        // Create PBXGroup for extension files
+        const group = xcodeProject.addPbxGroup(SWIFT_FILES, extensionName, extensionName, '"<group>"');
+        // Add group to main project's root group
+        const mainGroupId = xcodeProject.getFirstProject().firstProject.mainGroup;
+        xcodeProject.getPBXGroupByKey(mainGroupId).children.push({
+            value: group.uuid,
+            comment: extensionName,
+        });
+        // Add source files to extension target's build phase
+        xcodeProject.addBuildPhase(SWIFT_FILES.map((f) => `${extensionName}/${f}`), "PBXSourcesBuildPhase", "Sources", target.uuid);
+        // Configure build settings
+        const configurations = xcodeProject.pbxXCBuildConfigurationSection();
+        const targetConfigs = xcodeProject.pbxNativeTargetSection()[target.uuid]?.buildConfigurationList;
+        if (targetConfigs) {
+            const configList = xcodeProject.pbxXCConfigurationList()[targetConfigs];
+            if (configList?.buildConfigurations) {
+                for (const buildConfig of configList.buildConfigurations) {
+                    const configEntry = configurations[buildConfig.value];
+                    if (configEntry?.buildSettings) {
+                        configEntry.buildSettings.SWIFT_VERSION = "5.0";
+                        configEntry.buildSettings.IPHONEOS_DEPLOYMENT_TARGET =
+                            deploymentTarget;
+                        configEntry.buildSettings.TARGETED_DEVICE_FAMILY = '"1,2"';
+                        configEntry.buildSettings.CODE_SIGN_ENTITLEMENTS = `${extensionName}/${extensionName}.entitlements`;
+                        configEntry.buildSettings.CODE_SIGN_STYLE = "Automatic";
+                        configEntry.buildSettings.PRODUCT_BUNDLE_IDENTIFIER = `"${extensionBundleId}"`;
+                        configEntry.buildSettings.GENERATE_INFOPLIST_FILE = "NO";
+                        configEntry.buildSettings.INFOPLIST_FILE = `${extensionName}/Info.plist`;
+                        configEntry.buildSettings.CURRENT_PROJECT_VERSION = "1";
+                        configEntry.buildSettings.MARKETING_VERSION = "1.0";
+                    }
+                }
+            }
+        }
+        return mod;
+    });
+}
+function withScreenShareExtensionFiles(config, extensionName, appGroupId) {
+    return (0, config_plugins_1.withDangerousMod)(config, [
+        "ios",
+        async (mod) => {
+            const bundleId = mod.ios?.bundleIdentifier ?? "";
+            const appGroup = appGroupId ?? getAppGroupIdentifier(bundleId);
+            const iosPath = path_1.default.resolve(mod.modRequest.platformProjectRoot);
+            const extensionPath = path_1.default.join(iosPath, extensionName);
+            const projectRoot = mod.modRequest.projectRoot;
+            const cacheDir = path_1.default.join(projectRoot, CACHE_DIR);
+            // Download Swift files (with caching)
+            await downloadSwiftFiles(cacheDir);
+            fs_1.default.mkdirSync(extensionPath, { recursive: true });
+            // Build extension Info.plist
+            const extensionInfoPlist = {
+                CFBundleDevelopmentRegion: "$(DEVELOPMENT_LANGUAGE)",
+                CFBundleDisplayName: "Screen Share",
+                CFBundleExecutable: "$(EXECUTABLE_NAME)",
+                CFBundleIdentifier: "$(PRODUCT_BUNDLE_IDENTIFIER)",
+                CFBundleInfoDictionaryVersion: "6.0",
+                CFBundleName: "$(PRODUCT_NAME)",
+                CFBundlePackageType: "$(PRODUCT_BUNDLE_PACKAGE_TYPE)",
+                CFBundleShortVersionString: "$(MARKETING_VERSION)",
+                CFBundleVersion: "$(CURRENT_PROJECT_VERSION)",
+                NSExtension: {
+                    NSExtensionPointIdentifier: "com.apple.broadcast-services-upload",
+                    NSExtensionPrincipalClass: "$(PRODUCT_MODULE_NAME).SampleHandler",
+                },
+            };
+            fs_1.default.writeFileSync(path_1.default.join(extensionPath, "Info.plist"), plist_1.default.build(extensionInfoPlist));
+            // Copy Swift files, replacing app group identifier in SampleHandler
+            for (const file of SWIFT_FILES) {
+                let content = fs_1.default.readFileSync(path_1.default.join(cacheDir, file), "utf8");
+                if (file === "SampleHandler.swift") {
+                    content = content.replace(JITSI_APP_GROUP_PLACEHOLDER, appGroup);
+                }
+                fs_1.default.writeFileSync(path_1.default.join(extensionPath, file), content);
+            }
+            // Write entitlements
+            const entitlements = {
+                "com.apple.security.application-groups": [appGroup],
+            };
+            fs_1.default.writeFileSync(path_1.default.join(extensionPath, `${extensionName}.entitlements`), plist_1.default.build(entitlements));
+            return mod;
+        },
+    ]);
+}
+// --- Android Mods ---
+function withScreenShareAndroidPermission(config) {
+    return (0, config_plugins_1.withAndroidManifest)(config, (mod) => {
+        const manifest = mod.modResults.manifest;
+        if (!manifest["uses-permission"]) {
+            manifest["uses-permission"] = [];
+        }
+        const permission = "android.permission.FOREGROUND_SERVICE_MEDIA_PROJECTION";
+        const exists = manifest["uses-permission"].some((p) => p.$?.["android:name"] === permission);
+        if (!exists) {
+            manifest["uses-permission"].push({
+                $: { "android:name": permission },
+            });
+        }
+        return mod;
+    });
+}
+function withScreenShareAndroidService(config) {
+    return (0, config_plugins_1.withAndroidManifest)(config, (mod) => {
+        const mainApplication = config_plugins_1.AndroidConfig.Manifest.getMainApplicationOrThrow(mod.modResults);
+        // Remove existing entry for idempotency
+        if (mainApplication["meta-data"]) {
+            mainApplication["meta-data"] = mainApplication["meta-data"].filter((item) => item?.$?.["android:name"] !== ANDROID_SCREEN_SHARE_SERVICE_KEY);
+        }
+        config_plugins_1.AndroidConfig.Manifest.addMetaDataItemToMainApplication(mainApplication, ANDROID_SCREEN_SHARE_SERVICE_KEY, "true");
+        return mod;
+    });
+}
+// --- Main Plugin ---
+const withScreenShare = (config, options) => {
+    const extensionName = options?.ios?.extensionName ?? DEFAULT_EXTENSION_NAME;
+    const deploymentTarget = options?.ios?.deploymentTarget ?? DEFAULT_DEPLOYMENT_TARGET;
+    const appGroupId = options?.ios?.appGroupIdentifier;
+    const enableAndroidService = options?.android?.enableScreenShareService ?? true;
+    const enableAndroidPermission = options?.android?.foregroundServicePermission ?? true;
+    // iOS
+    config = withScreenShareInfoPlist(config, extensionName, appGroupId);
+    config = withScreenShareEntitlements(config, appGroupId);
+    config = withScreenShareXcodeProject(config, extensionName, deploymentTarget);
+    config = withScreenShareExtensionFiles(config, extensionName, appGroupId);
+    // Android
+    if (enableAndroidPermission) {
+        config = withScreenShareAndroidPermission(config);
+    }
+    if (enableAndroidService) {
+        config = withScreenShareAndroidService(config);
+    }
+    return config;
+};
+exports.default = withScreenShare;

package/package.json

@@ -0,0 +1,44 @@
+{
+  "name": "expo-livekit-screen-share",
+  "version": "0.1.0",
+  "description": "Expo config plugin for LiveKit screen sharing on iOS (Broadcast Upload Extension) and Android (foreground service)",
+  "main": "build/index.js",
+  "types": "build/index.d.ts",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/arekkubaczkowski/expo-livekit-screen-share"
+  },
+  "keywords": [
+    "expo",
+    "expo-plugin",
+    "livekit",
+    "screen-share",
+    "broadcast-extension",
+    "react-native",
+    "ios",
+    "android"
+  ],
+  "files": [
+    "build",
+    "README.md"
+  ],
+  "scripts": {
+    "build": "bun run tsc",
+    "prepublishOnly": "bun run build",
+    "release": "release-it"
+  },
+  "peerDependencies": {
+    "@livekit/react-native": ">=2.0.0",
+    "expo": ">=51.0.0"
+  },
+  "dependencies": {
+    "@expo/config-plugins": ">=8.0.0",
+    "@expo/plist": ">=0.1.0"
+  },
+  "devDependencies": {
+    "@types/node": "^25.5.0",
+    "release-it": "^19.2.4",
+    "typescript": "~5.9.3"
+  }
+}