@react-native-tvos/config-tv 0.0.5 → 0.0.7

package/README.md

@@ -38,7 +38,16 @@ or
           "showVerboseWarnings": false,
           "tvosDeploymentTarget": "13.4",
           "removeFlipperOnAndroid": true,
-          "androidTVBanner": "assets/images/tv_banner.png"
+          "androidTVBanner": "assets/images/tv_banner.png",
+          "appleTVImages": {
+            "icon": "./assets/images/myimage-tvos-1280x768.png",
+            "iconSmall": "./assets/images/myimage-tvos-400x240.png",
+            "iconSmall2x": "./assets/images/myimage-tvos-800x480.png",
+            "topShelf": "./assets/images/myimage-tvos-1920x720.png",
+            "topShelf2x": "./assets/images/myimage-tvos-3840x1440.png",
+            "topShelfWide": "./assets/images/myimage-tvos-2320x720.png",
+            "topShelfWide2x": "./assets/images/myimage-tvos-4640x1440.png"
+          }
         }
       ]
     ]
@@ -52,12 +61,20 @@ _Plugin parameters_:
 
 - `isTV`: (optional boolean, default false) If true, prebuild should generate or modify Android and iOS files to build for TV (Android TV and Apple TV). If false, the plugin will have no effect. Setting the environment variable EXPO_TV to "true" or "1" will override this value and force a TV build.
 - `showVerboseWarnings`: Deprecated. Verbose logging is now shown as in other config plugins, by setting an environment variable:
-  - EXPO_DEBUG=1 (shows debug messages from all plugins)
-  - DEBUG=expo:\* (shows debug messages from all plugins)
-  - DEBUG=expo:react-native-tvos:config-tv (shows debug messages from this plugin only)
+  - `EXPO_DEBUG=1` (shows debug messages from all plugins)
+  - `DEBUG=expo:*` (shows debug messages from all plugins)
+  - `DEBUG=expo:react-native-tvos:config-tv` (shows debug messages from this plugin only)
 - `tvosDeploymentTarget`: (optional string, default '13.4') Used to set the tvOS deployment target version in the Xcode project.
 - `removeFlipperOnAndroid`: (optional boolean, default true) Used to remove the Flipper dependency from `MainApplication.kt` (or `MainApplication.java`) and `android/app/build.gradle`. This is necessary for React Native TV 0.73 and higher, since Flipper integration is removed from these versions. If this causes issues, set the value to false, run `npx expo prebuild --clean` again, and then remove Flipper from your Android source manually.
 - `androidTVBanner`: (optional string) If set, this should be a path to an existing PNG file appropriate for an Android TV banner image. See https://developer.android.com/design/ui/tv/guides/system/tv-app-icon-guidelines#banner . The Android manifest will be modified to reference this image, and the image will be copied into Android resource drawable directories.
+- `appleTVImages`: (optional object) If set, this is an object with the paths to images needed to construct the Apple TV icon and top shelf brand assets. The images will be used to construct a brand asset catalog in the Xcode project Image catalog, and the project updated to use the brand assets as the source for the app icons. If this property is set, all image paths must be defined and the files must exist, or an error will be thrown. The images need to be the exact sizes shown here, in order to avoid errors during Xcode compilation and on submission to the App Store or TestFlight.
+  - `icon`: (string) Path to a 1280x760 image
+  - `iconSmall`: (string) Path to a 400x240 image
+  - `iconSmall2x`: (string) Path to a 800x480 image
+  - `topShelf`: (string) Path to a 1920x720 image
+  - `topShelf2x`: (string) Path to a 3840x1440 image
+  - `topShelfWide`: (string) Path to a 2320x720 image
+  - `topShelfWide2x`: (string) Path to a 4640x1440 image
 
 _Warning_:
 
@@ -66,7 +83,7 @@ When this plugin is used to generate files in the iOS directory that build an Ap
 ```json
 {
   "dependencies": {
-    "react-native": "npm:react-native-tvos@^0.73.2-0"
+    "react-native": "npm:react-native-tvos@^0.73.6-0"
   }
 }
 ```

package/build/types.d.ts

