basalt-appkit 0.0.0-rc5

package/native/appkit/CoreTextLayout.h

@@ -0,0 +1,43 @@
+// Turning React Native's AttributedString into something Core Text can lay out.
+//
+// The counterpart of basalt-gtk's PangoTextLayout, and it exists
+// for the same reason: this is the one place that knows both halves, and it is
+// deliberately used by both sides of the text problem.
+//
+//   - `TextLayoutManager::measure` (CoreTextLayoutManager.mm) builds a layout to
+//     ask Core Text how big the text is, so Yoga can lay it out.
+//   - `AppKitMountingManager` builds the same layout and hands it to the view,
+//     which draws it.
+//
+// Measuring and painting must agree, so they must not build layouts
+// differently. Sharing this is what guarantees that.
+//
+// Unlike the Pango side, nothing here needs a mutex. Core Text is documented as
+// thread-safe, and Fabric measures on its layout thread while AppKit draws on
+// the main one. Pango's font map is not, which is why that file serialises
+// every call and this one does not.
+//
+// The paragraph object itself is in RnTextLayout.h, which has no React Native in
+// it, so the view layer can draw one without depending on React Native.
+
+#pragma once
+
+#import "RnTextLayout.h"
+
+#include <react/renderer/attributedstring/AttributedString.h>
+#include <react/renderer/attributedstring/ParagraphAttributes.h>
+#include <react/renderer/attributedstring/TextAttributes.h>
+
+namespace basalt {
+
+// Builds a layout for `attributedString`.
+RnTextLayout *buildTextLayout(const facebook::react::AttributedString &attributedString,
+                              const facebook::react::ParagraphAttributes &paragraphAttributes);
+
+// The attributes for a whole string, for anything that holds its own text
+// rather than a layout built here -- the equivalent of Pango's
+// buildTextAttributes, and what a <TextInput> will need.
+NSDictionary<NSAttributedStringKey, id> *buildTextAttributes(
+    const facebook::react::TextAttributes &textAttributes);
+
+} // namespace basalt

package/native/appkit/CoreTextLayout.mm

