@react-navigation/native 8.0.0-alpha.2 → 8.0.0-alpha.21

package/ios/ReactNavigationCornerInsetView.mm

@@ -0,0 +1,182 @@
+#import "ReactNavigationCornerInsetView.h"
+
+#import <React/RCTConversions.h>
+
+#if __has_include("ReactNavigation/ReactNavigation-Swift.h")
+#import "ReactNavigation/ReactNavigation-Swift.h"
+#else
+#import "ReactNavigation-Swift.h"
+#endif
+
+#import "ReactNavigationCornerInsetViewComponentDescriptor.h"
+#import "ReactNavigationCornerInsetViewShadowNode.h"
+
+#import <QuartzCore/QuartzCore.h>
+#import <react/renderer/components/ReactNavigationSpec/Props.h>
+
+#import "RCTFabricComponentsPlugins.h"
+
+using namespace facebook::react;
+
+static NSTimeInterval const ReactNavigationCornerInsetAnimationDuration = 0.2;
+static CGFloat const ReactNavigationCornerInsetAnimationTolerance = 0.01;
+
+@interface ReactNavigationCornerInsetView () <ReactNavigationCornerInsetViewImplDelegate>
+
+@end
+
+@implementation ReactNavigationCornerInsetView {
+  ReactNavigationCornerInsetViewImpl * _view;
+  ReactNavigationCornerInsetViewShadowNode::ConcreteState::Shared _state;
+  CGFloat _currentCornerInset;
+  CADisplayLink * _cornerInsetAnimationDisplayLink;
+  CFTimeInterval _cornerInsetAnimationStartTime;
+  CGFloat _cornerInsetAnimationFromValue;
+  CGFloat _cornerInsetAnimationToValue;
+}
+
++ (ComponentDescriptorProvider)componentDescriptorProvider
+{
+    return concreteComponentDescriptorProvider<ReactNavigationCornerInsetViewComponentDescriptor>();
+}
+
++ (BOOL)shouldBeRecycled
+{
+  return NO;
+}
+
+- (instancetype)initWithFrame:(CGRect)frame
+{
+  if (self = [super initWithFrame:frame]) {
+    static const auto defaultProps = std::make_shared<const ReactNavigationCornerInsetViewProps>();
+    _props = defaultProps;
+
+    _view = [[ReactNavigationCornerInsetViewImpl alloc] init];
+    _view.delegate = self;
+
+    self.contentView = _view;
+  }
+
+  return self;
+}
+
+static ReactNavigationCornerInsetViewImplProps *convertProps(const Props::Shared &props) {
+    const auto &viewProps = *std::static_pointer_cast<ReactNavigationCornerInsetViewProps const>(props);
+
+    ReactNavigationCornerInsetViewImplProps *swiftProps = [[ReactNavigationCornerInsetViewImplProps alloc] init];
+
+    swiftProps.direction = viewProps.direction == ReactNavigationCornerInsetViewDirection::Horizontal
+        ? CornerInsetDirectionHorizontal
+        : CornerInsetDirectionVertical;
+
+    swiftProps.edge = viewProps.edge == ReactNavigationCornerInsetViewEdge::Left
+        ? CornerInsetEdgeLeft
+        : viewProps.edge == ReactNavigationCornerInsetViewEdge::Right
+            ? CornerInsetEdgeRight
+            : viewProps.edge == ReactNavigationCornerInsetViewEdge::Bottom
+                ? CornerInsetEdgeBottom
+                : CornerInsetEdgeTop;
+    swiftProps.adaptive = viewProps.adaptive;
+
+    return swiftProps;
+}
+
+- (void)updateProps:(Props::Shared const &)props oldProps:(Props::Shared const &)oldProps
+{
+    [_view updateProps:convertProps(props) oldProps:convertProps(_props)];
+    [super updateProps:props oldProps:oldProps];
+}
+
+- (void)updateState:(const State::Shared &)state oldState:(const State::Shared &)oldState
+{
+    _state = std::static_pointer_cast<ReactNavigationCornerInsetViewShadowNode::ConcreteState const>(state);
+}
+
+- (void)handleCommand:(const NSString *)commandName args:(const NSArray *)args
+{
+    if ([commandName isEqualToString:@"relayout"]) {
+        [_view relayout];
+        return;
+    }
+
+    [super handleCommand:commandName args:args];
+}
+
+- (void)dealloc
+{
+    [self stopCornerInsetAnimation];
+}
+
+- (void)cornerInsetDidChange:(CGFloat)cornerInset animated:(BOOL)animated
+{
+    if (animated) {
+        if (fabs(_currentCornerInset - cornerInset) <= ReactNavigationCornerInsetAnimationTolerance) {
+            return;
+        }
+
+        [self startCornerInsetAnimationTo:cornerInset];
+        return;
+    }
+
+    if (_cornerInsetAnimationDisplayLink != nil &&
+        fabs(_cornerInsetAnimationToValue - cornerInset) <= ReactNavigationCornerInsetAnimationTolerance) {
+        return;
+    }
+
+    [self stopCornerInsetAnimation];
+
+    if (fabs(_currentCornerInset - cornerInset) <= ReactNavigationCornerInsetAnimationTolerance) {
+        return;
+    }
+
+    [self applyCornerInset:cornerInset];
+}
+
+- (void)startCornerInsetAnimationTo:(CGFloat)cornerInset
+{
+    [self stopCornerInsetAnimation];
+
+    _cornerInsetAnimationFromValue = _currentCornerInset;
+    _cornerInsetAnimationToValue = cornerInset;
+    _cornerInsetAnimationStartTime = CACurrentMediaTime();
+    _cornerInsetAnimationDisplayLink =
+        [CADisplayLink displayLinkWithTarget:self selector:@selector(handleCornerInsetAnimationFrame:)];
+    [_cornerInsetAnimationDisplayLink addToRunLoop:[NSRunLoop mainRunLoop] forMode:NSRunLoopCommonModes];
+}
+
+- (void)stopCornerInsetAnimation
+{
+    [_cornerInsetAnimationDisplayLink invalidate];
+    _cornerInsetAnimationDisplayLink = nil;
+    _cornerInsetAnimationStartTime = 0;
+}
+
+- (void)handleCornerInsetAnimationFrame:(CADisplayLink *)displayLink
+{
+    NSTimeInterval elapsed = CACurrentMediaTime() - _cornerInsetAnimationStartTime;
+    CGFloat progress = MIN(1, elapsed / ReactNavigationCornerInsetAnimationDuration);
+    CGFloat inverseProgress = 1 - progress;
+    CGFloat easedProgress = 1 - inverseProgress * inverseProgress * inverseProgress;
+
+    CGFloat cornerInset = _cornerInsetAnimationFromValue +
+                          (_cornerInsetAnimationToValue - _cornerInsetAnimationFromValue) * easedProgress;
+    [self applyCornerInset:cornerInset];
+
+    if (progress >= 1) {
+        [self stopCornerInsetAnimation];
+        [self applyCornerInset:_cornerInsetAnimationToValue];
+    }
+}
+
+- (void)applyCornerInset:(CGFloat)cornerInset
+{
+    _currentCornerInset = cornerInset;
+
+    if (!_state) {
+        return;
+    }
+
+    _state->updateState(ReactNavigationCornerInsetViewState(cornerInset), facebook::react::EventQueue::UpdateMode::unstable_Immediate);
+}
+
+@end

