one 2.10.0 → 2.11.0

package/macos/README.md

@@ -0,0 +1,170 @@
+# One on macOS
+
+Native macOS host for One, shipped inside the `one` package. Every Mac native
+byte lives under this directory so iOS, Android and web gain nothing. See
+`plans/one-macos-native.md` at the repo root.
+
+- `cpp/`: the macOS text layout manager and C++ glue for the React Native core
+- `host/`: the AppKit mounting layer, SwiftUI hosting and TurboModules
+- `react-native/`: JS overrides resolved only for `platform=macos`
+- `template/macos/`: the generated Mac app project
+
+## Native controls
+
+`One.macOS.Button` renders an AppKit `NSButton`. Pass `title`, an optional
+SF Symbol name in `systemImage`, `disabled`, and `onPress`. It draws the
+rounded push button bezel by default; `bordered={false}` keeps the same
+`NSButton` without a bezel, for small toolbar and footer icons. Set an
+`accessibilityLabel` for an image-only button. Both controls accept View props
+such as `style`, `testID`, `accessibilityLabel`, and `accessibilityHint`.
+
+`One.macOS.SegmentedControl` renders an AppKit `NSSegmentedControl` with
+`labels`, a controlled `selectedIndex` (zero based, or `-1` for no selection),
+`disabled`, and `onChange({ selectedIndex, revision })`. Accept a selection by
+updating `selectedIndex` in `onChange`; leaving it unchanged rejects the
+selection. Like Toggle, `revision` defaults to zero. Increment it to replace
+pending native interactions with an external value. Acknowledgements and
+native event counts use the existing V2 controlled-value protocol.
+
+```tsx
+<One.macOS.Button title="New pane" systemImage="plus" onPress={addPane} />
+<One.macOS.SegmentedControl
+  labels={['All', 'Shares', 'Flags', 'Asks']}
+  selectedIndex={filter}
+  onChange={({ selectedIndex }) => setFilter(selectedIndex)}
+/>
+```
+
+The app target must compile `host/swift/OneMacControls.swift` alongside
+`OneNativeControlled.swift` and import `OneMacosControlsHosting.h` in its
+bridging header, as the bundled template does. The Mac CMake target registers
+both Fabric components. These specs stay in `src/platform/mac`, outside iOS
+and Android codegen. Native AppKit children own keyboard and accessibility
+interaction; their actions do not activate the app or move the cursor.
+
+## System colors
+
+React Native's `PlatformColor` resolves to real AppKit colors. Each name is
+tried in order as an asset catalog color, then as an `NSColor` class color, so
+`PlatformColor('labelColor')` and `PlatformColor('label')` are both
+`NSColor.labelColor`. The view keeps the `NSColor` itself and AppKit resolves
+it while drawing, so appearance and system color changes, such as the
+accent color, repaint without a React render. High contrast variants follow
+the system Increase contrast setting; AppKit maps an app requested high
+contrast appearance to the plain one. A name that resolves nothing uses `{ fallback }`, or
+draws nothing.
+
+```tsx
+<View style={{ backgroundColor: PlatformColor('windowBackgroundColor') }}>
+  <Text style={{ color: PlatformColor('labelColor') }}>Inbox</Text>
+  <View style={{ backgroundColor: PlatformColor('controlAccentColor') }} />
+</View>
+```
+
+Ordinary colors stay packed sRGB values. Reading a system color as numbers,
+for example in an animation, takes the app's current appearance at that time.
+`DynamicColorIOS` is not supported on macOS.
+
+## Linear backgrounds
+
+React Native's `backgroundImage` paints linear gradients in the native view.
+It accepts the existing string and structured stop forms, including
+`PlatformColor` stops. Layers follow their declared order, clip to rounded
+bounds and stay below the border. Appearance and size changes repaint them.
+
+```tsx
+<View style={{
+  width: 160,
+  height: 32,
+  borderRadius: 8,
+  backgroundImage: 'linear-gradient(90deg, rgba(0, 100, 240, 0.5), transparent)',
+}} />
+```
+
+Radial and repeating gradients, transition hints and pattern-color stops are
+unsupported. A layer with unsupported stops is left unpainted. Native fixture
+recipes are in `tests/macos-basic/probe/GRADIENTS.md` in the repository.
+
+## JavaScript bundle
+
+Debug builds load `/index.bundle?platform=macos&dev=true&bytecode=hermes`
+from the dev server named by `OneDevServerURL` in `Info.plist` (default
+`http://localhost:8081`). The dev server compiles that bundle to Hermes
+bytecode with the `hermes-compiler` package React Native depends on, or
+`HERMESC_PATH` when set, so Hermes skips parsing it at launch.
+Release builds run `template/macos/scripts/bundle-js.sh` after linking: it
+bundles the app with the React Native CLI, which needs a
+`react-native.config.cjs` that re-exports `one/react-native-config`, compiles
+the result with the app's own `hermesc -O`, and embeds it as `main.jsbundle`.
+The host maps that file in place, with no copy and no main thread hop.
+`ONE_MACOS_BUNDLE_URL` overrides either. A Release build of
+`tests/macos-basic` on an M5 Max shows its main content about 140 ms after
+process start, against 624 ms from served plain JS.
+
+## Logs
+
+The host writes JS console output, errors and exceptions to the unified log
+under `[one-macos]`. Debug builds show the text, for example in
+`log show --predicate 'eventMessage CONTAINS "[one-macos]"'`. Release builds
+mark it private, so a logged token or credentialed URL is redacted unless the
+device has private data logging enabled.
+
+## App commands
+
+`One.macOS.AppCommands` puts commands in the native menu bar and key
+equivalents. Its config is react-native-gpui's `AppCommands` shape, so one
+command table serves both hosts.
+
+```tsx
+One.macOS.AppCommands.configure({
+  bindings: [
+    { id: 'pane.next', key: 'ctrl-tab' },
+    { id: 'pane.focusNext', key: 'tab', context: '!Input' },
+  ],
+  toolbar: [
+    { kind: 'flexibleSpace' },
+    { kind: 'action', id: 'pane.inspector', label: 'Toggle Inspector', systemImage: 'sidebar.right', badge: 2 },
+  ],
+  menus: [
+    { label: 'App', items: [{ kind: 'action', id: 'settings.open', label: 'Settings' }] },
+    { label: 'View', items: [{ kind: 'action', id: 'pane.next', label: 'Next Pane' }] },
+  ],
+})
+const remove = One.macOS.AppCommands.addListener((id) => run(id))
+```
+
+- The first menu joins the application menu below About. Other menus join a
+  menu with the same title, such as View, or become a new menu before Window.
+  The standard Edit, Window and Services menus stay in place.
+- Each item shows the first key of its command. Every key also gets a hidden
+  item that AppKit searches first, so a binding wins over a standard item with
+  the same key.
+- A context gates only the key, so a menu click still runs the command. The
+  host sets one identifier, `Input`, while a text input has focus.
+- An unsupported key, context or item throws from `configure` and leaves the
+  previous menus in place.
+- Items are disabled while no listener is registered, and a command reaches
+  each listener once.
+- Each root keeps its own config. The menu bar shows the config of the key
+  window's root, else the main window's, else the frontmost One window's, and
+  each action runs in the root that is current when it fires. An inactive app
+  has no key or main window, so after a window reorder its menus refresh on
+  the next event, such as a menu press.
+- SwiftUI rebuilds the menus it owns, so the host restores its items after
+  each menu edit. Stopping or reloading a root removes its items at once.
+
+The optional `toolbar` array owns the window's native `NSToolbar`. Actions use
+a typed SF Symbol name and route through that window's root, even while another
+window is current. A non-negative integer `badge` shows a system count badge on
+macOS 26 and later; zero removes it. Flexible spaces use AppKit's standard spacer.
+Items disable when the root has no command listener. Reconfiguring labels or
+badges preserves item identity; stopping the root or omitting `toolbar` restores
+the shell's previous toolbar. An empty array installs an empty toolbar.
+
+AppKit never matches a control-tab key equivalent, so the host runs those
+bindings from a key monitor. Commands do not activate the app or move the
+cursor.
+
+The segmented control's optional `controlRole` is `automatic` (the default), `tabs`, or
+`valueSelection`. On macOS 27 and later it sets AppKit's matching role. Older
+systems retain the existing rounded appearance and single-selection behavior.

