react-native-enriched-markdown-scaffold 0.6.0-scaffold.4

package/ios/input/styles/ENRMStyleHandler.h

@@ -0,0 +1,26 @@
+#pragma once
+
+#import "ENRMFormattingRange.h"
+#import "ENRMInputFormatter.h"
+#import "ENRMStyleMergingConfig.h"
+
+NS_ASSUME_NONNULL_BEGIN
+
+@protocol ENRMStyleHandler <NSObject>
+
+@property (nonatomic, readonly) ENRMInputStyleType styleType;
+@property (nonatomic, readonly) ENRMStyleMergingConfig *mergingConfig;
+
+/// Collect font traits that this style contributes (e.g. bold, italic).
+/// Return 0 if the style does not affect the font.
+- (UIFontDescriptorSymbolicTraits)fontTraits;
+
+/// Apply non-font attributes (color, underline, etc.) to the given range.
+- (void)applyNonFontAttributesToTextStorage:(NSTextStorage *)storage
+                                      range:(NSRange)range
+                            formattingRange:(ENRMFormattingRange *)formattingRange
+                                      style:(ENRMInputFormatterStyle *)style;
+
+@end
+
+NS_ASSUME_NONNULL_END

package/ios/input/styles/ENRMStyleMergingConfig.h

@@ -0,0 +1,26 @@
+#pragma once
+
+#import "ENRMInputStyledRange.h"
+#import <Foundation/Foundation.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+/**
+ * Declarative rules for style coexistence.
+ *
+ * conflictingStyles — mutually exclusive: when this style is applied,
+ *   conflicting styles are removed from the same range.
+ * blockingStyles — when any blocking style is active at the cursor/range,
+ *   this style cannot be toggled on.
+ */
+@interface ENRMStyleMergingConfig : NSObject
+
+@property (nonatomic, strong) NSSet<NSNumber *> *conflictingStyles;
+@property (nonatomic, strong) NSSet<NSNumber *> *blockingStyles;
+
++ (instancetype)configWithConflicting:(NSSet<NSNumber *> *)conflicting blocking:(NSSet<NSNumber *> *)blocking;
++ (instancetype)emptyConfig;
+
+@end
+
+NS_ASSUME_NONNULL_END

package/ios/input/styles/ENRMStyleMergingConfig.mm

@@ -0,0 +1,21 @@
+#import "ENRMStyleMergingConfig.h"
+
+@implementation ENRMStyleMergingConfig
+
++ (instancetype)configWithConflicting:(NSSet<NSNumber *> *)conflicting blocking:(NSSet<NSNumber *> *)blocking
+{
+  ENRMStyleMergingConfig *config = [[ENRMStyleMergingConfig alloc] init];
+  config.conflictingStyles = conflicting;
+  config.blockingStyles = blocking;
+  return config;
+}
+
++ (instancetype)emptyConfig
+{
+  static ENRMStyleMergingConfig *shared;
+  static dispatch_once_t onceToken;
+  dispatch_once(&onceToken, ^{ shared = [self configWithConflicting:[NSSet set] blocking:[NSSet set]]; });
+  return shared;
+}
+
+@end

package/ios/input/styles/ENRMUnderlineStyleHandler.h

@@ -0,0 +1,10 @@
+#pragma once
+
+#import "ENRMStyleHandler.h"
+
+NS_ASSUME_NONNULL_BEGIN
+
+@interface ENRMUnderlineStyleHandler : NSObject <ENRMStyleHandler>
+@end
+
+NS_ASSUME_NONNULL_END

package/ios/input/styles/ENRMUnderlineStyleHandler.mm

@@ -0,0 +1,28 @@
+#import "ENRMUnderlineStyleHandler.h"
+
+@implementation ENRMUnderlineStyleHandler
+
+- (ENRMInputStyleType)styleType
+{
+  return ENRMInputStyleTypeUnderline;
+}
+
+- (ENRMStyleMergingConfig *)mergingConfig
+{
+  return [ENRMStyleMergingConfig emptyConfig];
+}
+
+- (UIFontDescriptorSymbolicTraits)fontTraits
+{
+  return 0;
+}
+
+- (void)applyNonFontAttributesToTextStorage:(NSTextStorage *)storage
+                                      range:(NSRange)range
+                            formattingRange:(ENRMFormattingRange *)formattingRange
+                                      style:(ENRMInputFormatterStyle *)style
+{
+  [storage addAttribute:NSUnderlineStyleAttributeName value:@(NSUnderlineStyleSingle) range:range];
+}
+
+@end

