react-native-marcus 0.1.0

package/android/src/main/new_arch/react/renderer/components/RNMarcusSpec/MarcusTextInputDecoratorShadowNode.cpp

@@ -0,0 +1,218 @@
+#include "MarcusTextInputDecoratorShadowNode.h"
+
+#include <fbjni/fbjni.h>
+#include <react/fabric/JFabricUIManager.h>
+#include <react/jni/ReadableNativeMap.h>
+#if REACT_NATIVE_MINOR_VERSION < 80
+#include <react/jni/SafeReleaseJniRef.h>
+#endif // REACT_NATIVE_MINOR_VERSION < 80
+#include <react/renderer/components/view/conversions.h>
+#include <react/renderer/core/ComponentDescriptor.h>
+#include <yoga/Yoga.h>
+
+namespace facebook {
+namespace react {
+
+extern const char MarcusTextInputDecoratorViewComponentName[] =
+  "MarcusTextInputDecoratorView";
+
+MarcusTextInputDecoratorShadowNode::MarcusTextInputDecoratorShadowNode(
+  ShadowNodeFragment const &fragment, ShadowNodeFamily::Shared const &family, ShadowNodeTraits traits
+)
+    : ConcreteViewShadowNode(fragment, family, traits) {
+  initialize();
+  createCustomContextContainer();
+  makeChildNodeMutable();
+
+  if (fragment.children) {
+    overwriteTextLayoutManager();
+  }
+}
+
+MarcusTextInputDecoratorShadowNode::MarcusTextInputDecoratorShadowNode(
+  ShadowNode const &sourceShadowNode, ShadowNodeFragment const &fragment
+)
+    : ConcreteViewShadowNode(sourceShadowNode, fragment) {
+  initialize();
+
+  const auto &sourceDecorator =
+    static_cast<const MarcusTextInputDecoratorShadowNode &>(
+      sourceShadowNode
+    );
+
+  customContextContainer_ = sourceDecorator.customContextContainer_;
+  previousMarkdownStyle_ = sourceDecorator.previousMarkdownStyle_;
+  previousParserId_ = sourceDecorator.previousParserId_;
+
+  updateCustomContextContainerIfNeeded();
+  makeChildNodeMutable();
+
+  if (fragment.children) {
+    overwriteTextLayoutManager();
+  }
+}
+
+void
+MarcusTextInputDecoratorShadowNode::initialize() {
+  // Setting display: contents style results in ForceFlattenView trait being set
+  // on the shadow node. This trait causes the node not to have a host view. By
+  // removing the trait, it's possible to force RN to create a host view, layout
+  // of which can then be customized.
+  ShadowNode::traits_.unset(ShadowNodeTraits::ForceFlattenView);
+}
+
+void
+MarcusTextInputDecoratorShadowNode::makeChildNodeMutable() {
+  // When the decorator is cloned and has a child node, the child node should be
+  // cloned as well to ensure it is mutable.
+  const auto &children = getChildren();
+  if (!children.empty()) {
+    react_native_assert(
+      children.size() == 1 &&
+      "MarcusTextInputDecoratorView received more than one child"
+    );
+
+    const auto clonedChild = children[0]->clone({});
+    replaceChild(*children[0], clonedChild);
+  }
+}
+
+void
+MarcusTextInputDecoratorShadowNode::createCustomContextContainer() {
+  static const auto customFabricUIManagerClass =
+    jni::findClassStatic("app/getbullet/marcus/CustomFabricUIManager");
+  static const auto createMethod =
+    customFabricUIManagerClass->getStaticMethod<JFabricUIManager::javaobject(
+      JFabricUIManager::javaobject, ReadableMap::javaobject, int
+    )>(
+      "create"
+    );
+
+  const auto &rawProps = this->getProps()->rawProps;
+  const auto &markdownStyleIt = rawProps.find("markdownStyle");
+  const auto &markdownStyle = markdownStyleIt != rawProps.items().end()
+                                ? markdownStyleIt->second
+                                : previousMarkdownStyle_;
+  const auto &parserIdIt = rawProps.find("parserId");
+  const auto parserId = parserIdIt != rawProps.items().end()
+                          ? parserIdIt->second.asInt()
+                          : previousParserId_;
+
+  const auto decoratorPropsRNM =
+    ReadableNativeMap::newObjectCxxArgs(markdownStyle);
+  const auto decoratorPropsRM = jni::make_local(
+    reinterpret_cast<ReadableMap::javaobject>(decoratorPropsRNM.get())
+  );
+
+  const auto &fabricUIManager =
+    this->getContextContainer()->at<JFabricUIManager::javaobject>(
+      "FabricUIManager"
+    );
+
+  const auto customFabricUIManager = SafeReleaseJniRef(
+    jni::make_global(createMethod(customFabricUIManagerClass, fabricUIManager, decoratorPropsRM.get(), parserId))
+  );
+  const auto contextContainer = std::make_shared<ContextContainer const>();
+  contextContainer->insert("FabricUIManager", customFabricUIManager);
+
+  customContextContainer_ = contextContainer;
+  previousMarkdownStyle_ = markdownStyle;
+  previousParserId_ = parserId;
+}
+
+void
+MarcusTextInputDecoratorShadowNode::
+  updateCustomContextContainerIfNeeded() {
+  const auto &rawProps = this->getProps()->rawProps;
+  const auto &markdownStyleIt = rawProps.find("markdownStyle");
+  if (markdownStyleIt != rawProps.items().end() &&
+      markdownStyleIt->second != previousMarkdownStyle_) {
+    createCustomContextContainer();
+    return;
+  }
+  const auto &parserIdIt = rawProps.find("parserId");
+  if (parserIdIt != rawProps.items().end() &&
+      parserIdIt->second.asInt() != previousParserId_) {
+    createCustomContextContainer();
+  }
+}
+
+void
+MarcusTextInputDecoratorShadowNode::overwriteTextLayoutManager() {
+  const auto &children = getChildren();
+  if (children.empty()) {
+    return;
+  }
+  react_native_assert(
+    children.size() == 1 &&
+    "MarcusTextInputDecoratorView received more than one child"
+  );
+
+  const auto child =
+    std::dynamic_pointer_cast<const AndroidTextInputShadowNode>(children[0]);
+
+  react_native_assert(
+    child != nullptr &&
+    "MarcusTextInputDecoratorView received child other than a TextInput"
+  );
+  child->ensureUnsealed();
+
+  const auto mutableChild =
+    std::const_pointer_cast<AndroidTextInputShadowNode>(child);
+  mutableChild->setTextLayoutManager(
+    std::make_shared<TextLayoutManager>(customContextContainer_)
+  );
+}
+
+void
+MarcusTextInputDecoratorShadowNode::appendChild(
+  const std::shared_ptr<const ShadowNode> &child
+) {
+  YogaLayoutableShadowNode::appendChild(child);
+
+  overwriteTextLayoutManager();
+}
+
+void
+MarcusTextInputDecoratorShadowNode::replaceChild(
+  const ShadowNode &oldChild,
+  const std::shared_ptr<const ShadowNode> &newChild,
+  size_t suggestedIndex
+) {
+  YogaLayoutableShadowNode::replaceChild(oldChild, newChild, suggestedIndex);
+
+  overwriteTextLayoutManager();
+}
+
+void
+MarcusTextInputDecoratorShadowNode::layout(LayoutContext layoutContext) {
+  YogaLayoutableShadowNode::layout(layoutContext);
+
+  const auto &children = getChildren();
+  react_native_assert(
+    children.size() == 1 &&
+    "MarcusTextInputDecoratorView didn't receive exactly one child"
+  );
+
+  auto child =
+    std::static_pointer_cast<const YogaLayoutableShadowNode>(children[0]);
+  child->ensureUnsealed();
+  auto mutableChild = std::const_pointer_cast<YogaLayoutableShadowNode>(child);
+
+  // TODO: this may not be the correct way to do this
+  // Since nodes with display: contents are skipped during layout, they have
+  // zero-layout. To properly display the view, assign the layout metrics from
+  // the child (text input, which was calculated by Yoga) to the decorator view.
+  auto childMetrics = child->getLayoutMetrics();
+  setLayoutMetrics(childMetrics); // makes a copy
+
+  // Then, it's also needed to update the metrics on the child as the position
+  // is relative to the parent, which was just moved above. By zeroing the
+  // origin, the child is effectively moved to the same position it was before
+  // the manipulation here.
+  childMetrics.frame.origin = Point{};
+  mutableChild->setLayoutMetrics(childMetrics);
+}
+
+} // namespace react
+} // namespace facebook