@@ -0,0 +1,252 @@
+#import "CoreTextLayout.h"
+
+#include "FontRegistry.h"
+
+#include <react/renderer/graphics/Color.h>
+
+#include <cmath>
+#include <string>
+
+
+// ---------------------------------------------------------------------------
+// AttributedString -> NSAttributedString
+// ---------------------------------------------------------------------------
+
+namespace basalt {
+
+using facebook::react::AttributedString;
+using facebook::react::EllipsizeMode;
+using facebook::react::FontStyle;
+using facebook::react::FontWeight;
+using facebook::react::ParagraphAttributes;
+using facebook::react::TextAlignment;
+using facebook::react::TextAttributes;
+using facebook::react::TextDecorationLineType;
+
+namespace {
+
+// React Native's default when a <Text> sets no fontSize.
+constexpr float kDefaultFontSize = 14.0F;
+
+bool isSet(facebook::react::Float value) {
+  return !std::isnan(value);
+}
+
+// CSS numeric weights to Core Text's -1..1 scale, using Apple's own constants
+// for the named steps. A straight linear mapping would put "bold" somewhere
+// between semibold and heavy and make every bold face on the system slightly
+// wrong.
+CGFloat toCoreTextWeight(FontWeight weight) {
+  switch (static_cast<int>(weight)) {
+    case 100: return NSFontWeightUltraLight;
+    case 200: return NSFontWeightThin;
+    case 300: return NSFontWeightLight;
+    case 400: return NSFontWeightRegular;
+    case 500: return NSFontWeightMedium;
+    case 600: return NSFontWeightSemibold;
+    case 700: return NSFontWeightBold;
+    case 800: return NSFontWeightHeavy;
+    case 900: return NSFontWeightBlack;
+    default: break;
+  }
+  return NSFontWeightRegular;
+}
+
+NSTextAlignment toTextAlignment(TextAlignment alignment) {
+  switch (alignment) {
+    case TextAlignment::Center:
+      return NSTextAlignmentCenter;
+    case TextAlignment::Right:
+#if BASALT_RN_MINOR >= 87
+    case TextAlignment::End:
+#endif
+      return NSTextAlignmentRight;
+    case TextAlignment::Justified:
+      return NSTextAlignmentJustified;
+    case TextAlignment::Left:
+#if BASALT_RN_MINOR >= 87
+    case TextAlignment::Start:
+#endif
+    case TextAlignment::Natural:
+      break;
+  }
+  return NSTextAlignmentNatural;
+}
+
+NSColor *toColor(const facebook::react::SharedColor &color) {
+  const auto components = facebook::react::colorComponentsFromColor(color);
+  // sRGB explicitly, for the same reason RnAppKitView builds its background
+  // that way: a device colour space shifts every colour on a wide-gamut
+  // display, and text that does not match Linux is the bug this project is
+  // least able to afford.
+  return [NSColor colorWithSRGBRed:components.red
+                             green:components.green
+                              blue:components.blue
+                             alpha:components.alpha];
+}
+
+NSFont *fontFor(const TextAttributes &textAttributes) {
+  float size = isSet(textAttributes.fontSize) ? static_cast<float>(textAttributes.fontSize)
+                                              : kDefaultFontSize;
+  if (isSet(textAttributes.fontSizeMultiplier) && textAttributes.fontSizeMultiplier > 0) {
+    size *= static_cast<float>(textAttributes.fontSizeMultiplier);
+  }
+
+  const CGFloat weight = textAttributes.fontWeight ? toCoreTextWeight(*textAttributes.fontWeight)
+                                                   : NSFontWeightRegular;
+  const bool italic = textAttributes.fontStyle &&
+      (*textAttributes.fontStyle == FontStyle::Italic ||
+       *textAttributes.fontStyle == FontStyle::Oblique);
+
+  NSFont *font = nil;
+  if (textAttributes.fontFamily.empty()) {
+    // The system font, which is what "no fontFamily" means on a Mac -- and
+    // asking for it by name would get the wrong thing, since San Francisco is
+    // not available under its own family name.
+    font = [NSFont systemFontOfSize:size weight:weight];
+  } else {
+    // Through the runtime registry: a font an app loaded is known to the app by
+    // a name it chose and to Core Text by the name inside the file.
+    // resolveFontFamily returns the argument unchanged for system families.
+    const std::string family = resolveFontFamily(textAttributes.fontFamily);
+    NSString *familyName = [NSString stringWithUTF8String:family.c_str()];
+
+    NSFontDescriptor *descriptor = [NSFontDescriptor fontDescriptorWithFontAttributes:@{
+      NSFontFamilyAttribute : familyName,
+      NSFontTraitsAttribute : @{NSFontWeightTrait : @(weight)},
+    }];
+    font = [NSFont fontWithDescriptor:descriptor size:size];
+    if (font == nil) {
+      // A family the system does not have. Falling back to the system font
+      // rather than to nil, because a nil font makes Core Text drop the run
+      // entirely and the text silently disappears.
+      font = [NSFont systemFontOfSize:size weight:weight];
+    }
+  }
+
+  if (italic) {
+    NSFontDescriptor *italicised =
+        [font.fontDescriptor fontDescriptorWithSymbolicTraits:NSFontDescriptorTraitItalic];
+    NSFont *slanted = [NSFont fontWithDescriptor:italicised size:size];
+    if (slanted != nil) {
+      font = slanted;
+    }
+  }
+
+  return font;
+}
+
+NSParagraphStyle *paragraphStyleFor(const TextAttributes &textAttributes) {
+  NSMutableParagraphStyle *style = [[NSMutableParagraphStyle alloc] init];
+
+  if (textAttributes.alignment) {
+    style.alignment = toTextAlignment(*textAttributes.alignment);
+  }
+
+  // React Native's lineHeight is the total line box height, and setting both
+  // bounds to it is how that is said in AppKit. Leaving one of them out gives a
+  // minimum or a maximum, which is a different thing and only shows up on text
+  // whose natural height is on the other side of the value.
+  if (isSet(textAttributes.lineHeight)) {
+    const CGFloat lineHeight = static_cast<CGFloat>(textAttributes.lineHeight);
+    style.minimumLineHeight = lineHeight;
+    style.maximumLineHeight = lineHeight;
+  }
+
+  // Wrapping, always. The line *limit* is applied in RnTextLayout, not here:
+  // a truncating line break mode would make Core Text ellipsize each line it
+  // lays out rather than the last one kept.
+  style.lineBreakMode = NSLineBreakByWordWrapping;
+
+  return style;
+}
+
+} // namespace
+
+NSDictionary<NSAttributedStringKey, id> *buildTextAttributes(const TextAttributes &textAttributes) {
+  NSMutableDictionary<NSAttributedStringKey, id> *attributes = [NSMutableDictionary dictionary];
+
+  attributes[NSFontAttributeName] = fontFor(textAttributes);
+  attributes[NSParagraphStyleAttributeName] = paragraphStyleFor(textAttributes);
+
+  if (textAttributes.foregroundColor) {
+    attributes[NSForegroundColorAttributeName] = toColor(textAttributes.foregroundColor);
+  } else {
+    // React Native's default is opaque black, not the system label colour --
+    // which is white in dark mode and would make default text invisible on a
+    // light background, or vice versa. Matching React Native rather than the
+    // platform is the right call here: the same app has to look the same on
+    // Linux.
+    attributes[NSForegroundColorAttributeName] = [NSColor colorWithSRGBRed:0 green:0 blue:0 alpha:1];
+  }
+
+  if (textAttributes.backgroundColor) {
+    attributes[NSBackgroundColorAttributeName] = toColor(textAttributes.backgroundColor);
+  }
+
+  if (isSet(textAttributes.letterSpacing)) {
+    attributes[NSKernAttributeName] = @(static_cast<CGFloat>(textAttributes.letterSpacing));
+  }
+
+  if (textAttributes.textDecorationLineType) {
+    switch (*textAttributes.textDecorationLineType) {
+      case TextDecorationLineType::Underline:
+        attributes[NSUnderlineStyleAttributeName] = @(NSUnderlineStyleSingle);
+        break;
+      case TextDecorationLineType::Strikethrough:
+        attributes[NSStrikethroughStyleAttributeName] = @(NSUnderlineStyleSingle);
+        break;
+      case TextDecorationLineType::UnderlineStrikethrough:
+        attributes[NSUnderlineStyleAttributeName] = @(NSUnderlineStyleSingle);
+        attributes[NSStrikethroughStyleAttributeName] = @(NSUnderlineStyleSingle);
+        break;
+      case TextDecorationLineType::None:
+        break;
+    }
+  }
+
+  return attributes;
+}
+
+RnTextLayout *buildTextLayout(const AttributedString &attributedString,
+                              const ParagraphAttributes &paragraphAttributes) {
+  NSMutableAttributedString *string = [[NSMutableAttributedString alloc] init];
+
+  for (const auto &fragment : attributedString.getFragments()) {
+    if (fragment.string.empty()) {
+      continue;
+    }
+    NSString *text = [NSString stringWithUTF8String:fragment.string.c_str()];
+    if (text == nil) {
+      continue;
+    }
+    [string appendAttributedString:[[NSAttributedString alloc]
+                                       initWithString:text
+                                           attributes:buildTextAttributes(fragment.textAttributes)]];
+  }
+
+  CTLineTruncationType truncation = kCTLineTruncationEnd;
+  bool truncates = true;
+  switch (paragraphAttributes.ellipsizeMode) {
+    case EllipsizeMode::Head:
+      truncation = kCTLineTruncationStart;
+      break;
+    case EllipsizeMode::Middle:
+      truncation = kCTLineTruncationMiddle;
+      break;
+    case EllipsizeMode::Tail:
+      truncation = kCTLineTruncationEnd;
+      break;
+    case EllipsizeMode::Clip:
+      // Cut, with no ellipsis. The line limit still applies.
+      truncates = false;
+      break;
+  }
+
+  return [RnTextLayout layoutWithAttributedString:string
+                             maximumNumberOfLines:paragraphAttributes.maximumNumberOfLines
+                                   truncationType:truncation
+                                        truncates:truncates ? YES : NO];
+}
+
+} // namespace basalt