package/ios/internals/EnrichedMarkdownComponentDescriptor.h

@@ -0,0 +1,18 @@
+#pragma once
+#include "EnrichedMarkdownShadowNode.h"
+#include <react/debug/react_native_assert.h>
+#include <react/renderer/core/ConcreteComponentDescriptor.h>
+
+namespace facebook::react {
+
+class EnrichedMarkdownComponentDescriptor final : public ConcreteComponentDescriptor<EnrichedMarkdownShadowNode> {
+public:
+  using ConcreteComponentDescriptor::ConcreteComponentDescriptor;
+
+  void adopt(ShadowNode &shadowNode) const override {
+    react_native_assert(dynamic_cast<EnrichedMarkdownShadowNode *>(&shadowNode));
+    ConcreteComponentDescriptor::adopt(shadowNode);
+  }
+};
+
+} // namespace facebook::react

package/ios/internals/EnrichedMarkdownShadowNode.h

@@ -0,0 +1,43 @@
+#pragma once
+#include "MeasurementCache.h"
+#include <ReactNativeEnrichedMarkdown/EnrichedMarkdownState.h>
+#include <ReactNativeEnrichedMarkdown/EventEmitters.h>
+#include <ReactNativeEnrichedMarkdown/Props.h>
+#include <react/renderer/components/view/ConcreteViewShadowNode.h>
+#include <react/renderer/core/LayoutConstraints.h>
+
+namespace facebook::react {
+
+JSI_EXPORT extern const char EnrichedMarkdownComponentName[];
+
+class EnrichedMarkdownShadowNode : public ConcreteViewShadowNode<EnrichedMarkdownComponentName, EnrichedMarkdownProps,
+                                                                 EnrichedMarkdownEventEmitter, EnrichedMarkdownState> {
+public:
+  using ConcreteViewShadowNode::ConcreteViewShadowNode;
+
+  EnrichedMarkdownShadowNode(const ShadowNodeFragment &fragment, const ShadowNodeFamily::Shared &family,
+                             ShadowNodeTraits traits);
+
+  EnrichedMarkdownShadowNode(const ShadowNode &sourceShadowNode, const ShadowNodeFragment &fragment);
+
+  void dirtyLayoutIfNeeded();
+
+  Size measureContent(const LayoutContext &layoutContext, const LayoutConstraints &layoutConstraints) const override;
+
+  static ShadowNodeTraits BaseTraits()
+  {
+    auto traits = ConcreteViewShadowNode::BaseTraits();
+    traits.set(ShadowNodeTraits::Trait::LeafYogaNode);
+    traits.set(ShadowNodeTraits::Trait::MeasurableYogaNode);
+    return traits;
+  }
+
+private:
+  int localHeightRecalculationCounter_{0};
+  mutable int lastExactMeasurementCounter_{0};
+
+  // Creates mock view off-screen for initial measurement when real view doesn't exist
+  id setupMockEnrichedMarkdown_(CGFloat width) const;
+};
+
+} // namespace facebook::react

package/ios/internals/EnrichedMarkdownShadowNode.mm