package/ios/ReactNavigationCornerInsetView.swift

@@ -0,0 +1,193 @@
+import UIKit
+
+@objc public enum CornerInsetDirection: Int {
+  case vertical
+  case horizontal
+}
+
+@objc public enum CornerInsetEdge: Int {
+  case top
+  case right
+  case bottom
+  case left
+}
+
+@objcMembers public class ReactNavigationCornerInsetViewImplProps: NSObject {
+  public var direction: CornerInsetDirection = .vertical
+  public var edge: CornerInsetEdge = .top
+  public var adaptive: Bool = true
+}
+
+@objc public protocol ReactNavigationCornerInsetViewImplDelegate: NSObjectProtocol {
+  func cornerInsetDidChange(_ cornerInset: CGFloat, animated: Bool)
+}
+
+@objc public class ReactNavigationCornerInsetViewImpl: UIView {
+  @objc public weak var delegate: ReactNavigationCornerInsetViewImplDelegate?
+
+  private var props: ReactNavigationCornerInsetViewImplProps = ReactNavigationCornerInsetViewImplProps()
+  private var hasMeasuredCornerInset = false
+  private var lastMeasuredCornerInset: CGFloat = 0
+  private weak var measurementView: UIView?
+  private weak var lastMeasuredWindow: UIWindow?
+
+  @objc public func updateProps(_ props: ReactNavigationCornerInsetViewImplProps, oldProps: ReactNavigationCornerInsetViewImplProps) {
+    self.props = props
+
+    if props.direction != oldProps.direction || props.edge != oldProps.edge || props.adaptive != oldProps.adaptive {
+      setNeedsLayout()
+      updateCornerInset(forceMeasurement: true)
+    }
+  }
+
+  @objc public func relayout() {
+    updateCornerInset(animated: true, forceMeasurement: true)
+  }
+
+  public override func didMoveToWindow() {
+    super.didMoveToWindow()
+
+    if window == nil {
+      measurementView?.removeFromSuperview()
+      measurementView = nil
+    }
+
+    updateCornerInset()
+  }
+
+  private func updateCornerInset(animated: Bool = false, forceMeasurement: Bool = false) {
+    if shouldMeasureCornerInset(forceMeasurement: forceMeasurement) {
+      if #available(iOS 26.0, *) {
+        let sourceView: UIView
+
+        if let window {
+          sourceView = prepareMeasurementView(in: window)
+        } else {
+          sourceView = self
+        }
+
+        let cornerMargins = readCornerMargins(from: sourceView)
+
+        switch props.edge {
+        case .top:
+          lastMeasuredCornerInset = cornerMargins.top
+        case .right:
+          lastMeasuredCornerInset = cornerMargins.right
+        case .bottom:
+          lastMeasuredCornerInset = cornerMargins.bottom
+        case .left:
+          lastMeasuredCornerInset = cornerMargins.left
+        }
+      } else {
+        lastMeasuredCornerInset = 0
+      }
+
+      hasMeasuredCornerInset = true
+      lastMeasuredWindow = window
+    }
+
+    delegate?.cornerInsetDidChange(hasMeasuredCornerInset ? lastMeasuredCornerInset : 0, animated: animated)
+  }
+
+  private func shouldMeasureCornerInset(forceMeasurement: Bool) -> Bool {
+    let currentWindow = window
+
+    if forceMeasurement {
+      return currentWindow != nil || !hasMeasuredCornerInset
+    }
+
+    if !hasMeasuredCornerInset {
+      return true
+    }
+
+    guard let currentWindow else {
+      return false
+    }
+
+    return lastMeasuredWindow !== currentWindow
+  }
+
+  @available(iOS 26.0, *)
+  private func prepareMeasurementView(in window: UIWindow) -> UIView {
+    let measurementView = resolveMeasurementView(in: window)
+
+    measurementView.frame = resolveFrameInWindow()
+
+    window.setNeedsUpdateProperties()
+    measurementView.setNeedsUpdateProperties()
+    window.updatePropertiesIfNeeded()
+    measurementView.updatePropertiesIfNeeded()
+
+    return measurementView
+  }
+
+  @available(iOS 26.0, *)
+  private func readCornerMargins(from sourceView: UIView) -> UIEdgeInsets {
+    let adaptedRegion = UIView.LayoutRegion.margins(
+      cornerAdaptation: props.direction == .horizontal ? .horizontal : .vertical
+    )
+    let adaptedMargins = sourceView.edgeInsets(for: adaptedRegion)
+
+    if !props.adaptive {
+      return adaptedMargins
+    }
+
+    let baselineRegion = UIView.LayoutRegion.margins(cornerAdaptation: .none)
+    let baselineMargins = sourceView.edgeInsets(for: baselineRegion)
+
+    return UIEdgeInsets(
+      top: adaptedMargins.top == baselineMargins.top ? 0 : adaptedMargins.top,
+      left: adaptedMargins.left == baselineMargins.left ? 0 : adaptedMargins.left,
+      bottom: adaptedMargins.bottom == baselineMargins.bottom ? 0 : adaptedMargins.bottom,
+      right: adaptedMargins.right == baselineMargins.right ? 0 : adaptedMargins.right
+    )
+  }
+
+  @available(iOS 26.0, *)
+  private func resolveMeasurementView(in window: UIWindow) -> UIView {
+    if let measurementView, measurementView.window === window {
+      return measurementView
+    }
+
+    measurementView?.removeFromSuperview()
+
+    // Use a hidden view in the window so relayout can read the current corner
+    // insets even while transforms are animating.
+    let view = UIView(frame: .zero)
+
+    view.backgroundColor = .clear
+    view.isUserInteractionEnabled = false
+    view.isAccessibilityElement = false
+    view.alpha = 0
+
+    window.addSubview(view)
+    measurementView = view
+
+    return view
+  }
+
+  private func resolveFrameInWindow() -> CGRect {
+    guard let window else {
+      return .zero
+    }
+
+    guard
+      let superLayer = layer.superlayer,
+      let presentationLayer = layer.presentation()
+    else {
+      return superview?.convert(frame, to: window) ?? convert(bounds, to: window)
+    }
+
+    let sourceLayer = superLayer.presentation() ?? superLayer
+    let destinationLayer = window.layer.presentation() ?? window.layer
+    let center = destinationLayer.convert(presentationLayer.position, from: sourceLayer)
+    let bounds = presentationLayer.bounds
+
+    return CGRect(
+      x: center.x - bounds.size.width / 2,
+      y: center.y - bounds.size.height / 2,
+      width: bounds.size.width,
+      height: bounds.size.height
+    )
+  }
+}