package/native/appkit/CoreTextLayoutManager.mm

@@ -0,0 +1,138 @@
+// The macOS implementation of React Native's text measurement seam.
+//
+// `TextLayoutManager` is declared in React Native's cxx platform variant, and
+// its only implementation there is a stub that ignores every attribute and
+// returns `layoutConstraints.minimumSize`. cmake/ReactNativeCore.cmake drops
+// that stub from the build, so a platform either provides this or fails to
+// link -- which is the second of the three seams phase 19 found, and the reason
+// macOS could not register a Paragraph descriptor until now.
+//
+// The header is unchanged and shared; only the .cpp differs, which is what
+// React Native's platform/ split is for. Its Linux counterpart is
+// basalt-gtk's PangoTextLayoutManager.cpp, and the two are
+// deliberately the same file with a different engine inside.
+//
+// Yoga calls this during layout, on whichever thread is committing, so it must
+// be thread-safe and it must be fast.
+
+#import "CoreTextLayout.h"
+
+#include "FontRegistry.h"
+
+#include <algorithm>
+#include <cmath>
+#include <mutex>
+#include <unordered_map>
+
+#include <react/renderer/textlayoutmanager/TextLayoutManager.h>
+
+namespace facebook::react {
+
+namespace {
+
+std::mutex &measurementCacheMutex() {
+  static std::mutex mutex;
+  return mutex;
+}
+
+// Emptied whenever a font is registered; see the note at its first use.
+std::unordered_map<TextMeasureCacheKey, TextMeasurement> &measurementCache() {
+  static std::unordered_map<TextMeasureCacheKey, TextMeasurement> cache;
+  static unsigned long generation = 0;
+  const unsigned long current = basalt::fontGeneration();
+  if (current != generation) {
+    cache.clear();
+    generation = current;
+  }
+  return cache;
+}
+
+} // namespace
+
+TextLayoutManager::TextLayoutManager(const std::shared_ptr<const ContextContainer> &contextContainer)
+    : contextContainer_(contextContainer), textMeasureCache_(kSimpleThreadSafeCacheSizeCap) {}
+
+TextMeasurement TextLayoutManager::measure(const AttributedStringBox &attributedStringBox,
+                                           const ParagraphAttributes &paragraphAttributes,
+                                           const TextLayoutContext &layoutContext,
+                                           const LayoutConstraints &layoutConstraints) const {
+  const auto &attributedString = attributedStringBox.getValue();
+
+  // pointScaleFactor joined the cache key in React Native 0.87. On 0.81 the key
+  // has three fields and naming a fourth is a compile error. Its absence only
+  // makes the cache coarser there, and since nothing below uses the factor,
+  // coarser is harmless.
+  const TextMeasureCacheKey key{
+      .attributedString = attributedString,
+      .paragraphAttributes = paragraphAttributes,
+      .layoutConstraints = layoutConstraints,
+#if BASALT_RN_MINOR >= 87
+      .pointScaleFactor = layoutContext.pointScaleFactor,
+#endif
+  };
+
+#if BASALT_RN_MINOR < 87
+  (void)layoutContext;
+#endif
+
+  // Not React Native's `textMeasureCache_`, which has no way to be emptied.
+  //
+  // A font registered since a measurement invalidates it: the same string with
+  // the same attributes measures differently once its family exists. That is
+  // not expressible in the cache key, which React Native defines, so the cache
+  // has to be droppable instead -- and without that, a font loaded after first
+  // render, which is how `useFonts` and every other loader works, appears to do
+  // nothing at all.
+  {
+    const std::lock_guard<std::mutex> lock(measurementCacheMutex());
+    auto &cache = measurementCache();
+    const auto hit = cache.find(key);
+    if (hit != cache.end()) {
+      return hit->second;
+    }
+  }
+
+  TextMeasurement measured;
+  @autoreleasepool {
+    // An infinite maximum width means "do not wrap".
+    const CGFloat maxWidth = std::isinf(layoutConstraints.maximumSize.width)
+        ? -1.0
+        : static_cast<CGFloat>(layoutConstraints.maximumSize.width);
+
+    RnTextLayout *layout = basalt::buildTextLayout(attributedString, paragraphAttributes);
+    const CGSize size = [layout sizeForWidth:maxWidth];
+
+    // Core Text can report a line slightly wider than the width it was given,
+    // for an unbreakable run. Yoga treats the returned size as final, so
+    // clamping here keeps the paragraph inside the box its parent allotted.
+    const auto natural = Size{
+        .width = std::min(static_cast<Float>(size.width), layoutConstraints.maximumSize.width),
+        .height = static_cast<Float>(size.height),
+    };
+
+    // Inline views (`<Text><View/></Text>`) reach here as attachment fragments.
+    // Reporting a zero frame for each keeps the count right, which is what
+    // ParagraphShadowNode iterates over, but they are not positioned yet --
+    // the same gap the GTK side has, for the same reason.
+    TextMeasurement::Attachments attachments;
+    for (const auto &fragment : attributedString.getFragments()) {
+      if (fragment.isAttachment()) {
+        attachments.push_back(TextMeasurement::Attachment{
+            .frame = {.origin = {.x = 0, .y = 0}, .size = {.width = 0, .height = 0}},
+            .isClipped = false,
+        });
+      }
+    }
+
+    measured = TextMeasurement{.size = layoutConstraints.clamp(natural), .attachments = attachments};
+  }
+
+  {
+    const std::lock_guard<std::mutex> lock(measurementCacheMutex());
+    measurementCache().emplace(key, measured);
+  }
+
+  return measured;
+}
+
+} // namespace facebook::react