@@ -1,3 +1,33 @@
+export type AppleTVImages = {
+    /**
+     * Path to 400x240 image
+     */
+    iconSmall: string;
+    /**
+     * Path to 800x480 image
+     */
+    iconSmall2x: string;
+    /**
+     * Path to 1280x760 image
+     */
+    icon: string;
+    /**
+     * Path to 1920x720 image
+     */
+    topShelf: string;
+    /**
+     * Path to 3840x1440 image
+     */
+    topShelf2x: string;
+    /**
+     * Path to 2320x720 image
+     */
+    topShelfWide: string;
+    /**
+     * Path to 4640x1440 image
+     */
+    topShelfWide2x: string;
+};
 export type ConfigData = {
     /**
      * If true, prebuild should generate Android and iOS files for TV (Android TV and Apple TV).
@@ -30,4 +60,13 @@ export type ConfigData = {
      * Android resource drawable directories.
      */
     androidTVBanner?: string;
+    /**
+     * If set, this is an object with the paths to images needed to construct the Apple TV icon and
+     * top shelf brand assets. The images will be used to construct a brand asset catalog in the Xcode
+     * project Image catalog, and the project updated to use the brand assets as the source for the app
+     * icons. If this property is set, all six image paths must be defined and the files must exist,
+     * or an error will be thrown. The images need to be the exact sizes shown here, in order to avoid
+     * errors during Xcode compilation and on submission to the App Store or TestFlight.
+     */
+    appleTVImages?: AppleTVImages;
 };

package/build/utils/appleBrandAssets.d.ts

@@ -0,0 +1,85 @@
+export type ContentsJsonImageIdiom = 'tv';
+export type ContentsJsonImageAppearance = {
+    appearance: 'luminosity';
+    value: 'dark';
+};
+export type ContentsJsonImageScale = '1x' | '2x' | '3x';
+export type ContentsJsonImageRole = 'primary-app-icon' | 'top-shelf-image' | 'top-shelf-image-wide';
+export interface ContentsJsonImage {
+    appearances?: ContentsJsonImageAppearance[];
+    idiom: ContentsJsonImageIdiom;
+    size?: string;
+    scale?: ContentsJsonImageScale;
+    filename: string;
+}
+export interface ContentsJsonImageLayer {
+    filename: string;
+}
+export interface ContentsJsonAsset {
+    filename?: string;
+    idiom?: ContentsJsonImageIdiom;
+    role?: ContentsJsonImageRole;
+    size?: string;
+}
+export interface ContentsJson {
+    assets?: ContentsJsonAsset[];
+    images?: ContentsJsonImage[];
+    layers?: ContentsJsonImageLayer[];
+    info: {
+        version: number;
+        author: string;
+    };
+}
+export interface SourceImageJson {
+    path: string;
+    scale?: string;
+}
+export interface SourceImageSetJson {
+    name: string;
+    sourceImages: SourceImageJson[];
+}
+export interface SourceImageLayerJson {
+    name: string;
+    sourceImages: SourceImageJson[];
+}
+export interface SourceImageStackJson {
+    name: string;
+    sourceLayers: SourceImageLayerJson[];
+}
+export interface SourceBrandAssetJson {
+    role: ContentsJsonImageRole;
+    size: string;
+    imageStack?: SourceImageStackJson;
+    imageSet?: SourceImageSetJson;
+}
+export interface SourceBrandAssetsJson {
+    name: string;
+    assets: SourceBrandAssetJson[];
+}
+/**
+ * Writes the Config.json which is used to assign images to their respective platform, dpi, and idiom.
+ *
+ * @param directory path to add the Contents.json to.
+ * @param contents image json data
+ */
+export declare function writeContentsJsonAsync(directory: string, options: {
+    assets?: ContentsJsonAsset[];
+    images?: ContentsJsonImage[];
+    layers?: ContentsJsonImageLayer[];
+}): Promise<void>;
+/**
+ * Creates an image set directory with its Contents.json and any images
+ */
+export declare function createImageSetAsync(destinationPath: string, imageSet: SourceImageSetJson): Promise<void>;
+/**
+ * Creates an image stack layer directory with its Contents.json and any images
+ */
+export declare function createImageStackLayerAsync(destinationPath: string, layer: SourceImageLayerJson): Promise<void>;
+/**
+ * Creates an image stack directory with its Contents.json and any layers
+ */
+export declare function createImageStackAsync(destinationPath: string, stack: SourceImageStackJson): Promise<void>;
+/**
+ * Creates a brand assets directory with its Contents.json and any assets
+ */
+export declare function createBrandAssetsAsync(destinationPath: string, brandAssets: SourceBrandAssetsJson): Promise<void>;

