From b9deec5dddda84caf050928b5dae82d7dd67c0a9 Mon Sep 17 00:00:00 2001 From: Alex Hunt Date: Thu, 19 Mar 2026 11:43:02 -0700 Subject: [PATCH] Add macOS 26 icon for RNDT (#56149) Summary: Pull Request resolved: https://github.com/facebook/react-native/pull/56149 Add `React Native DevTools.icon` file (Icon Composer) for macOS 26 Tahoe. Also rename previous `.icns` file for consistency. `electron/packager` is updated to `^18.4.4`, as `.icon` support was added in `18.4.0`. Changelog: [Internal] Differential Revision: D97292364 --- .github/workflows/test-all.yml | 2 +- flow-typed/npm/electron-packager_v18.x.x.js | 2 +- package.json | 2 +- .../{icon.icns => React Native DevTools.icns} | Bin .../Assets/logo_light.svg | 12 +++ .../React Native DevTools.icon/icon.json | 41 +++++++++ scripts/debugger-shell/build-binary.js | 78 ++++++++++++------ yarn.lock | 15 +++- 8 files changed, 120 insertions(+), 32 deletions(-) rename packages/debugger-shell/src/electron/resources/{icon.icns => React Native DevTools.icns} (100%) create mode 100644 packages/debugger-shell/src/electron/resources/React Native DevTools.icon/Assets/logo_light.svg create mode 100644 packages/debugger-shell/src/electron/resources/React Native DevTools.icon/icon.json diff --git a/.github/workflows/test-all.yml b/.github/workflows/test-all.yml index c889605a939a..1c2c32f12a41 100644 --- a/.github/workflows/test-all.yml +++ b/.github/workflows/test-all.yml @@ -624,7 +624,7 @@ jobs: run: yarn test-generated-typescript build_debugger_shell: - runs-on: ubuntu-latest + runs-on: macos-26 needs: check_code_changes if: needs.check_code_changes.outputs.debugger_shell == 'true' steps: diff --git a/flow-typed/npm/electron-packager_v18.x.x.js b/flow-typed/npm/electron-packager_v18.x.x.js index 4ac8b158eb5c..94312d144ec9 100644 --- a/flow-typed/npm/electron-packager_v18.x.x.js +++ b/flow-typed/npm/electron-packager_v18.x.x.js @@ -118,7 +118,7 @@ declare module '@electron/packager' { }; extraResource?: string | string[]; helperBundleId?: string; - icon?: string; + icon?: string | string[]; ignore?: RegExp | (string | RegExp)[] | IgnoreFunction; junk?: boolean; name?: string; diff --git a/package.json b/package.json index ee39fb489ecd..c094abebb004 100644 --- a/package.json +++ b/package.json @@ -53,7 +53,7 @@ "@babel/plugin-transform-regenerator": "^7.24.7", "@babel/preset-env": "^7.25.3", "@babel/preset-flow": "^7.24.7", - "@electron/packager": "^18.3.6", + "@electron/packager": "^18.4.4", "@expo/spawn-async": "^1.7.2", "@jest/create-cache-key-function": "^29.7.0", "@microsoft/api-extractor": "^7.52.2", diff --git a/packages/debugger-shell/src/electron/resources/icon.icns b/packages/debugger-shell/src/electron/resources/React Native DevTools.icns similarity index 100% rename from packages/debugger-shell/src/electron/resources/icon.icns rename to packages/debugger-shell/src/electron/resources/React Native DevTools.icns diff --git a/packages/debugger-shell/src/electron/resources/React Native DevTools.icon/Assets/logo_light.svg b/packages/debugger-shell/src/electron/resources/React Native DevTools.icon/Assets/logo_light.svg new file mode 100644 index 000000000000..18508013dfcd --- /dev/null +++ b/packages/debugger-shell/src/electron/resources/React Native DevTools.icon/Assets/logo_light.svg @@ -0,0 +1,12 @@ + + + logo_light + + + + + + + + + \ No newline at end of file diff --git a/packages/debugger-shell/src/electron/resources/React Native DevTools.icon/icon.json b/packages/debugger-shell/src/electron/resources/React Native DevTools.icon/icon.json new file mode 100644 index 000000000000..842309756868 --- /dev/null +++ b/packages/debugger-shell/src/electron/resources/React Native DevTools.icon/icon.json @@ -0,0 +1,41 @@ +{ + "fill" : { + "linear-gradient" : [ + "display-p3:0.21574,0.21966,0.23974,1.00000", + "display-p3:0.13729,0.14116,0.15294,1.00000" + ] + }, + "groups" : [ + { + "blur-material" : null, + "layers" : [ + { + "glass" : false, + "image-name" : "logo_light.svg", + "name" : "logo_light", + "position" : { + "scale" : 1.37, + "translation-in-points" : [ + 0, + 0 + ] + } + } + ], + "shadow" : { + "kind" : "neutral", + "opacity" : 0.5 + }, + "specular" : true, + "translucency" : { + "enabled" : false, + "value" : 0.5 + } + } + ], + "supported-platforms" : { + "squares" : [ + "macOS" + ] + } +} \ No newline at end of file diff --git a/scripts/debugger-shell/build-binary.js b/scripts/debugger-shell/build-binary.js index cb34bbffa502..f4ace06727b6 100644 --- a/scripts/debugger-shell/build-binary.js +++ b/scripts/debugger-shell/build-binary.js @@ -45,6 +45,28 @@ const PACKAGE_ROOT = path.join( 'packages', 'debugger-shell', ); +const ICON_BASE = path.join(PACKAGE_ROOT, 'src/electron/resources'); + +const platformConfigs = [ + { + platform: ['darwin'], + arch: ['x64', 'arm64'], + icon: [ + path.join(ICON_BASE, 'React Native DevTools.icns'), + path.join(ICON_BASE, 'React Native DevTools.icon'), + ], + }, + { + platform: ['win32'], + arch: ['x64', 'arm64'], + icon: path.join(ICON_BASE, 'icon.ico'), + }, + { + platform: ['linux'], + arch: ['x64', 'arm64'], + icon: path.join(ICON_BASE, 'icon.png'), + }, +]; async function main() { const pkg = JSON.parse( @@ -73,31 +95,37 @@ async function main() { await writeBuildInfo(); - await packager({ - dir: PACKAGE_ROOT, - icon: path.join(PACKAGE_ROOT, 'src/electron/resources/icon'), - platform: ['win32', 'darwin', 'linux'], - arch: ['x64', 'arm64'], - name: APP_NAME, - appVersion: pkg.version, - appCopyright: COPYRIGHT, - appCategoryType: 'public.app-category.developer-tools', - asar: true, - appBundleId: APP_BUNDLE_IDENTIFIER, - out: path.join(PACKAGE_ROOT, 'build'), - win32metadata: { - CompanyName: COMPANY_NAME, - ProductName: APP_NAME, - InternalName: APP_NAME, - FileDescription: `${APP_NAME}.exe`, - OriginalFilename: `${APP_NAME}.exe`, - }, - overwrite: true, - ignore: [ - ...IGNORE_PREFIXES.map(prefix => new RegExp('^' + escapeRegex(prefix))), - ...IGNORE_FILES.map(file => new RegExp('^' + escapeRegex(file) + '$')), - ], - }); + await Promise.all( + platformConfigs.map(platformConfig => + packager({ + ...platformConfig, + dir: PACKAGE_ROOT, + name: APP_NAME, + appVersion: pkg.version, + appCopyright: COPYRIGHT, + appCategoryType: 'public.app-category.developer-tools', + asar: true, + appBundleId: APP_BUNDLE_IDENTIFIER, + out: path.join(PACKAGE_ROOT, 'build'), + win32metadata: { + CompanyName: COMPANY_NAME, + ProductName: APP_NAME, + InternalName: APP_NAME, + FileDescription: `${APP_NAME}.exe`, + OriginalFilename: `${APP_NAME}.exe`, + }, + overwrite: true, + ignore: [ + ...IGNORE_PREFIXES.map( + prefix => new RegExp('^' + escapeRegex(prefix)), + ), + ...IGNORE_FILES.map( + file => new RegExp('^' + escapeRegex(file) + '$'), + ), + ], + }), + ), + ); } async function writeBuildInfo() { diff --git a/yarn.lock b/yarn.lock index 998af82d8371..55010667d52b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1123,10 +1123,10 @@ minimist "^1.2.6" plist "^3.0.5" -"@electron/packager@^18.3.6": - version "18.3.6" - resolved "https://registry.yarnpkg.com/@electron/packager/-/packager-18.3.6.tgz#3596399334866737bc33ab663e90376d7aad89e4" - integrity sha512-1eXHB5t+SQKvUiDpWGpvr90ZSSbXj+isrh3YbjCTjKT4bE4SQrKSBfukEAaBvp67+GXHFtCHjQgN9qSTFIge+Q== +"@electron/packager@^18.4.4": + version "18.4.4" + resolved "https://registry.yarnpkg.com/@electron/packager/-/packager-18.4.4.tgz#708458f73639c2aa919ce5f6250ac519fa53ee5c" + integrity sha512-fTUCmgL25WXTcFpM1M72VmFP8w3E4d+KNzWxmTDRpvwkfn/S206MAtM2cy0GF78KS9AwASMOUmlOIzCHeNxcGQ== dependencies: "@electron/asar" "^3.2.13" "@electron/get" "^3.0.0" @@ -1134,6 +1134,7 @@ "@electron/osx-sign" "^1.0.5" "@electron/universal" "^2.0.1" "@electron/windows-sign" "^1.0.0" + "@malept/cross-spawn-promise" "^2.0.0" debug "^4.0.1" extract-zip "^2.0.0" filenamify "^4.1.0" @@ -1143,6 +1144,7 @@ junk "^3.1.0" parse-author "^2.0.0" plist "^3.0.0" + prettier "^3.4.2" resedit "^2.0.0" resolve "^1.1.6" semver "^7.1.3" @@ -7832,6 +7834,11 @@ prettier@3.6.2: resolved "https://registry.yarnpkg.com/prettier/-/prettier-3.6.2.tgz#ccda02a1003ebbb2bfda6f83a074978f608b9393" integrity sha512-I7AIg5boAr5R0FFtJ6rCfD+LFsWHp81dolrFD8S79U9tb8Az2nGrJncnMSnys+bpQJfRUzqs9hnA81OAA3hCuQ== +prettier@^3.4.2: + version "3.8.1" + resolved "https://registry.yarnpkg.com/prettier/-/prettier-3.8.1.tgz#edf48977cf991558f4fcbd8a3ba6015ba2a3a173" + integrity sha512-UOnG6LftzbdaHZcKoPFtOcCKztrQ57WkHDeRD9t/PTQtmT0NHSeWWepj6pS0z/N7+08BHFDQVUrfmfMRcZwbMg== + pretty-format@^29.0.0, pretty-format@^29.7.0: version "29.7.0" resolved "https://registry.yarnpkg.com/pretty-format/-/pretty-format-29.7.0.tgz#ca42c758310f365bfa71a0bda0a807160b776812"