package/android/src/main/new_arch/react/renderer/components/RNMarcusSpec/MarcusTextInputDecoratorShadowNode.h

@@ -0,0 +1,54 @@
+#pragma once
+
+#include <react/renderer/components/RNMarcusSpec/EventEmitters.h>
+#include <react/renderer/components/RNMarcusSpec/MarcusTextInputDecoratorState.h>
+#include <react/renderer/components/RNMarcusSpec/Props.h>
+#include <react/renderer/components/androidtextinput/AndroidTextInputShadowNode.h>
+
+#include <react/renderer/components/view/ConcreteViewShadowNode.h>
+#include <react/renderer/core/LayoutContext.h>
+
+namespace facebook {
+namespace react {
+
+JSI_EXPORT extern const char MarcusTextInputDecoratorViewComponentName[];
+
+class JSI_EXPORT MarcusTextInputDecoratorShadowNode final
+    : public ConcreteViewShadowNode<MarcusTextInputDecoratorViewComponentName, MarcusTextInputDecoratorViewProps, MarcusTextInputDecoratorViewEventEmitter, MarcusTextInputDecoratorState> {
+public:
+  MarcusTextInputDecoratorShadowNode(ShadowNodeFragment const &fragment, ShadowNodeFamily::Shared const &family, ShadowNodeTraits traits);
+
+  MarcusTextInputDecoratorShadowNode(ShadowNode const &sourceShadowNode, ShadowNodeFragment const &fragment);
+
+  void
+  appendChild(const std::shared_ptr<const ShadowNode> &child) override;
+
+  void
+  replaceChild(const ShadowNode &oldChild, const std::shared_ptr<const ShadowNode> &newChild, size_t suggestedIndex = SIZE_MAX) override;
+
+  void
+  layout(LayoutContext layoutContext) override;
+
+private:
+  std::shared_ptr<const ContextContainer> customContextContainer_;
+  folly::dynamic previousMarkdownStyle_;
+  int previousParserId_;
+
+  void
+  initialize();
+
+  void
+  overwriteTextLayoutManager();
+
+  void
+  createCustomContextContainer();
+
+  void
+  updateCustomContextContainerIfNeeded();
+
+  void
+  makeChildNodeMutable();
+};
+
+} // namespace react
+} // namespace facebook