package/ios/ReactNavigationCornerInsetViewComponentDescriptor.h

@@ -0,0 +1,23 @@
+#pragma once
+
+#include "ReactNavigationCornerInsetViewShadowNode.h"
+#include <react/renderer/core/ConcreteComponentDescriptor.h>
+
+namespace facebook {
+namespace react {
+
+class ReactNavigationCornerInsetViewComponentDescriptor final
+    : public ConcreteComponentDescriptor<ReactNavigationCornerInsetViewShadowNode> {
+  using ConcreteComponentDescriptor::ConcreteComponentDescriptor;
+
+  void adopt(ShadowNode &shadowNode) const override {
+    auto &concreteShadowNode =
+        static_cast<ReactNavigationCornerInsetViewShadowNode &>(shadowNode);
+    concreteShadowNode.adjustLayoutWithState();
+
+    ConcreteComponentDescriptor::adopt(shadowNode);
+  }
+};
+
+} // namespace react
+} // namespace facebook

package/ios/ReactNavigationCornerInsetViewShadowNode.h

@@ -0,0 +1,27 @@
+#pragma once
+
+#include <jsi/jsi.h>
+#include <react/renderer/components/ReactNavigationSpec/EventEmitters.h>
+#include <react/renderer/components/ReactNavigationSpec/Props.h>
+#include <react/renderer/components/view/ConcreteViewShadowNode.h>
+#include "ReactNavigationCornerInsetViewState.h"
+
+namespace facebook {
+namespace react {
+
+JSI_EXPORT extern const char ReactNavigationCornerInsetViewComponentName[];
+
+class JSI_EXPORT ReactNavigationCornerInsetViewShadowNode final
+    : public ConcreteViewShadowNode<
+          ReactNavigationCornerInsetViewComponentName,
+          ReactNavigationCornerInsetViewProps,
+          ViewEventEmitter,
+          ReactNavigationCornerInsetViewState> {
+  using ConcreteViewShadowNode::ConcreteViewShadowNode;
+
+ public:
+  void adjustLayoutWithState();
+};
+
+} // namespace react
+} // namespace facebook