package/build/utils/appleBrandAssets.js

@@ -0,0 +1,113 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createBrandAssetsAsync = exports.createImageStackAsync = exports.createImageStackLayerAsync = exports.createImageSetAsync = exports.writeContentsJsonAsync = void 0;
+const fs_1 = require("fs");
+const path_1 = __importDefault(require("path"));
+/**
+ * Writes the Config.json which is used to assign images to their respective platform, dpi, and idiom.
+ *
+ * @param directory path to add the Contents.json to.
+ * @param contents image json data
+ */
+async function writeContentsJsonAsync(directory, options) {
+    await fs_1.promises.mkdir(directory, { recursive: true });
+    await fs_1.promises.writeFile(path_1.default.join(directory, 'Contents.json'), JSON.stringify({
+        assets: options.assets,
+        images: options.images,
+        layers: options.layers,
+        info: {
+            version: 1,
+            // common practice is for the tool that generated the icons to be the "author"
+            author: 'expo',
+        },
+    }, null, 2));
+}
+exports.writeContentsJsonAsync = writeContentsJsonAsync;
+/**
+ * Creates an image set directory with its Contents.json and any images
+ */
+async function createImageSetAsync(destinationPath, imageSet) {
+    const imageSetPath = path_1.default.join(destinationPath, `${imageSet.name}.imageset`);
+    await writeContentsJsonAsync(imageSetPath, {
+        images: imageSet.sourceImages.map((image) => ({
+            filename: path_1.default.basename(image.path),
+            idiom: 'tv',
+            scale: image.scale,
+        })),
+    });
+    for (const image of imageSet.sourceImages) {
+        await fs_1.promises.copyFile(image.path, path_1.default.join(imageSetPath, path_1.default.basename(image.path)));
+    }
+}
+exports.createImageSetAsync = createImageSetAsync;
+/**
+ * Creates an image stack layer directory with its Contents.json and any images
+ */
+async function createImageStackLayerAsync(destinationPath, layer) {
+    const imageStackLayerPath = path_1.default.join(destinationPath, `${layer.name}.imagestacklayer`);
+    await writeContentsJsonAsync(imageStackLayerPath, {});
+    await createImageSetAsync(imageStackLayerPath, {
+        name: 'Content',
+        sourceImages: layer.sourceImages,
+    });
+}
+exports.createImageStackLayerAsync = createImageStackLayerAsync;
+/**
+ * Creates an image stack directory with its Contents.json and any layers
+ */
+async function createImageStackAsync(destinationPath, stack) {
+    const imageStackPath = path_1.default.join(destinationPath, `${stack.name}.imagestack`);
+    await writeContentsJsonAsync(imageStackPath, {
+        layers: stack.sourceLayers.map((layer) => ({
+            filename: `${layer.name}.imagestacklayer`,
+        })),
+    });
+    for (const sourceLayer of stack.sourceLayers) {
+        await createImageStackLayerAsync(imageStackPath, {
+            name: sourceLayer.name,
+            sourceImages: sourceLayer.sourceImages,
+        });
+    }
+}
+exports.createImageStackAsync = createImageStackAsync;
+/**
+ * Creates a brand assets directory with its Contents.json and any assets
+ */
+async function createBrandAssetsAsync(destinationPath, brandAssets) {
+    const brandAssetsPath = path_1.default.join(destinationPath, `${brandAssets.name}.brandassets`);
+    await writeContentsJsonAsync(brandAssetsPath, {
+        assets: brandAssets.assets.map((brandAsset) => {
+            if (brandAsset.imageStack) {
+                return {
+                    filename: `${brandAsset.imageStack.name}.imagestack`,
+                    role: brandAsset.role,
+                    size: brandAsset.size,
+                    idiom: 'tv',
+                };
+            }
+            else if (brandAsset.imageSet) {
+                return {
+                    filename: `${brandAsset.imageSet.name}.imageset`,
+                    role: brandAsset.role,
+                    size: brandAsset.size,
+                    idiom: 'tv',
+                };
+            }
+            else {
+                return {}; // Should never happen, but need this to keep Typescript happy
+            }
+        }),
+    });
+    for (const asset of brandAssets.assets) {
+        if (asset.imageSet) {
+            await createImageSetAsync(brandAssetsPath, asset.imageSet);
+        }
+        if (asset.imageStack) {
+            await createImageStackAsync(brandAssetsPath, asset.imageStack);
+        }
+    }
+}
+exports.createBrandAssetsAsync = createBrandAssetsAsync;