package/android/src/reactNativeVersionPatch/CustomMountingManager/81/app/getbullet/marcus/CustomFabricUIManager.java

@@ -0,0 +1,156 @@
+package app.getbullet.marcus;
+
+/*
+ * NOTE: This file deliberately stays in Java.
+ *
+ * Everything it does sits on React Native declarations that are `internal` in Kotlin:
+ * `TextLayoutManager` (the measureText call itself), `LayoutMetricsConversions`
+ * (getYogaSize / getYogaMeasureMode) and `MountingManager`, which is both a constructor
+ * parameter type and a field type here. Java still sees all of them because `internal`
+ * stays public in the bytecode; the Kotlin compiler refuses.
+ *
+ * A Kotlin version would have to smuggle MountingManager as `Any` and delegate the whole
+ * method body to a Java helper, which is more indirection for no gain, so the class is
+ * left as-is until React Native opens these APIs up.
+ */
+
+import static com.facebook.react.fabric.mounting.LayoutMetricsConversions.getYogaMeasureMode;
+import static com.facebook.react.fabric.mounting.LayoutMetricsConversions.getYogaSize;
+
+import android.text.SpannableStringBuilder;
+
+import androidx.annotation.Nullable;
+
+import com.facebook.infer.annotation.Assertions;
+import com.facebook.jni.annotations.DoNotStrip;
+import com.facebook.react.bridge.ReactApplicationContext;
+import com.facebook.react.bridge.ReactContext;
+import com.facebook.react.bridge.ReadableMap;
+import com.facebook.react.common.mapbuffer.ReadableMapBuffer;
+import com.facebook.react.fabric.FabricUIManager;
+import com.facebook.react.fabric.mounting.MountingManager;
+import com.facebook.react.fabric.mounting.SurfaceMountingManager;
+import com.facebook.react.uimanager.ViewManagerRegistry;
+import com.facebook.react.uimanager.events.BatchEventDispatchedListener;
+import com.facebook.react.views.text.TextLayoutManager;
+
+import java.lang.reflect.Field;
+
+@DoNotStrip
+public class CustomFabricUIManager extends FabricUIManager {
+
+  private final ReactApplicationContext mReactApplicationContext;
+  private final MountingManager mMountingManager;
+  private final MarkdownUtils mMarkdownUtils;
+
+  public CustomFabricUIManager(
+    ReactApplicationContext reactContext,
+    ViewManagerRegistry viewManagerRegistry,
+    BatchEventDispatchedListener batchEventDispatchedListener,
+    MountingManager mountingManager,
+    ReadableMap markdownProps,
+    int parserId
+  ) {
+    super(reactContext, viewManagerRegistry, batchEventDispatchedListener);
+
+    this.mReactApplicationContext = reactContext;
+    this.mMountingManager = mountingManager;
+
+    this.mMarkdownUtils = new MarkdownUtils(reactContext);
+    this.mMarkdownUtils.setMarkdownStyle(new MarkdownStyle(markdownProps, reactContext));
+    this.mMarkdownUtils.setParserId(parserId);
+  }
+
+  @Override
+  public long measureText(
+    int surfaceId,
+    ReadableMapBuffer attributedString,
+    ReadableMapBuffer paragraphAttributes,
+    float minWidth,
+    float maxWidth,
+    float minHeight,
+    float maxHeight,
+    @Nullable float[] attachmentsPositions) {
+
+    ReactContext context;
+    if (surfaceId > 0) {
+      SurfaceMountingManager surfaceMountingManager =
+        mMountingManager.getSurfaceManagerEnforced(surfaceId, "measureText");
+      if (surfaceMountingManager.isStopped()) {
+        return 0;
+      }
+      context = surfaceMountingManager.getContext();
+      Assertions.assertNotNull(
+        context, "Context in SurfaceMountingManager is null. surfaceId: " + surfaceId);
+    } else {
+      context = mReactApplicationContext;
+    }
+
+    return TextLayoutManager.measureText(
+      context,
+      attributedString,
+      paragraphAttributes,
+      getYogaSize(minWidth, maxWidth),
+      getYogaMeasureMode(minWidth, maxWidth),
+      getYogaSize(minHeight, maxHeight),
+      getYogaMeasureMode(minHeight, maxHeight),
+      spannable -> {
+        mMarkdownUtils.applyMarkdownFormatting((SpannableStringBuilder) spannable);
+      },
+      attachmentsPositions);
+  }
+
+  public static FabricUIManager create(FabricUIManager source, ReadableMap markdownProps, int parserId) {
+    try {
+      MountingManager sourceMountingManager = readPrivateField(source, "mMountingManager");
+      ReactApplicationContext reactContext = readPrivateField(source, "mReactApplicationContext");
+      ViewManagerRegistry viewManagerRegistry = readPrivateField(source, "mViewManagerRegistry");
+      BatchEventDispatchedListener batchEventDispatchedListener = readPrivateField(source, "mBatchEventDispatchedListener");
+
+      FabricUIManager customFabricUIManager = new CustomFabricUIManager(
+        reactContext,
+        viewManagerRegistry,
+        batchEventDispatchedListener,
+        sourceMountingManager,
+        markdownProps,
+        parserId
+      );
+
+      return customFabricUIManager;
+    } catch (NoSuchFieldException | IllegalAccessException e) {
+      throw new RuntimeException("[Marcus] Cannot read data from FabricUIManager", e);
+    }
+  }
+
+  @SuppressWarnings("unchecked")
+  private static <T> T readPrivateField(Object obj, String name) throws NoSuchFieldException, IllegalAccessException {
+    Class<?> clazz = obj.getClass();
+
+    Field field;
+    try {
+      field = clazz.getDeclaredField(name);
+    } catch (NoSuchFieldException e) {
+      // FabricUIManager is one of the last Java files left in React Native's fabric
+      // package. When it is converted to Kotlin these `m`-prefixed names go away, and a
+      // bare NoSuchFieldException gives no hint why. Name what we actually found.
+      StringBuilder declared = new StringBuilder();
+      for (Field candidate : clazz.getDeclaredFields()) {
+        if (declared.length() > 0) {
+          declared.append(", ");
+        }
+        declared.append(candidate.getName());
+      }
+      throw new NoSuchFieldException(
+        "[Marcus] "
+          + clazz.getName()
+          + " has no field '"
+          + name
+          + "'. React Native most likely renamed it. Declared fields: "
+          + declared);
+    }
+    field.setAccessible(true);
+    T value = (T) field.get(obj);
+
+    return value;
+  }
+}