@@ -0,0 +1,73 @@
+#import "EnrichedMarkdownShadowNode.h"
+#import "EnrichedMarkdown.h"
+#import "ShadowMeasurementUtils.h"
+#import <yoga/Yoga.h>
+
+namespace facebook::react {
+
+extern const char EnrichedMarkdownComponentName[] = "EnrichedMarkdown";
+
+EnrichedMarkdownShadowNode::EnrichedMarkdownShadowNode(const ShadowNodeFragment &fragment,
+                                                       const ShadowNodeFamily::Shared &family, ShadowNodeTraits traits)
+    : ConcreteViewShadowNode(fragment, family, traits)
+{
+}
+
+EnrichedMarkdownShadowNode::EnrichedMarkdownShadowNode(const ShadowNode &sourceShadowNode,
+                                                       const ShadowNodeFragment &fragment)
+    : ConcreteViewShadowNode(sourceShadowNode, fragment),
+      localHeightRecalculationCounter_(
+          static_cast<const EnrichedMarkdownShadowNode &>(sourceShadowNode).localHeightRecalculationCounter_),
+      lastExactMeasurementCounter_(
+          static_cast<const EnrichedMarkdownShadowNode &>(sourceShadowNode).lastExactMeasurementCounter_)
+{
+  const auto &oldProps = *std::static_pointer_cast<const EnrichedMarkdownProps>(sourceShadowNode.getProps());
+  const auto &newProps = *std::static_pointer_cast<const EnrichedMarkdownProps>(this->getProps());
+
+  if (newProps.streamingAnimation && ENRMPropsNeedExactStreamingMeasurement(oldProps, newProps)) {
+    lastExactMeasurementCounter_ = -1;
+  }
+
+  dirtyLayoutIfNeeded();
+}
+
+void EnrichedMarkdownShadowNode::dirtyLayoutIfNeeded()
+{
+  const auto state = this->getStateData();
+  const int receivedCounter = state.getHeightRecalculationCounter();
+
+  if (receivedCounter > localHeightRecalculationCounter_) {
+    localHeightRecalculationCounter_ = receivedCounter;
+    YGNodeMarkDirty(&yogaNode_);
+  }
+}
+
+id EnrichedMarkdownShadowNode::setupMockEnrichedMarkdown_(CGFloat width) const
+{
+  EnrichedMarkdown *mockView = [[EnrichedMarkdown alloc] initWithFrame:CGRectMake(20000, 20000, width, 1000)];
+
+  const auto props = this->getProps();
+  [mockView updateProps:props oldProps:nullptr];
+
+  const auto &typedProps = *std::static_pointer_cast<const EnrichedMarkdownProps>(props);
+  if (!typedProps.markdown.empty()) {
+    NSString *markdown = [NSString stringWithUTF8String:typedProps.markdown.c_str()];
+    [mockView renderMarkdownSynchronously:markdown];
+  }
+
+  return mockView;
+}
+
+Size EnrichedMarkdownShadowNode::measureContent(const LayoutContext &layoutContext,
+                                                const LayoutConstraints &layoutConstraints) const
+{
+  const auto &typedProps = *std::static_pointer_cast<const EnrichedMarkdownProps>(this->getProps());
+  const int receivedCounter = getStateData().getHeightRecalculationCounter();
+
+  return ENRMMeasureMarkdownContent<EnrichedMarkdownProps, EnrichedMarkdown>(
+      typedProps, getStateData().getComponentViewRef(), receivedCounter, lastExactMeasurementCounter_,
+      MarkdownFlavor::GitHub, layoutConstraints,
+      ^(CGFloat width) { return (EnrichedMarkdown *)setupMockEnrichedMarkdown_(width); });
+}
+
+} // namespace facebook::react

package/ios/internals/EnrichedMarkdownState.h

@@ -0,0 +1,23 @@
+#pragma once
+#include <memory>
+
+namespace facebook::react {
+
+class EnrichedMarkdownState {
+public:
+  EnrichedMarkdownState() = default;
+  EnrichedMarkdownState(int counter, std::shared_ptr<void> ref) : counter_(counter), viewRef_(ref) {}
+
+  int getHeightRecalculationCounter() const {
+    return counter_;
+  }
+  std::shared_ptr<void> getComponentViewRef() const {
+    return viewRef_;
+  }
+
+private:
+  int counter_{0};
+  std::shared_ptr<void> viewRef_{nullptr};
+};
+
+} // namespace facebook::react

package/ios/internals/EnrichedMarkdownTextComponentDescriptor.h