package/ios/ReactNavigationCornerInsetViewShadowNode.mm

@@ -0,0 +1,42 @@
+#include "ReactNavigationCornerInsetViewShadowNode.h"
+
+#include <react/renderer/core/LayoutContext.h>
+#include <yoga/Yoga.h>
+
+namespace facebook {
+namespace react {
+
+using namespace yoga;
+
+extern const char ReactNavigationCornerInsetViewComponentName[] =
+    "ReactNavigationCornerInsetView";
+
+void ReactNavigationCornerInsetViewShadowNode::adjustLayoutWithState() {
+  ensureUnsealed();
+
+  const auto &props = getConcreteProps();
+  auto state =
+      std::static_pointer_cast<const ReactNavigationCornerInsetViewShadowNode::ConcreteState>(
+          getState());
+  auto stateData = state->getData();
+
+  Float cornerInset = stateData.cornerInset;
+
+  Dimension dimension = props.edge == ReactNavigationCornerInsetViewEdge::Left ||
+                        props.edge == ReactNavigationCornerInsetViewEdge::Right
+      ? Dimension::Width
+      : Dimension::Height;
+
+  auto newLength = StyleSizeLength::points(cornerInset);
+  auto currentLength = yogaNode_.style().dimension(dimension);
+
+  if (currentLength != newLength) {
+    yoga::Style style = yogaNode_.style();
+    style.setDimension(dimension, newLength);
+    yogaNode_.setStyle(style);
+    yogaNode_.setDirty(true);
+  }
+}
+
+} // namespace react
+} // namespace facebook