package/android/src/reactNativeVersionPatch/CustomMountingManager/latest/app/getbullet/marcus/CustomFabricUIManager.java

@@ -0,0 +1,130 @@
+package app.getbullet.marcus;
+
+/*
+ * NOTE: This file deliberately stays in Java.
+ *
+ * Everything it does sits on React Native declarations that are `internal` in Kotlin:
+ * `TextLayoutManager` (the measureText call itself), `LayoutMetricsConversions`
+ * (getYogaSize / getYogaMeasureMode) and `MountingManager`, which is both a constructor
+ * parameter type and a field type here. Java still sees all of them because `internal`
+ * stays public in the bytecode; the Kotlin compiler refuses.
+ *
+ * A Kotlin version would have to smuggle MountingManager as `Any` and delegate the whole
+ * method body to a Java helper, which is more indirection for no gain, so the class is
+ * left as-is until React Native opens these APIs up.
+ */
+
+import static com.facebook.react.fabric.mounting.LayoutMetricsConversions.getYogaMeasureMode;
+import static com.facebook.react.fabric.mounting.LayoutMetricsConversions.getYogaSize;
+
+import android.text.SpannableStringBuilder;
+
+import androidx.annotation.Nullable;
+
+import com.facebook.jni.annotations.DoNotStrip;
+import com.facebook.react.bridge.ReactApplicationContext;
+import com.facebook.react.bridge.ReadableMap;
+import com.facebook.react.common.mapbuffer.ReadableMapBuffer;
+import com.facebook.react.fabric.FabricUIManager;
+import com.facebook.react.uimanager.ViewManagerRegistry;
+import com.facebook.react.uimanager.events.BatchEventDispatchedListener;
+import com.facebook.react.views.text.TextLayoutManager;
+
+import java.lang.reflect.Field;
+
+@DoNotStrip
+public class CustomFabricUIManager extends FabricUIManager {
+
+  private final ReactApplicationContext mReactApplicationContext;
+  private final MarkdownUtils mMarkdownUtils;
+
+  public CustomFabricUIManager(
+    ReactApplicationContext reactContext,
+    ViewManagerRegistry viewManagerRegistry,
+    BatchEventDispatchedListener batchEventDispatchedListener,
+    ReadableMap markdownProps,
+    int parserId
+  ) {
+    super(reactContext, viewManagerRegistry, batchEventDispatchedListener);
+
+    this.mReactApplicationContext = reactContext;
+
+    this.mMarkdownUtils = new MarkdownUtils(reactContext);
+    this.mMarkdownUtils.setMarkdownStyle(new MarkdownStyle(markdownProps, reactContext));
+    this.mMarkdownUtils.setParserId(parserId);
+  }
+
+  @Override
+  public long measureText(
+    ReadableMapBuffer attributedString,
+    ReadableMapBuffer paragraphAttributes,
+    float minWidth,
+    float maxWidth,
+    float minHeight,
+    float maxHeight,
+    @Nullable float[] attachmentsPositions) {
+
+    return TextLayoutManager.measureText(
+      mReactApplicationContext.getAssets(),
+      attributedString,
+      paragraphAttributes,
+      getYogaSize(minWidth, maxWidth),
+      getYogaMeasureMode(minWidth, maxWidth),
+      getYogaSize(minHeight, maxHeight),
+      getYogaMeasureMode(minHeight, maxHeight),
+      spannable -> {
+        mMarkdownUtils.applyMarkdownFormatting((SpannableStringBuilder)spannable);
+      },
+      attachmentsPositions);
+  }
+
+  public static FabricUIManager create(FabricUIManager source, ReadableMap markdownProps, int parserId) {
+    try {
+      ReactApplicationContext reactContext = readPrivateField(source, "mReactApplicationContext");
+      ViewManagerRegistry viewManagerRegistry = readPrivateField(source, "mViewManagerRegistry");
+      BatchEventDispatchedListener batchEventDispatchedListener = readPrivateField(source, "mBatchEventDispatchedListener");
+
+      return new CustomFabricUIManager(
+        reactContext,
+        viewManagerRegistry,
+        batchEventDispatchedListener,
+        markdownProps,
+        parserId
+      );
+    } catch (NoSuchFieldException | IllegalAccessException e) {
+      throw new RuntimeException("[Marcus] Cannot read data from FabricUIManager", e);
+    }
+  }
+
+  @SuppressWarnings("unchecked")
+  private static <T> T readPrivateField(Object obj, String name) throws NoSuchFieldException, IllegalAccessException {
+    Class<?> clazz = obj.getClass();
+
+    Field field;
+    try {
+      field = clazz.getDeclaredField(name);
+    } catch (NoSuchFieldException e) {
+      // FabricUIManager is one of the last Java files left in React Native's fabric
+      // package. When it is converted to Kotlin these `m`-prefixed names go away, and a
+      // bare NoSuchFieldException gives no hint why. Name what we actually found.
+      StringBuilder declared = new StringBuilder();
+      for (Field candidate : clazz.getDeclaredFields()) {
+        if (declared.length() > 0) {
+          declared.append(", ");
+        }
+        declared.append(candidate.getName());
+      }
+      throw new NoSuchFieldException(
+          "[Marcus] "
+              + clazz.getName()
+              + " has no field '"
+              + name
+              + "'. React Native most likely renamed it. Declared fields: "
+              + declared);
+    }
+    field.setAccessible(true);
+    T value = (T) field.get(obj);
+
+    return value;
+  }
+}