package/build/{utils.d.ts → utils/config.d.ts}

@@ -1,12 +1,8 @@
-import { ConfigData } from './types';
+import { ConfigData } from '../types';
 export declare const packageNameAndVersion: string;
 export declare function isTVEnabled(params: ConfigData): boolean;
-export declare function showVerboseWarnings(params: ConfigData): boolean;
 export declare function tvosDeploymentTarget(params: ConfigData): string;
 export declare function shouldRemoveFlipperOnAndroid(params: ConfigData): boolean;
 export declare function androidTVBanner(params: ConfigData): string | undefined;
-export declare function verboseLog(message: string, options?: {
-    params?: ConfigData;
-    platform?: 'android' | 'ios';
-    property?: string;
-}): void;
+export declare const appleTVImageTypes: string[];
+export declare function appleTVImagePathForType(params: ConfigData, imageType: string): string | undefined;

package/build/utils/config.js

@@ -0,0 +1,60 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.appleTVImagePathForType = exports.appleTVImageTypes = exports.androidTVBanner = exports.shouldRemoveFlipperOnAndroid = exports.tvosDeploymentTarget = exports.isTVEnabled = exports.packageNameAndVersion = void 0;
+const getenv_1 = require("getenv");
+class Env {
+    /** Enable prebuild for TV */
+    get EXPO_TV() {
+        return (0, getenv_1.boolish)('EXPO_TV', false);
+    }
+}
+const env = new Env();
+const pkg = require('../../package.json');
+const defaultTvosDeploymentVersion = '13.4';
+exports.packageNameAndVersion = `${pkg.name}@${pkg.version}`;
+function isTVEnabled(params) {
+    return env.EXPO_TV || (params?.isTV ?? false);
+}
+exports.isTVEnabled = isTVEnabled;
+function tvosDeploymentTarget(params) {
+    return params?.tvosDeploymentTarget ?? defaultTvosDeploymentVersion;
+}
+exports.tvosDeploymentTarget = tvosDeploymentTarget;
+function shouldRemoveFlipperOnAndroid(params) {
+    return params?.removeFlipperOnAndroid ?? true;
+}
+exports.shouldRemoveFlipperOnAndroid = shouldRemoveFlipperOnAndroid;
+function androidTVBanner(params) {
+    return params?.androidTVBanner;
+}
+exports.androidTVBanner = androidTVBanner;
+exports.appleTVImageTypes = [
+    'icon',
+    'iconSmall',
+    'iconSmall2x',
+    'topShelf',
+    'topShelf2x',
+    'topShelfWide',
+    'topShelfWide2x',
+];
+function appleTVImagePathForType(params, imageType) {
+    switch (imageType) {
+        case 'icon':
+            return params?.appleTVImages?.icon;
+        case 'iconSmall':
+            return params?.appleTVImages?.iconSmall;
+        case 'iconSmall2x':
+            return params?.appleTVImages?.iconSmall2x;
+        case 'topShelf':
+            return params?.appleTVImages?.topShelf;
+        case 'topShelf2x':
+            return params?.appleTVImages?.topShelf2x;
+        case 'topShelfWide':
+            return params?.appleTVImages?.topShelfWide;
+        case 'topShelfWide2x':
+            return params?.appleTVImages?.topShelfWide2x;
+        default:
+            return undefined;
+    }
+}
+exports.appleTVImagePathForType = appleTVImagePathForType;

package/build/utils/index.d.ts

@@ -0,0 +1,3 @@
+export * from './appleBrandAssets';
+export * from './config';
+export * from './log';

package/build/utils/index.js

@@ -0,0 +1,19 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./appleBrandAssets"), exports);
+__exportStar(require("./config"), exports);
+__exportStar(require("./log"), exports);

package/build/utils/log.d.ts

@@ -0,0 +1,6 @@
+import { ConfigData } from '../types';
+export declare function verboseLog(message: string, options?: {
+    params?: ConfigData;
+    platform?: 'android' | 'ios';
+    property?: string;
+}): void;