package/ios/ReactNavigationCornerInsetViewState.h

@@ -0,0 +1,19 @@
+#pragma once
+
+#include <react/renderer/graphics/Float.h>
+
+namespace facebook {
+namespace react {
+
+class JSI_EXPORT ReactNavigationCornerInsetViewState final {
+ public:
+  using Shared = std::shared_ptr<const ReactNavigationCornerInsetViewState>;
+
+  ReactNavigationCornerInsetViewState() = default;
+  ReactNavigationCornerInsetViewState(Float value): cornerInset(value) {}
+
+  Float cornerInset{0};
+};
+
+} // namespace react
+} // namespace facebook

package/ios/ReactNavigationSFSymbolView.mm

@@ -45,6 +45,27 @@ static ReactNavigationSFSymbolViewImplProps *convertProps(const Props::Shared &p
     swiftProps.name = RCTNSStringFromString(viewProps.name);
     swiftProps.size = viewProps.size;
     swiftProps.color = RCTUIColorFromSharedColor(viewProps.color);
+    swiftProps.weight = viewProps.weight;
+    swiftProps.scale = RCTNSStringFromString(viewProps.scale);
+    swiftProps.mode = RCTNSStringFromString(viewProps.mode);
+    swiftProps.animation = RCTNSStringFromString(viewProps.animation);
+    swiftProps.animationRepeating = viewProps.animationRepeating;
+    swiftProps.animationRepeatCount = viewProps.animationRepeatCount;
+    swiftProps.animationSpeed = viewProps.animationSpeed;
+    swiftProps.animationWholeSymbol = viewProps.animationWholeSymbol;
+    swiftProps.animationDirection = RCTNSStringFromString(viewProps.animationDirection);
+    swiftProps.animationReversing = viewProps.animationReversing;
+    swiftProps.animationCumulative = viewProps.animationCumulative;
+
+    if (viewProps.colorPrimary) {
+        swiftProps.colorPrimary = RCTUIColorFromSharedColor(viewProps.colorPrimary);
+    }
+    if (viewProps.colorSecondary) {
+        swiftProps.colorSecondary = RCTUIColorFromSharedColor(viewProps.colorSecondary);
+    }
+    if (viewProps.colorTertiary) {
+        swiftProps.colorTertiary = RCTUIColorFromSharedColor(viewProps.colorTertiary);
+    }
 
     return swiftProps;
 }