package/native/appkit/FontRegistryCoreText.mm

@@ -0,0 +1,148 @@
+// The font seam on macOS, backed by Core Text.
+//
+// The counterpart of gtk/FontRegistryFontconfig.cpp, and the first seam phase
+// 17 identified: `expo-font` hands over a file and a name of the app's choosing
+// -- "Inter", say -- and expects `fontFamily: 'Inter'` to work afterwards. A
+// font file carries its own family name inside it, usually something else
+// entirely, and Core Text indexes by that. So loading the file is only half the
+// job; the other half is remembering that this app calls it "Inter".
+//
+// Registration is process-scoped: the font becomes available to this process
+// and to nothing else on the machine, which is what an app loading a bundled
+// font wants and the only scope that needs no user consent.
+//
+// Nothing on this platform renders text yet -- there is no Core Text
+// TextLayoutManager, which is the seam phase 19 found. So `resolveFontFamily`
+// currently has no reader. It is implemented anyway, because the alternative is
+// a registry that silently records nothing and a font milestone that starts by
+// debugging this file.
+
+#include "FontRegistry.h"
+
+#import <CoreText/CoreText.h>
+#import <Foundation/Foundation.h>
+
+#include <mutex>
+#include <unordered_map>
+#include <vector>
+
+namespace basalt {
+
+namespace {
+
+struct Registry {
+  std::mutex mutex;
+  unsigned long generation{0};
+  // What the app calls it -> what the file calls itself.
+  std::unordered_map<std::string, std::string> families;
+  std::vector<std::string> order;
+};
+
+Registry &registry() {
+  static Registry instance;
+  return instance;
+}
+
+// The family name recorded inside the file. Core Text will register a file and
+// then index it under a name the app has never heard of, so this is read back
+// rather than assumed -- the same reason the fontconfig side reads it.
+//
+// A file can hold several faces; the first one's family is used, which matches
+// what a single-font asset means and is what fontconfig's equivalent does.
+std::string familyInFile(NSURL *url) {
+  NSArray *descriptors =
+      (__bridge_transfer NSArray *)CTFontManagerCreateFontDescriptorsFromURL((__bridge CFURLRef)url);
+  if (descriptors.count == 0) {
+    return {};
+  }
+
+  CTFontDescriptorRef descriptor = (__bridge CTFontDescriptorRef)descriptors[0];
+  NSString *family = (__bridge_transfer NSString *)CTFontDescriptorCopyAttribute(
+      descriptor, kCTFontFamilyNameAttribute);
+  if (family == nil) {
+    return {};
+  }
+  return family.UTF8String;
+}
+
+} // namespace
+
+bool registerFont(const std::string &name, const std::string &path) {
+  Registry &state = registry();
+  const std::lock_guard<std::mutex> lock(state.mutex);
+
+  if (state.families.find(name) != state.families.end()) {
+    return true;
+  }
+
+  @autoreleasepool {
+    NSURL *url = [NSURL fileURLWithPath:[NSString stringWithUTF8String:path.c_str()]];
+    if (url == nil) {
+      return false;
+    }
+
+    CFErrorRef error = nullptr;
+    if (!CTFontManagerRegisterFontsForURL((__bridge CFURLRef)url,
+                                          kCTFontManagerScopeProcess,
+                                          &error)) {
+      // Already registered is not a failure: two apps' worth of the same file,
+      // or a second call for a different app-facing name, both land here and
+      // both leave the font usable.
+      const bool alreadyRegistered =
+          error != nullptr && CFErrorGetCode(error) == kCTFontManagerErrorAlreadyRegistered;
+      if (error != nullptr) {
+        CFRelease(error);
+      }
+      if (!alreadyRegistered) {
+        return false;
+      }
+    }
+
+    const std::string family = familyInFile(url);
+    if (family.empty()) {
+      // Registered but unusable: without the real family there is no way to ask
+      // for it, and pretending otherwise would fail later and further away.
+      return false;
+    }
+
+    state.families.emplace(name, family);
+    state.order.push_back(name);
+    state.generation++;
+  }
+
+  return true;
+}
+
+unsigned long fontGeneration() {
+  Registry &state = registry();
+  const std::lock_guard<std::mutex> lock(state.mutex);
+  return state.generation;
+}
+
+std::string resolveFontFamily(const std::string &name) {
+  Registry &state = registry();
+  const std::lock_guard<std::mutex> lock(state.mutex);
+  const auto it = state.families.find(name);
+  return it == state.families.end() ? name : it->second;
+}
+
+bool isFontRegistered(const std::string &name) {
+  Registry &state = registry();
+  const std::lock_guard<std::mutex> lock(state.mutex);
+  return state.families.find(name) != state.families.end();
+}
+
+std::string registeredFontNamesJoined(char separator) {
+  Registry &state = registry();
+  const std::lock_guard<std::mutex> lock(state.mutex);
+  std::string joined;
+  for (const auto &name : state.order) {
+    if (!joined.empty()) {
+      joined.push_back(separator);
+    }
+    joined += name;
+  }
+  return joined;
+}
+
+} // namespace basalt