package/macos/cpp/CMakeLists.txt

@@ -0,0 +1,157 @@
+cmake_minimum_required(VERSION 3.22)
+project(OneMacosCore LANGUAGES C CXX OBJCXX)
+
+# Compiles the platform neutral React Native C++ core from the app's installed
+# react-native for macOS, plus the One macOS host (AppKit mounting, text layout,
+# TurboModules). Inputs:
+#   -DRN_ROOT=<path to node_modules/react-native>
+#   -DRN_DEPS_ROOT=<dir holding ReactNativeDependenciesHeaders.xcframework>
+#   -DNITRO_ROOT=<path to node_modules/react-native-nitro-modules>
+#   -DOPSQLITE_ROOT=<path to node_modules/@op-engineering/op-sqlite>
+#   -DWORKLETS_ROOT=<path to node_modules/react-native-worklets>
+#   -DHERMES_ROOT=<extracted hermes-ios destroot, headers and hermesvm.framework>
+set(CMAKE_CXX_STANDARD 20)
+set(CMAKE_CXX_STANDARD_REQUIRED ON)
+set(CMAKE_OBJCXX_STANDARD 20)
+set(CMAKE_POSITION_INDEPENDENT_CODE ON)
+set(CMAKE_EXPORT_COMPILE_COMMANDS ON)
+
+if(NOT RN_ROOT OR NOT RN_DEPS_ROOT OR NOT NITRO_ROOT OR NOT WORKLETS_ROOT OR NOT OPSQLITE_ROOT OR NOT HERMES_ROOT)
+  message(FATAL_ERROR "set RN_ROOT, RN_DEPS_ROOT, NITRO_ROOT, WORKLETS_ROOT, OPSQLITE_ROOT and HERMES_ROOT")
+endif()
+
+set(ONE_CPP ${CMAKE_CURRENT_LIST_DIR})
+set(ONE_HOST ${CMAKE_CURRENT_LIST_DIR}/../host)
+set(ONE_SHARED_HOST ${CMAKE_CURRENT_LIST_DIR}/../../native-core/host)
+
+set(DEPS_HEADERS ${RN_DEPS_ROOT}/ReactNativeDependenciesHeaders.xcframework/macos-arm64_x86_64/Headers)
+
+include(${CMAKE_CURRENT_LIST_DIR}/../../native-core/rn-core.cmake)
+
+file(GLOB ONE_SOURCES CONFIGURE_DEPENDS
+  ${ONE_CPP}/*.cpp
+  ${ONE_CPP}/*.mm
+  ${ONE_CPP}/OneMacToggle/*.cpp
+  ${ONE_CPP}/OneMacToggle/*.mm
+  ${ONE_CPP}/OneMacImage/*.cpp
+  ${ONE_CPP}/OneMacButton/*.cpp
+  ${ONE_CPP}/OneMacButton/*.mm
+  ${ONE_CPP}/OneMacSegmentedControl/*.cpp
+  ${ONE_CPP}/OneMacSegmentedControl/*.mm
+  ${ONE_CPP}/OneMacPopUpButton/*.cpp
+  ${ONE_CPP}/OneMacPopUpButton/*.mm
+  ${ONE_CPP}/graphics/react/renderer/graphics/*.mm
+  ${ONE_CPP}/textlayoutmanager/*.mm
+  ${ONE_CPP}/textlayoutmanager/react/renderer/textlayoutmanager/*.mm
+  ${ONE_CPP}/textlayoutmanager/*.cpp
+  ${ONE_HOST}/*.mm
+  ${ONE_HOST}/*.cpp
+  ${ONE_HOST}/*/*.mm
+  ${ONE_HOST}/*/*.cpp
+  ${ONE_SHARED_HOST}/*.cpp
+)
+
+# apple only helpers from the iOS pod layout; they are plain foundation code
+set(RN_APPLE_SOURCES
+  ${RN_ROOT}/React/Fabric/Utils/PlatformRunLoopObserver.mm
+  ${RN_ROOT}/React/Fabric/AppleEventBeat.cpp
+  ${RC}/react/utils/platform/ios/react/utils/FollyConvert.mm
+  ${RC}/react/utils/platform/ios/react/utils/LowPriorityExecutor.mm
+)
+
+# Nitro's shared C++ core plus its Apple platform sources; the Swift and
+# ObjC glue stays out because the host installs Nitro from its own TurboModule
+file(GLOB_RECURSE NITRO_SOURCES CONFIGURE_DEPENDS ${NITRO_ROOT}/cpp/*.cpp)
+file(GLOB NITRO_APPLE_SOURCES CONFIGURE_DEPENDS
+  ${NITRO_ROOT}/ios/platform/*.cpp
+  ${NITRO_ROOT}/ios/threading/*.cpp
+)
+
+# worklets' shared C++ core plus its Foundation networking backend; its React
+# module glue stays out because the host installs the proxy from its own TurboModule
+file(GLOB_RECURSE WORKLETS_SOURCES CONFIGURE_DEPENDS ${WORKLETS_ROOT}/Common/cpp/worklets/*.cpp)
+file(GLOB WORKLETS_APPLE_SOURCES CONFIGURE_DEPENDS
+  ${WORKLETS_ROOT}/apple/worklets/apple/Networking/*.mm
+  ${WORKLETS_ROOT}/apple/worklets/apple/PlatformLogger.mm)
+
+file(READ ${WORKLETS_ROOT}/package.json WORKLETS_PACKAGE)
+string(JSON WORKLETS_VERSION GET "${WORKLETS_PACKAGE}" version)
+file(READ ${WORKLETS_ROOT}/src/featureFlags/staticFlags.json WORKLETS_FLAGS_JSON)
+string(JSON WORKLETS_FLAG_COUNT LENGTH "${WORKLETS_FLAGS_JSON}")
+set(WORKLETS_FEATURE_FLAGS "")
+math(EXPR WORKLETS_FLAG_LAST "${WORKLETS_FLAG_COUNT} - 1")
+foreach(i RANGE ${WORKLETS_FLAG_LAST})
+  string(JSON flag_name MEMBER "${WORKLETS_FLAGS_JSON}" ${i})
+  string(JSON flag_value GET "${WORKLETS_FLAGS_JSON}" ${flag_name})
+  string(TOLOWER "${flag_value}" flag_value)
+  string(APPEND WORKLETS_FEATURE_FLAGS "[${flag_name}:${flag_value}]")
+endforeach()
+
+# op-sqlite's shared C++ core on the system sqlite (its "phone version" path):
+# no bundled sqlite3.c, and the libsql, sqlcipher and turso backends stay out
+file(GLOB OPSQLITE_SOURCES CONFIGURE_DEPENDS ${OPSQLITE_ROOT}/cpp/*.cpp)
+
+add_library(OneMacosCore STATIC ${RN_SOURCES} ${RN_APPLE_SOURCES} ${NITRO_SOURCES} ${NITRO_APPLE_SOURCES} ${WORKLETS_SOURCES} ${WORKLETS_APPLE_SOURCES} ${OPSQLITE_SOURCES} ${ONE_SOURCES})
+
+# the pod flattens headers, so every Nitro source directory is an include root
+file(GLOB NITRO_INCLUDE_DIRS LIST_DIRECTORIES true ${NITRO_ROOT}/cpp/* ${NITRO_ROOT}/ios/*)
+
+target_include_directories(OneMacosCore PUBLIC
+  ${DEPS_HEADERS}
+  ${HERMES_ROOT}/include
+  ${RC}
+  ${RC}/jsi
+  ${RC}/callinvoker
+  ${RC}/runtimeexecutor
+  ${RC}/runtimeexecutor/platform/cxx
+  ${RC}/yoga
+  ${RC}/jsitooling
+  ${RC}/reactperflogger
+  ${RC}/react/renderer/imagemanager
+  ${RC}/jsiexecutor
+  ${RC}/react/nativemodule/core
+  # the macOS color backend shadows the cxx one; Float.h still comes from cxx
+  ${ONE_CPP}/graphics
+  ${RC}/react/renderer/graphics/platform/cxx
+  ${RC}/react/renderer/components/view/platform/cxx
+  ${RC}/react/renderer/components/scrollview/platform/cxx
+  ${RC}/react/renderer/components/text/platform/cxx
+  ${RC}/react/renderer/components/textinput/platform/ios
+  ${RC}/react/renderer/imagemanager/platform/cxx
+  ${RC}/react/utils/platform/ios
+  ${RC}/react/utils/platform/ios/react/utils
+  ${RN_ROOT}/React/Fabric
+  ${RN_ROOT}/React/Fabric/Utils
+  ${RN_ROOT}/React/FBReactNativeSpec
+  ${NITRO_INCLUDE_DIRS}
+  ${WORKLETS_ROOT}/Common/cpp
+  ${WORKLETS_ROOT}/apple
+  ${ONE_CPP}/textlayoutmanager
+  ${ONE_CPP}
+  ${ONE_HOST}
+  ${ONE_SHARED_HOST}
+)
+
+target_compile_definitions(OneMacosCore PUBLIC
+  FOLLY_NO_CONFIG=1
+  FOLLY_MOBILE=1
+  FOLLY_USE_LIBCPP=1
+  FOLLY_CFG_NO_COROUTINES=1
+  FOLLY_HAVE_CLOCK_GETTIME=1
+  RCT_NEW_ARCH_ENABLED=1
+  HERMES_V1_ENABLED=1
+  OP_SQLITE_USE_PHONE_VERSION=1
+  WORKLETS_VERSION=${WORKLETS_VERSION}
+  WORKLETS_FEATURE_FLAGS=${WORKLETS_FEATURE_FLAGS}
+  $<$<CONFIG:Debug>:HERMES_ENABLE_DEBUGGER=1>
+  REACT_NATIVE_DEBUGGER_ENABLED=1
+  REACT_NATIVE_DEBUGGER_ENABLED_DEVONLY=1
+  $<$<CONFIG:Debug>:DEBUG=1>
+)
+
+# op-sqlite's own headers are quote includes; <sqlite3.h> must stay the SDK's
+target_compile_options(OneMacosCore PRIVATE
+  -iquote ${OPSQLITE_ROOT}/cpp
+  -Wno-comma -Wno-shorten-64-to-32 -Wno-documentation -Wno-deprecated-declarations
+  $<$<COMPILE_LANGUAGE:OBJCXX>:-fobjc-arc>
+)

package/macos/cpp/OneMacButton/OneMacButtonComponentDescriptor.h

@@ -0,0 +1,11 @@
+#pragma once
+
+#include "OneMacButtonShadowNode.h"
+
+#include <react/renderer/core/ConcreteComponentDescriptor.h>
+
+namespace facebook::react {
+
+using OneMacButtonComponentDescriptor = ConcreteComponentDescriptor<OneMacButtonShadowNode>;
+
+} // namespace facebook::react

package/macos/cpp/OneMacButton/OneMacButtonEventEmitter.cpp

@@ -0,0 +1,7 @@
+#include "OneMacButtonEventEmitter.h"
+#include <folly/dynamic.h>
+namespace facebook::react {
+void OneMacButtonEventEmitter::onPress(const OnPress &event) const {
+  dispatchEvent("buttonPress", folly::dynamic::object(), RawEvent::Category::Discrete);
+}
+}

package/macos/cpp/OneMacButton/OneMacButtonEventEmitter.h

@@ -0,0 +1,11 @@
+#pragma once
+#include <react/renderer/components/view/ViewEventEmitter.h>
+namespace facebook::react {
+class OneMacButtonEventEmitter : public ViewEventEmitter {
+ public:
+  using ViewEventEmitter::ViewEventEmitter;
+  struct OnPress {
+  };
+  void onPress(const OnPress &) const;
+};
+}

package/macos/cpp/OneMacButton/OneMacButtonProps.cpp

@@ -0,0 +1,11 @@
+#include "OneMacButtonProps.h"
+#include <react/renderer/core/propsConversions.h>
+namespace facebook::react {
+OneMacButtonProps::OneMacButtonProps(const PropsParserContext &context, const OneMacButtonProps &sourceProps, const RawProps &rawProps)
+    : ViewProps(context, sourceProps, rawProps),
+      title(convertRawProp(context, rawProps, "title", sourceProps.title, std::string{})),
+      systemImage(convertRawProp(context, rawProps, "systemImage", sourceProps.systemImage, std::string{})),
+      disabled(convertRawProp(context, rawProps, "disabled", sourceProps.disabled, false)),
+      bordered(convertRawProp(context, rawProps, "bordered", sourceProps.bordered, true)),
+      prominent(convertRawProp(context, rawProps, "prominent", sourceProps.prominent, false)) {}
+}

package/macos/cpp/OneMacButton/OneMacButtonProps.h

@@ -0,0 +1,17 @@
+#pragma once
+#include <react/renderer/components/view/ViewProps.h>
+#include <react/renderer/core/PropsParserContext.h>
+#include <string>
+#include <vector>
+namespace facebook::react {
+class OneMacButtonProps final : public ViewProps {
+ public:
+  OneMacButtonProps() = default;
+  OneMacButtonProps(const PropsParserContext &, const OneMacButtonProps &, const RawProps &);
+  std::string title{};
+  std::string systemImage{};
+  bool disabled{false};
+  bool bordered{true};
+  bool prominent{false};
+};
+}

package/macos/cpp/OneMacButton/OneMacButtonShadowNode.h

@@ -0,0 +1,28 @@
+#pragma once
+
+#include "OneMacButtonEventEmitter.h"
+#include "OneMacButtonProps.h"
+
+#include <react/renderer/components/view/ConcreteViewShadowNode.h>
+
+namespace facebook::react {
+
+extern const char OneMacButtonComponentName[];
+
+// leaf layout uses the system control font and standard AppKit control insets
+class OneMacButtonShadowNode final
+    : public ConcreteViewShadowNode<OneMacButtonComponentName, OneMacButtonProps, OneMacButtonEventEmitter> {
+ public:
+  using ConcreteViewShadowNode::ConcreteViewShadowNode;
+
+  static ShadowNodeTraits BaseTraits() {
+    auto traits = ConcreteViewShadowNode::BaseTraits();
+    traits.set(ShadowNodeTraits::Trait::LeafYogaNode);
+    traits.set(ShadowNodeTraits::Trait::MeasurableYogaNode);
+    return traits;
+  }
+
+  Size measureContent(const LayoutContext &layoutContext, const LayoutConstraints &layoutConstraints) const override;
+};
+
+} // namespace facebook::react

package/macos/cpp/OneMacButton/OneMacButtonShadowNode.mm

@@ -0,0 +1,15 @@
+#include "OneMacButtonShadowNode.h"
+#import <AppKit/AppKit.h>
+#include <react/renderer/core/LayoutConstraints.h>
+namespace facebook::react {
+const char OneMacButtonComponentName[] = "OneMacButton";
+static CGFloat textWidth(const std::string &text) {
+  return ceil([[NSString stringWithUTF8String:text.c_str()] sizeWithAttributes:@{NSFontAttributeName: [NSFont systemFontOfSize:[NSFont systemFontSize]]}].width);
+}
+Size OneMacButtonShadowNode::measureContent(const LayoutContext &, const LayoutConstraints &constraints) const {
+  const auto &props = getConcreteProps();
+  CGFloat width = 28 + textWidth(props.title);
+  if (!props.systemImage.empty()) width += props.title.empty() ? 16 : 22;
+  return constraints.clamp({static_cast<Float>(width), 28});
+}
+}

package/macos/cpp/OneMacImage/OneMacImageComponentDescriptor.h

@@ -0,0 +1,6 @@
+#pragma once
+#include "OneMacImageShadowNode.h"
+#include <react/renderer/core/ConcreteComponentDescriptor.h>
+namespace facebook::react {
+using OneMacImageComponentDescriptor = ConcreteComponentDescriptor<OneMacImageShadowNode>;
+}

package/macos/cpp/OneMacImage/OneMacImageProps.cpp

@@ -0,0 +1,11 @@
+#include "OneMacImageProps.h"
+#include <react/renderer/core/propsConversions.h>
+#include <react/renderer/core/graphicsConversions.h>
+namespace facebook::react {
+OneMacImageProps::OneMacImageProps(const PropsParserContext &context, const OneMacImageProps &sourceProps, const RawProps &rawProps)
+    : ViewProps(context, sourceProps, rawProps),
+      systemName(convertRawProp(context, rawProps, "systemName", sourceProps.systemName, std::string{})),
+      size(convertRawProp(context, rawProps, "size", sourceProps.size, Float{16})),
+      fitToBounds(convertRawProp(context, rawProps, "fitToBounds", sourceProps.fitToBounds, false)),
+      tintColor(convertRawProp(context, rawProps, "tintColor", sourceProps.tintColor, SharedColor{})) {}
+}

package/macos/cpp/OneMacImage/OneMacImageProps.h

@@ -0,0 +1,14 @@
+#pragma once
+#include <react/renderer/components/view/ViewProps.h>
+#include <react/renderer/core/PropsParserContext.h>
+namespace facebook::react {
+class OneMacImageProps final : public ViewProps {
+ public:
+  OneMacImageProps() = default;
+  OneMacImageProps(const PropsParserContext &, const OneMacImageProps &, const RawProps &);
+  std::string systemName{};
+  Float size{16};
+  bool fitToBounds{false};
+  SharedColor tintColor{};
+};
+}

package/macos/cpp/OneMacImage/OneMacImageShadowNode.cpp

@@ -0,0 +1,9 @@
+#include "OneMacImageShadowNode.h"
+#include <react/renderer/core/LayoutConstraints.h>
+namespace facebook::react {
+const char OneMacImageComponentName[] = "OneMacImage";
+Size OneMacImageShadowNode::measureContent(const LayoutContext &, const LayoutConstraints &constraints) const {
+  const auto size = getConcreteProps().size;
+  return constraints.clamp({size, size});
+}
+}

package/macos/cpp/OneMacImage/OneMacImageShadowNode.h

@@ -0,0 +1,18 @@
+#pragma once
+#include "OneMacImageProps.h"
+#include <react/renderer/components/view/ConcreteViewShadowNode.h>
+namespace facebook::react {
+extern const char OneMacImageComponentName[];
+class OneMacImageShadowNode final
+    : public ConcreteViewShadowNode<OneMacImageComponentName, OneMacImageProps, ViewEventEmitter> {
+ public:
+  using ConcreteViewShadowNode::ConcreteViewShadowNode;
+  static ShadowNodeTraits BaseTraits() {
+    auto traits = ConcreteViewShadowNode::BaseTraits();
+    traits.set(ShadowNodeTraits::Trait::LeafYogaNode);
+    traits.set(ShadowNodeTraits::Trait::MeasurableYogaNode);
+    return traits;
+  }
+  Size measureContent(const LayoutContext &, const LayoutConstraints &) const override;
+};
+}

package/macos/cpp/OneMacPopUpButton/OneMacPopUpButtonComponentDescriptor.h

@@ -0,0 +1,11 @@
+#pragma once
+
+#include "OneMacPopUpButtonShadowNode.h"
+
+#include <react/renderer/core/ConcreteComponentDescriptor.h>
+
+namespace facebook::react {
+
+using OneMacPopUpButtonComponentDescriptor = ConcreteComponentDescriptor<OneMacPopUpButtonShadowNode>;
+
+} // namespace facebook::react

package/macos/cpp/OneMacPopUpButton/OneMacPopUpButtonEventEmitter.cpp

@@ -0,0 +1,7 @@
+#include "OneMacPopUpButtonEventEmitter.h"
+#include <folly/dynamic.h>
+namespace facebook::react {
+void OneMacPopUpButtonEventEmitter::onChange(const OnChange &event) const {
+  dispatchEvent("selectedIndexChange", folly::dynamic::object("selectedIndex", event.selectedIndex)("eventCount", event.eventCount)("revision", event.revision), RawEvent::Category::Discrete);
+}
+}

package/macos/cpp/OneMacPopUpButton/OneMacPopUpButtonEventEmitter.h

@@ -0,0 +1,14 @@
+#pragma once
+#include <react/renderer/components/view/ViewEventEmitter.h>
+namespace facebook::react {
+class OneMacPopUpButtonEventEmitter : public ViewEventEmitter {
+ public:
+  using ViewEventEmitter::ViewEventEmitter;
+  struct OnChange {
+    int selectedIndex;
+    int eventCount;
+    int revision;
+  };
+  void onChange(const OnChange &) const;
+};
+}

package/macos/cpp/OneMacPopUpButton/OneMacPopUpButtonProps.cpp

@@ -0,0 +1,11 @@
+#include "OneMacPopUpButtonProps.h"
+#include <react/renderer/core/propsConversions.h>
+namespace facebook::react {
+OneMacPopUpButtonProps::OneMacPopUpButtonProps(const PropsParserContext &context, const OneMacPopUpButtonProps &sourceProps, const RawProps &rawProps)
+    : ViewProps(context, sourceProps, rawProps),
+      labels(convertRawProp(context, rawProps, "labels", sourceProps.labels, std::vector<std::string>{})),
+      selectedIndex(convertRawProp(context, rawProps, "selectedIndex", sourceProps.selectedIndex, -1)),
+      disabled(convertRawProp(context, rawProps, "disabled", sourceProps.disabled, false)),
+      revision(convertRawProp(context, rawProps, "revision", sourceProps.revision, 0)),
+      acknowledgedEvent(convertRawProp(context, rawProps, "acknowledgedEvent", sourceProps.acknowledgedEvent, 0)) {}
+}

package/macos/cpp/OneMacPopUpButton/OneMacPopUpButtonProps.h

@@ -0,0 +1,17 @@
+#pragma once
+#include <react/renderer/components/view/ViewProps.h>
+#include <react/renderer/core/PropsParserContext.h>
+#include <string>
+#include <vector>
+namespace facebook::react {
+class OneMacPopUpButtonProps final : public ViewProps {
+ public:
+  OneMacPopUpButtonProps() = default;
+  OneMacPopUpButtonProps(const PropsParserContext &, const OneMacPopUpButtonProps &, const RawProps &);
+  std::vector<std::string> labels{};
+  int selectedIndex{-1};
+  bool disabled{false};
+  int revision{0};
+  int acknowledgedEvent{0};
+};
+}

package/macos/cpp/OneMacPopUpButton/OneMacPopUpButtonShadowNode.h

@@ -0,0 +1,28 @@
+#pragma once
+
+#include "OneMacPopUpButtonEventEmitter.h"
+#include "OneMacPopUpButtonProps.h"
+
+#include <react/renderer/components/view/ConcreteViewShadowNode.h>
+
+namespace facebook::react {
+
+extern const char OneMacPopUpButtonComponentName[];
+
+// leaf layout uses the system control font and standard AppKit control insets
+class OneMacPopUpButtonShadowNode final
+    : public ConcreteViewShadowNode<OneMacPopUpButtonComponentName, OneMacPopUpButtonProps, OneMacPopUpButtonEventEmitter> {
+ public:
+  using ConcreteViewShadowNode::ConcreteViewShadowNode;
+
+  static ShadowNodeTraits BaseTraits() {
+    auto traits = ConcreteViewShadowNode::BaseTraits();
+    traits.set(ShadowNodeTraits::Trait::LeafYogaNode);
+    traits.set(ShadowNodeTraits::Trait::MeasurableYogaNode);
+    return traits;
+  }
+
+  Size measureContent(const LayoutContext &layoutContext, const LayoutConstraints &layoutConstraints) const override;
+};
+
+} // namespace facebook::react

package/macos/cpp/OneMacPopUpButton/OneMacPopUpButtonShadowNode.mm

@@ -0,0 +1,16 @@
+#include "OneMacPopUpButtonShadowNode.h"
+#import <AppKit/AppKit.h>
+#include <react/renderer/core/LayoutConstraints.h>
+namespace facebook::react {
+const char OneMacPopUpButtonComponentName[] = "OneMacPopUpButton";
+static CGFloat textWidth(const std::string &text) {
+  return ceil([[NSString stringWithUTF8String:text.c_str()] sizeWithAttributes:@{NSFontAttributeName: [NSFont systemFontOfSize:[NSFont systemFontSize]]}].width);
+}
+Size OneMacPopUpButtonShadowNode::measureContent(const LayoutContext &, const LayoutConstraints &constraints) const {
+  const auto &props = getConcreteProps();
+  // the widest item plus the bezel and the up and down arrows, as AppKit sizes it
+  CGFloat width = 0;
+  for (const auto &label : props.labels) width = std::max(width, textWidth(label));
+  return constraints.clamp({static_cast<Float>(width + 40), 24});
+}
+}

package/macos/cpp/OneMacSegmentedControl/OneMacSegmentedControlComponentDescriptor.h

@@ -0,0 +1,11 @@
+#pragma once
+
+#include "OneMacSegmentedControlShadowNode.h"
+
+#include <react/renderer/core/ConcreteComponentDescriptor.h>
+
+namespace facebook::react {
+
+using OneMacSegmentedControlComponentDescriptor = ConcreteComponentDescriptor<OneMacSegmentedControlShadowNode>;
+
+} // namespace facebook::react

package/macos/cpp/OneMacSegmentedControl/OneMacSegmentedControlEventEmitter.cpp

@@ -0,0 +1,7 @@
+#include "OneMacSegmentedControlEventEmitter.h"
+#include <folly/dynamic.h>
+namespace facebook::react {
+void OneMacSegmentedControlEventEmitter::onChange(const OnChange &event) const {
+  dispatchEvent("selectedIndexChange", folly::dynamic::object("selectedIndex", event.selectedIndex)("eventCount", event.eventCount)("revision", event.revision), RawEvent::Category::Discrete);
+}
+}

package/macos/cpp/OneMacSegmentedControl/OneMacSegmentedControlEventEmitter.h

@@ -0,0 +1,14 @@
+#pragma once
+#include <react/renderer/components/view/ViewEventEmitter.h>
+namespace facebook::react {
+class OneMacSegmentedControlEventEmitter : public ViewEventEmitter {
+ public:
+  using ViewEventEmitter::ViewEventEmitter;
+  struct OnChange {
+    int selectedIndex;
+    int eventCount;
+    int revision;
+  };
+  void onChange(const OnChange &) const;
+};
+}