@@ -0,0 +1,19 @@
+#pragma once
+#include "EnrichedMarkdownTextShadowNode.h"
+#include <react/debug/react_native_assert.h>
+#include <react/renderer/core/ConcreteComponentDescriptor.h>
+
+namespace facebook::react {
+
+class EnrichedMarkdownTextComponentDescriptor final
+    : public ConcreteComponentDescriptor<EnrichedMarkdownTextShadowNode> {
+public:
+  using ConcreteComponentDescriptor::ConcreteComponentDescriptor;
+
+  void adopt(ShadowNode &shadowNode) const override {
+    react_native_assert(dynamic_cast<EnrichedMarkdownTextShadowNode *>(&shadowNode));
+    ConcreteComponentDescriptor::adopt(shadowNode);
+  }
+};
+
+} // namespace facebook::react

package/ios/internals/EnrichedMarkdownTextShadowNode.h

@@ -0,0 +1,45 @@
+#pragma once
+#include "MeasurementCache.h"
+#include <ReactNativeEnrichedMarkdown/EnrichedMarkdownTextState.h>
+#include <ReactNativeEnrichedMarkdown/EventEmitters.h>
+#include <ReactNativeEnrichedMarkdown/Props.h>
+#include <react/renderer/components/view/ConcreteViewShadowNode.h>
+#include <react/renderer/core/LayoutConstraints.h>
+
+namespace facebook::react {
+
+JSI_EXPORT extern const char EnrichedMarkdownTextComponentName[];
+
+/// ShadowNode implementing measureContent for automatic height calculation.
+class EnrichedMarkdownTextShadowNode
+    : public ConcreteViewShadowNode<EnrichedMarkdownTextComponentName, EnrichedMarkdownTextProps,
+                                    EnrichedMarkdownTextEventEmitter, EnrichedMarkdownTextState> {
+public:
+  using ConcreteViewShadowNode::ConcreteViewShadowNode;
+
+  EnrichedMarkdownTextShadowNode(const ShadowNodeFragment &fragment, const ShadowNodeFamily::Shared &family,
+                                 ShadowNodeTraits traits);
+
+  EnrichedMarkdownTextShadowNode(const ShadowNode &sourceShadowNode, const ShadowNodeFragment &fragment);
+
+  void dirtyLayoutIfNeeded();
+
+  Size measureContent(const LayoutContext &layoutContext, const LayoutConstraints &layoutConstraints) const override;
+
+  static ShadowNodeTraits BaseTraits()
+  {
+    auto traits = ConcreteViewShadowNode::BaseTraits();
+    traits.set(ShadowNodeTraits::Trait::LeafYogaNode);
+    traits.set(ShadowNodeTraits::Trait::MeasurableYogaNode);
+    return traits;
+  }
+
+private:
+  int localHeightRecalculationCounter_{0};
+  mutable int lastExactMeasurementCounter_{0};
+
+  // Creates mock view off-screen for initial measurement when real view doesn't exist
+  id setupMockEnrichedMarkdownText_(CGFloat width) const;
+};
+
+} // namespace facebook::react

package/ios/internals/EnrichedMarkdownTextShadowNode.mm