package/build/utils/log.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.verboseLog = void 0;
+const debug = require('debug')('expo:react-native-tvos:config-tv');
+function verboseLog(message, options) {
+    const tokens = [message];
+    options?.property && tokens.unshift(options?.property);
+    options?.platform && tokens.unshift(options?.platform);
+    debug(tokens.join(': '));
+}
+exports.verboseLog = verboseLog;

package/build/withTV.js

@@ -2,6 +2,8 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const config_plugins_1 = require("expo/config-plugins");
 const withTVAndroidManifest_1 = require("./withTVAndroidManifest");
+const withTVAppleIconImages_1 = require("./withTVAppleIconImages");
+const withTVInfoPlist_1 = require("./withTVInfoPlist");
 const withTVPodfile_1 = require("./withTVPodfile");
 const withTVSplashScreen_1 = require("./withTVSplashScreen");
 const withTVXcodeProject_1 = require("./withTVXcodeProject");
@@ -18,8 +20,10 @@ const withTVPlugin = (config, params = {}) => {
         config = withTVNoEffect(config, params);
         return config;
     }
+    config = (0, withTVAppleIconImages_1.withTVAppleIconImages)(config, params); // This should be done before Apple Xcode project config
     config = (0, withTVXcodeProject_1.withTVXcodeProject)(config, params);
     config = (0, withTVPodfile_1.withTVPodfile)(config, params);
+    config = (0, withTVInfoPlist_1.withTVInfoPlist)(config, params);
     config = (0, withTVSplashScreen_1.withTVSplashScreen)(config, params);
     config = (0, withTVAndroidBannerImage_1.withTVAndroidBannerImage)(config, params); // This should be done before Android manifest config
     config = (0, withTVAndroidManifest_1.withTVAndroidManifest)(config, params);

package/build/withTVAndroidManifest.d.ts

@@ -5,3 +5,4 @@ export declare const withTVAndroidManifest: ConfigPlugin<ConfigData>;
 export declare function setLeanBackLauncherIntent(_config: Pick<ExpoConfig, 'android'>, androidManifest: AndroidConfig.Manifest.AndroidManifest, params: ConfigData): AndroidConfig.Manifest.AndroidManifest;
 export declare function removePortraitOrientation(_config: Pick<ExpoConfig, 'android'>, androidManifest: AndroidConfig.Manifest.AndroidManifest, params: ConfigData): AndroidConfig.Manifest.AndroidManifest;
 export declare function setTVBanner(_config: Pick<ExpoConfig, 'android'>, androidManifest: AndroidConfig.Manifest.AndroidManifest, params: ConfigData, androidTVBannerPath: string | undefined): AndroidConfig.Manifest.AndroidManifest;
+export declare function addTouchscreenHardwareFeatureToManifest(_config: Pick<ExpoConfig, 'android'>, androidManifest: AndroidConfig.Manifest.AndroidManifest, params: ConfigData): AndroidConfig.Manifest.AndroidManifest;

package/build/withTVAndroidManifest.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.setTVBanner = exports.removePortraitOrientation = exports.setLeanBackLauncherIntent = exports.withTVAndroidManifest = void 0;
+exports.addTouchscreenHardwareFeatureToManifest = exports.setTVBanner = exports.removePortraitOrientation = exports.setLeanBackLauncherIntent = exports.withTVAndroidManifest = void 0;
 const config_plugins_1 = require("expo/config-plugins");
 const utils_1 = require("./utils");
 const { getMainActivity, getMainApplication } = config_plugins_1.AndroidConfig.Manifest;