@@ -0,0 +1,74 @@
+#import "EnrichedMarkdownTextShadowNode.h"
+#import "EnrichedMarkdownText.h"
+#import "ShadowMeasurementUtils.h"
+#import <yoga/Yoga.h>
+
+namespace facebook::react {
+
+extern const char EnrichedMarkdownTextComponentName[] = "EnrichedMarkdownText";
+
+EnrichedMarkdownTextShadowNode::EnrichedMarkdownTextShadowNode(const ShadowNodeFragment &fragment,
+                                                               const ShadowNodeFamily::Shared &family,
+                                                               ShadowNodeTraits traits)
+    : ConcreteViewShadowNode(fragment, family, traits)
+{
+}
+
+EnrichedMarkdownTextShadowNode::EnrichedMarkdownTextShadowNode(const ShadowNode &sourceShadowNode,
+                                                               const ShadowNodeFragment &fragment)
+    : ConcreteViewShadowNode(sourceShadowNode, fragment),
+      localHeightRecalculationCounter_(
+          static_cast<const EnrichedMarkdownTextShadowNode &>(sourceShadowNode).localHeightRecalculationCounter_),
+      lastExactMeasurementCounter_(
+          static_cast<const EnrichedMarkdownTextShadowNode &>(sourceShadowNode).lastExactMeasurementCounter_)
+{
+  const auto &oldProps = *std::static_pointer_cast<const EnrichedMarkdownTextProps>(sourceShadowNode.getProps());
+  const auto &newProps = *std::static_pointer_cast<const EnrichedMarkdownTextProps>(this->getProps());
+
+  if (newProps.streamingAnimation && ENRMPropsNeedExactStreamingMeasurement(oldProps, newProps)) {
+    lastExactMeasurementCounter_ = -1;
+  }
+
+  dirtyLayoutIfNeeded();
+}
+
+void EnrichedMarkdownTextShadowNode::dirtyLayoutIfNeeded()
+{
+  const auto state = this->getStateData();
+  const int receivedCounter = state.getHeightRecalculationCounter();
+
+  if (receivedCounter > localHeightRecalculationCounter_) {
+    localHeightRecalculationCounter_ = receivedCounter;
+    YGNodeMarkDirty(&yogaNode_);
+  }
+}
+
+id EnrichedMarkdownTextShadowNode::setupMockEnrichedMarkdownText_(CGFloat width) const
+{
+  EnrichedMarkdownText *mockView = [[EnrichedMarkdownText alloc] initWithFrame:CGRectMake(20000, 20000, width, 1000)];
+
+  const auto props = this->getProps();
+  [mockView updateProps:props oldProps:nullptr];
+
+  const auto &typedProps = *std::static_pointer_cast<const EnrichedMarkdownTextProps>(props);
+  if (!typedProps.markdown.empty()) {
+    NSString *markdown = [NSString stringWithUTF8String:typedProps.markdown.c_str()];
+    [mockView renderMarkdownSynchronously:markdown];
+  }
+
+  return mockView;
+}
+
+Size EnrichedMarkdownTextShadowNode::measureContent(const LayoutContext &layoutContext,
+                                                    const LayoutConstraints &layoutConstraints) const
+{
+  const auto &typedProps = *std::static_pointer_cast<const EnrichedMarkdownTextProps>(this->getProps());
+  const int receivedCounter = getStateData().getHeightRecalculationCounter();
+
+  return ENRMMeasureMarkdownContent<EnrichedMarkdownTextProps, EnrichedMarkdownText>(
+      typedProps, getStateData().getComponentViewRef(), receivedCounter, lastExactMeasurementCounter_,
+      MarkdownFlavor::CommonMark, layoutConstraints,
+      ^(CGFloat width) { return (EnrichedMarkdownText *)setupMockEnrichedMarkdownText_(width); });
+}
+
+} // namespace facebook::react

package/ios/internals/EnrichedMarkdownTextState.h

@@ -0,0 +1,24 @@
+#pragma once
+#include <memory>
+
+namespace facebook::react {
+
+/// Counter triggers layout recalculation, viewRef allows shadow node to access view for measurement.
+class EnrichedMarkdownTextState {
+public:
+  EnrichedMarkdownTextState() = default;
+  EnrichedMarkdownTextState(int counter, std::shared_ptr<void> ref) : counter_(counter), viewRef_(ref) {}
+
+  int getHeightRecalculationCounter() const {
+    return counter_;
+  }
+  std::shared_ptr<void> getComponentViewRef() const {
+    return viewRef_;
+  }
+
+private:
+  int counter_{0};
+  std::shared_ptr<void> viewRef_{nullptr};
+};
+
+} // namespace facebook::react

package/ios/internals/MeasurementCache.h

@@ -0,0 +1,223 @@
+#pragma once
+
+#include <CoreGraphics/CGBase.h>
+#include <React/RCTUtils.h>
+#include <list>
+#include <mutex>
+#include <react/renderer/graphics/Float.h>
+#include <string>
+#include <tuple>
+#include <unordered_map>
+
+namespace facebook::react {
+
+struct HashUtils {
+
+  static inline size_t combine(size_t h, size_t v)
+  {
+    return h ^ (v + 0x9e3779b97f4a7c15ULL + (h << 6) + (h >> 2));
+  }
+
+  template <typename T> static inline void hash_one(size_t &seed, const T &v)
+  {
+    seed = combine(seed, std::hash<T>{}(v));
+  }
+};
+
+enum class MarkdownFlavor : uint8_t {
+  CommonMark = 0,
+  GitHub = 1,
+};
+
+struct MeasurementCacheKey {
+  std::string markdown;
+  CGFloat maxWidth;
+  bool allowTrailingMargin;
+  bool allowFontScaling;
+  double maxFontSizeMultiplier;
+  bool md4cFlagsUnderline;
+  bool md4cFlagsSuperscript;
+  bool md4cFlagsSubscript;
+  bool md4cFlagsHighlight;
+  bool md4cFlagsLatexMath;
+  size_t styleFingerprint;
+  CGFloat fontScale;
+  MarkdownFlavor flavor;
+
+  bool operator==(const MeasurementCacheKey &other) const
+  {
+    return std::tie(markdown, maxWidth, allowTrailingMargin, allowFontScaling, maxFontSizeMultiplier,
+                    md4cFlagsUnderline, md4cFlagsSuperscript, md4cFlagsSubscript, md4cFlagsHighlight,
+                    md4cFlagsLatexMath, styleFingerprint, fontScale, flavor) ==
+           std::tie(other.markdown, other.maxWidth, other.allowTrailingMargin, other.allowFontScaling,
+                    other.maxFontSizeMultiplier, other.md4cFlagsUnderline, other.md4cFlagsSuperscript,
+                    other.md4cFlagsSubscript, other.md4cFlagsHighlight, other.md4cFlagsLatexMath,
+                    other.styleFingerprint, other.fontScale, other.flavor);
+  }
+};
+
+struct MeasurementCacheKeyHash {
+  size_t operator()(const MeasurementCacheKey &key) const
+  {
+    size_t h = 0;
+    HashUtils::hash_one(h, key.markdown);
+    HashUtils::hash_one(h, key.maxWidth);
+    HashUtils::hash_one(h, key.allowTrailingMargin);
+    HashUtils::hash_one(h, key.allowFontScaling);
+    HashUtils::hash_one(h, key.maxFontSizeMultiplier);
+    HashUtils::hash_one(h, key.md4cFlagsUnderline);
+    HashUtils::hash_one(h, key.md4cFlagsSuperscript);
+    HashUtils::hash_one(h, key.md4cFlagsSubscript);
+    HashUtils::hash_one(h, key.md4cFlagsHighlight);
+    HashUtils::hash_one(h, key.md4cFlagsLatexMath);
+    HashUtils::hash_one(h, key.styleFingerprint);
+    HashUtils::hash_one(h, key.fontScale);
+    HashUtils::hash_one(h, static_cast<uint8_t>(key.flavor));
+    return h;
+  }
+};
+
+struct CachedSize {
+  CGFloat width;
+  CGFloat height;
+};
+
+template <typename StyleStruct> inline size_t computeStyleFingerprint(const StyleStruct &s)
+{
+  size_t h = 0;
+  auto hashFields = [&](auto... args) { (HashUtils::hash_one(h, args), ...); };
+
+  auto hashTextLayout = [&](const auto &item) {
+    hashFields(item.fontFamily, item.fontSize, item.fontWeight, item.marginTop, item.marginBottom, item.lineHeight);
+  };
+
+  // Block Elements
+  hashTextLayout(s.paragraph);
+  hashFields(s.paragraph.textAlign);
+  hashTextLayout(s.h1);
+  hashFields(s.h1.textAlign);
+  hashTextLayout(s.h2);
+  hashFields(s.h2.textAlign);
+  hashTextLayout(s.h3);
+  hashFields(s.h3.textAlign);
+  hashTextLayout(s.h4);
+  hashFields(s.h4.textAlign);
+  hashTextLayout(s.h5);
+  hashFields(s.h5.textAlign);
+  hashTextLayout(s.h6);
+  hashFields(s.h6.textAlign);
+
+  hashTextLayout(s.blockquote);
+  hashFields(s.blockquote.borderWidth, s.blockquote.gapWidth);
+
+  hashTextLayout(s.list);
+  hashFields(s.list.bulletSize, s.list.markerMinWidth, s.list.markerFontWeight, s.list.gapWidth, s.list.marginLeft);
+
+  // Code & Inlines
+  hashFields(s.codeBlock.fontFamily, s.codeBlock.fontSize, s.codeBlock.fontWeight, s.codeBlock.marginTop,
+             s.codeBlock.marginBottom, s.codeBlock.lineHeight, s.codeBlock.padding, s.codeBlock.borderRadius,
+             s.codeBlock.borderWidth);
+  hashFields(s.code.fontFamily, s.code.fontSize);
+  hashFields(s.link.fontFamily, s.strong.fontFamily, s.strong.fontWeight, s.em.fontFamily, s.em.fontStyle);
+  hashFields(s.highlight.backgroundColor, s.highlight.color);
+
+  // Visual/Spacing Elements
+  hashFields(s.image.height, s.image.marginTop, s.image.marginBottom);
+  hashFields(s.inlineImage.size);
+  hashFields(s.thematicBreak.height, s.thematicBreak.marginTop, s.thematicBreak.marginBottom);
+
+  // Complex Components
+  hashTextLayout(s.table);
+  hashFields(s.table.headerFontFamily, s.table.cellPaddingHorizontal, s.table.cellPaddingVertical, s.table.borderWidth,
+             s.table.borderRadius);
+  hashFields(s.math.fontSize, s.math.padding, s.math.marginTop, s.math.marginBottom, s.math.textAlign);
+  hashFields(s.taskList.checkboxSize, s.taskList.checkboxBorderRadius);
+
+  return h;
+}
+
+template <typename PropsType>
+inline MeasurementCacheKey buildMeasurementCacheKey(const PropsType &props, CGFloat maxWidth, CGFloat fontScale,
+                                                    MarkdownFlavor flavor)
+{
+  return MeasurementCacheKey{
+      .markdown = props.markdown,
+      .maxWidth = maxWidth,
+      .allowTrailingMargin = props.allowTrailingMargin,
+      .allowFontScaling = props.allowFontScaling,
+      .maxFontSizeMultiplier = props.maxFontSizeMultiplier,
+      .md4cFlagsUnderline = props.md4cFlags.underline,
+      .md4cFlagsSuperscript = props.md4cFlags.superscript,
+      .md4cFlagsSubscript = props.md4cFlags.subscript,
+      .md4cFlagsHighlight = props.md4cFlags.highlight,
+      .md4cFlagsLatexMath = props.md4cFlags.latexMath,
+      .styleFingerprint = computeStyleFingerprint(props.markdownStyle),
+      .fontScale = fontScale,
+      .flavor = flavor,
+  };
+}
+
+/**
+ * Thread-safe global measurement cache using an LRU (Least Recently Used) strategy.
+ * This ensures O(1) lookups while automatically discarding the oldest entries.
+ */
+class MeasurementCache {
+public:
+  struct CacheEntry {
+    MeasurementCacheKey key;
+    CachedSize size;
+  };
+
+  static MeasurementCache &shared()
+  {
+    static MeasurementCache instance;
+    return instance;
+  }
+
+  bool get(const MeasurementCacheKey &key, CachedSize &outSize)
+  {
+    std::lock_guard<std::mutex> lock(mutex_);
+
+    auto it = map_.find(key);
+    if (it == map_.end()) {
+      return false;
+    }
+
+    list_.splice(list_.begin(), list_, it->second);
+
+    outSize = it->second->size;
+    return true;
+  }
+
+  void set(const MeasurementCacheKey &key, CachedSize size)
+  {
+    std::lock_guard<std::mutex> lock(mutex_);
+
+    auto it = map_.find(key);
+    if (it != map_.end()) {
+      it->second->size = size;
+      list_.splice(list_.begin(), list_, it->second);
+      return;
+    }
+
+    list_.push_front({key, size});
+    map_[key] = list_.begin();
+
+    if (map_.size() > kMaxEntries) {
+      auto &lastEntry = list_.back();
+      map_.erase(lastEntry.key);
+      list_.pop_back();
+    }
+  }
+
+private:
+  MeasurementCache() = default;
+
+  static constexpr size_t kMaxEntries = 512;
+  mutable std::mutex mutex_;
+
+  std::list<CacheEntry> list_;
+  std::unordered_map<MeasurementCacheKey, std::list<CacheEntry>::iterator, MeasurementCacheKeyHash> map_;
+};
+
+} // namespace facebook::react