@@ -9,6 +9,7 @@ const withTVAndroidManifest = (config, params = {}) => {
     return (0, config_plugins_1.withAndroidManifest)(config, (config) => {
         config.modResults = setLeanBackLauncherIntent(config, config.modResults, params);
         config.modResults = removePortraitOrientation(config, config.modResults, params);
+        config.modResults = addTouchscreenHardwareFeatureToManifest(config, config.modResults, params);
         if (androidTVBannerPath) {
             config.modResults = setTVBanner(config, config.modResults, params, androidTVBannerPath);
         }
@@ -90,3 +91,39 @@ function setTVBanner(_config, androidManifest, params, androidTVBannerPath) {
     return androidManifest;
 }
 exports.setTVBanner = setTVBanner;
+function addTouchscreenHardwareFeatureToManifest(_config, androidManifest, params) {
+    // Add `<uses-feature android:name="android.hardware.touchscreen" android:required="false"/>` to the AndroidManifest.xml
+    if (!Array.isArray(androidManifest.manifest['uses-feature'])) {
+        androidManifest.manifest['uses-feature'] = [];
+    }
+    if (!androidManifest.manifest['uses-feature'].find((item) => item.$['android:name'] === 'android.hardware.touchscreen') &&
+        !androidManifest.manifest['uses-feature'].find((item) => item.$['android:name'] === 'android.hardware.faketouch') &&
+        !androidManifest.manifest['uses-feature'].find((item) => item.$['android:name'] === 'android.software.leanback')) {
+        (0, utils_1.verboseLog)('adding TV touchscreen hardware feature tag to AndroidManifest.xml', {
+            params,
+            platform: 'android',
+            property: 'manifest',
+        });
+        androidManifest.manifest['uses-feature']?.push({
+            $: {
+                'android:name': 'android.hardware.touchscreen',
+                'android:required': 'false',
+            },
+        });
+        androidManifest.manifest['uses-feature']?.push({
+            $: {
+                'android:name': 'android.hardware.faketouch',
+                'android:required': 'false',
+            },
+        });
+        // add android.software.leanback to false
+        androidManifest.manifest['uses-feature']?.push({
+            $: {
+                'android:name': 'android.software.leanback',
+                'android:required': 'false',
+            },
+        });
+    }
+    return androidManifest;
+}
+exports.addTouchscreenHardwareFeatureToManifest = addTouchscreenHardwareFeatureToManifest;

package/build/withTVAppleIconImages.d.ts

@@ -0,0 +1,7 @@
+import { ConfigPlugin } from 'expo/config-plugins';
+import { ConfigData } from './types';
+/**
+ * Constructs Apple TV brand assets from images passed into the `appleTVImages` plugin property
+ * If any images do not exist, an exception is thrown.
+ */
+export declare const withTVAppleIconImages: ConfigPlugin<ConfigData>;

package/build/withTVAppleIconImages.js

@@ -0,0 +1,179 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.withTVAppleIconImages = void 0;
+const config_plugins_1 = require("expo/config-plugins");
+const fs_1 = require("fs");
+const path_1 = __importDefault(require("path"));
+const utils_1 = require("./utils");
+const { getProjectName } = config_plugins_1.IOSConfig.XcodeUtils;
+/**
+ * Constructs Apple TV brand assets from images passed into the `appleTVImages` plugin property
+ * If any images do not exist, an exception is thrown.
+ */
+const withTVAppleIconImages = (c, params = {}) => {
+    return (0, config_plugins_1.withDangerousMod)(c, [
+        'ios',
+        // eslint-disable-next-line @typescript-eslint/explicit-function-return-type
+        async (config) => {
+            if (!params.appleTVImages) {
+                return config;
+            }
+            (0, utils_1.verboseLog)(`adding Apple TV brand assets to Apple TV native code`, {
+                params,
+                platform: 'ios',
+                property: 'xcodeproject',
+            });
+            utils_1.appleTVImageTypes.forEach((imageType) => {
+                const imagePath = (0, utils_1.appleTVImagePathForType)(params, imageType);
+                if (!imagePath) {
+                    throw new Error(`One or more image paths not defined`);
+                }
+                if (!(0, fs_1.existsSync)(imagePath)) {
+                    throw new Error(`No image found at path ${imagePath}`);
+                }
+            });
+            const projectRoot = config.modRequest.projectRoot;
+            const iosImagesPath = path_1.default.join(getIosNamedProjectPath(projectRoot), IMAGES_PATH);
+            const iconSmallSourceImages = [
+                {
+                    path: params.appleTVImages.iconSmall,
+                    scale: '1x',
+                },
+                {
+                    path: params.appleTVImages.iconSmall2x,
+                    scale: '2x',
+                },
+            ];
+            const iconLargeSourceImages = [
+                {
+                    path: params.appleTVImages.icon,
+                    scale: '1x',
+                },
+            ];
+            /*
+            const appStoreIconSourceImages: SourceImageJson[] = [
+              {
+                path: params.appleTVImages.icon,
+              },
+            ];
+             */
+            const topShelfSourceImages = [
+                {
+                    path: params.appleTVImages.topShelf,
+                    scale: '1x',
+                },
+                {
+                    path: params.appleTVImages.topShelf2x,
+                    scale: '2x',
+                },
+            ];
+            const topShelfWideSourceImages = [
+                {
+                    path: params.appleTVImages.topShelfWide,
+                    scale: '1x',
+                },
+                {
+                    path: params.appleTVImages.topShelfWide2x,
+                    scale: '2x',
+                },
+            ];
+            const sourceBrandAssets = {
+                name: 'TVAppIcon',
+                assets: [
+                    {
+                        role: 'top-shelf-image',
+                        size: '1920x720',
+                        imageSet: {
+                            name: 'Top Shelf Image',
+                            sourceImages: topShelfSourceImages,
+                        },
+                    },
+                    {
+                        role: 'top-shelf-image-wide',
+                        size: '2320x720',
+                        imageSet: {
+                            name: 'Top Shelf Image Wide',
+                            sourceImages: topShelfWideSourceImages,
+                        },
+                    },
+                    /*
+                    {
+                      role: 'primary-app-icon',
+                      size: '1280x768',
+                      imageStack: {
+                        name: 'App Icon - App Store',
+                        sourceLayers: [
+                          {
+                            name: 'Front',
+                            sourceImages: appStoreIconSourceImages,
+                          },
+                          {
+                            name: 'Middle',
+                            sourceImages: appStoreIconSourceImages,
+                          },
+                          {
+                            name: 'Back',
+                            sourceImages: appStoreIconSourceImages,
+                          },
+                        ],
+                      },
+                    },
+                     */
+                    {
+                        role: 'primary-app-icon',
+                        size: '400x240',
+                        imageStack: {
+                            name: 'App Icon - Small',
+                            sourceLayers: [
+                                {
+                                    name: 'Front',
+                                    sourceImages: iconSmallSourceImages,
+                                },
+                                {
+                                    name: 'Middle',
+                                    sourceImages: iconSmallSourceImages,
+                                },
+                                {
+                                    name: 'Back',
+                                    sourceImages: iconSmallSourceImages,
+                                },
+                            ],
+                        },
+                    },
+                    {
+                        role: 'primary-app-icon',
+                        size: '1280x768',
+                        imageStack: {
+                            name: 'App Icon - Large',
+                            sourceLayers: [
+                                {
+                                    name: 'Front',
+                                    sourceImages: iconLargeSourceImages,
+                                },
+                                {
+                                    name: 'Middle',
+                                    sourceImages: iconLargeSourceImages,
+                                },
+                                {
+                                    name: 'Back',
+                                    sourceImages: iconLargeSourceImages,
+                                },
+                            ],
+                        },
+                    },
+                ],
+            };
+            await (0, utils_1.createBrandAssetsAsync)(iosImagesPath, sourceBrandAssets);
+            return config;
+        },
+    ]);
+};
+exports.withTVAppleIconImages = withTVAppleIconImages;
+function getIosNamedProjectPath(projectRoot) {
+    const projectName = getProjectName(projectRoot);
+    return path_1.default.join(projectRoot, 'ios', projectName);
+}
+const IMAGES_PATH = 'Images.xcassets';

package/build/withTVInfoPlist.d.ts

@@ -0,0 +1,3 @@
+import { ConfigPlugin } from 'expo/config-plugins';
+import { ConfigData } from './types';
+export declare const withTVInfoPlist: ConfigPlugin<ConfigData>;

package/build/withTVInfoPlist.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.withTVInfoPlist = void 0;
+const config_plugins_1 = require("expo/config-plugins");
+const utils_1 = require("./utils");
+const withTVInfoPlist = (c, params = {}) => {
+    (0, utils_1.verboseLog)('Modifying UIRequiredDeviceCapabilities for TV', {
+        params,
+        platform: 'ios',
+        property: 'Info.plist',
+    });
+    return (0, config_plugins_1.withInfoPlist)(c, (config) => {
+        config.modResults.UIRequiredDeviceCapabilities = ['arm64'];
+        return config;
+    });
+};
+exports.withTVInfoPlist = withTVInfoPlist;

package/build/withTVXcodeProject.js

@@ -21,18 +21,24 @@ function setXcodeProjectBuildSettings(config, { project, params, deploymentTarge
     for (const { buildSettings } of Object.values(configurations || {})) {
         // Guessing that this is the best way to emulate Xcode.
         // Using `project.addToBuildSettings` modifies too many targets.
+        if (buildSettings !== undefined) {
+            buildSettings.SDKROOT = 'appletvos';
+        }
         if (typeof buildSettings?.PRODUCT_NAME !== 'undefined') {
-            if (buildSettings.TARGETED_DEVICE_FAMILY !== '3') {
-                (0, utils_1.verboseLog)(`modifying target ${buildSettings?.PRODUCT_NAME} for tvOS`, {
-                    params,
-                    platform: 'ios',
-                    property: 'xcodeproject',
-                });
-                buildSettings.TARGETED_DEVICE_FAMILY = '3';
-                buildSettings.TVOS_DEPLOYMENT_TARGET = deploymentTarget;
-                buildSettings.SDKROOT = 'appletvos';
-                if (typeof buildSettings?.IOS_DEPLOYMENT_TARGET !== 'undefined') {
-                    delete buildSettings?.IOS_DEPLOYMENT_TARGET;
+            (0, utils_1.verboseLog)(`modifying target ${buildSettings?.PRODUCT_NAME} for tvOS`, {
+                params,
+                platform: 'ios',
+                property: 'xcodeproject',
+            });
+            buildSettings.TARGETED_DEVICE_FAMILY = '3';
+            buildSettings.TVOS_DEPLOYMENT_TARGET = deploymentTarget;
+            if (typeof buildSettings?.IOS_DEPLOYMENT_TARGET !== 'undefined') {
+                delete buildSettings?.IOS_DEPLOYMENT_TARGET;
+            }
+            if (params.appleTVImages) {
+                // set the app icon source
+                if (buildSettings.ASSETCATALOG_COMPILER_APPICON_NAME === 'AppIcon') {
+                    buildSettings.ASSETCATALOG_COMPILER_APPICON_NAME = 'TVAppIcon';
                 }
             }
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-native-tvos/config-tv",
-  "version": "0.0.5",
+  "version": "0.0.7",
   "description": "Config plugin to reconfigure native directories for Apple TV and Android TV development if needed",
   "main": "build/withTV.js",
   "types": "build/withTV.d.ts",
@@ -39,7 +39,8 @@
   "devDependencies": {
     "@types/getenv": "^1.0.1",
     "expo-module-scripts": "^3.0.3",
-    "jest": "^29.7.0"
+    "jest": "^29.7.0",
+    "memfs": "^4.7.6"
   },
   "upstreamPackage": "tv",
   "dependencies": {

package/build/utils.js

@@ -1,42 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.verboseLog = exports.androidTVBanner = exports.shouldRemoveFlipperOnAndroid = exports.tvosDeploymentTarget = exports.showVerboseWarnings = exports.isTVEnabled = exports.packageNameAndVersion = void 0;
-const getenv_1 = require("getenv");
-class Env {
-    /** Enable prebuild for TV */
-    get EXPO_TV() {
-        return (0, getenv_1.boolish)('EXPO_TV', false);
-    }
-}
-const debug = require('debug')('expo:react-native-tvos:config-tv');
-const env = new Env();
-const pkg = require('../package.json');
-const defaultTvosDeploymentVersion = '13.4';
-exports.packageNameAndVersion = `${pkg.name}@${pkg.version}`;
-function isTVEnabled(params) {
-    return env.EXPO_TV || (params?.isTV ?? false);
-}
-exports.isTVEnabled = isTVEnabled;
-function showVerboseWarnings(params) {
-    return params?.showVerboseWarnings ?? false;
-}
-exports.showVerboseWarnings = showVerboseWarnings;
-function tvosDeploymentTarget(params) {
-    return params?.tvosDeploymentTarget ?? defaultTvosDeploymentVersion;
-}
-exports.tvosDeploymentTarget = tvosDeploymentTarget;
-function shouldRemoveFlipperOnAndroid(params) {
-    return params?.removeFlipperOnAndroid ?? true;
-}
-exports.shouldRemoveFlipperOnAndroid = shouldRemoveFlipperOnAndroid;
-function androidTVBanner(params) {
-    return params?.androidTVBanner;
-}
-exports.androidTVBanner = androidTVBanner;
-function verboseLog(message, options) {
-    const tokens = [message];
-    options?.property && tokens.unshift(options?.property);
-    options?.platform && tokens.unshift(options?.platform);
-    debug(tokens.join(': '));
-}
-exports.verboseLog = verboseLog;