@lodev09/react-native-true-sheet 4.0.0-beta.0 → 4.0.0-beta.10

package/common/cpp/react/renderer/components/TrueSheetSpec/TrueSheetFooterViewShadowNode.cpp

@@ -0,0 +1,63 @@
+#include "TrueSheetFooterViewShadowNode.h"
+
+#include <react/renderer/components/view/conversions.h>
+
+#include "TrueSheetInsets.h"
+
+namespace facebook::react {
+
+using namespace yoga;
+
+extern const char TrueSheetFooterViewComponentName[] = "TrueSheetFooterView";
+
+void TrueSheetFooterViewShadowNode::adjustLayoutWithState() {
+  ensureUnsealed();
+
+  auto state = std::static_pointer_cast<
+      const TrueSheetFooterViewShadowNode::ConcreteState>(getState());
+  auto stateData = state->getData();
+
+  auto &props = getConcreteProps();
+
+  // Until native pushes the real inset (which requires this node to already
+  // exist), seed a late-mounted footer's first layout with the precalculated
+  // inset — otherwise it lays out unpadded and forces a second sheet resize.
+  float bottomInset = stateData.bottomInset;
+  if (!stateData.initialized && props.autoBottomInset) {
+    bottomInset = TrueSheetInsets::bottomSafeArea();
+    if (bottomInset != stateData.bottomInset) {
+      // Record the seeded value so the mounted view reads exactly the inset
+      // baked into this layout — the global may change before mount.
+      auto seededData = stateData;
+      seededData.bottomInset = bottomInset;
+      setStateData(std::move(seededData));
+    }
+  }
+
+  // A footer pinned to the sheet's bottom edge owns the bottom safe-area
+  // inset — pad it on top of any style padding so its content clears the
+  // home indicator while the background fills the inset.
+  auto padding = props.yogaStyle.padding(Edge::Bottom);
+  if (bottomInset > 0) {
+    // Base bottom padding from the style — Edge::Bottom wins over
+    // Vertical/All, mirroring Yoga's own resolution. Points only.
+    float base = 0;
+    for (auto edge : {Edge::Bottom, Edge::Vertical, Edge::All}) {
+      auto length = props.yogaStyle.padding(edge);
+      if (length.isDefined()) {
+        base = length.isPoints() ? length.value().unwrap() : 0;
+        break;
+      }
+    }
+    padding = StyleLength::points(base + bottomInset);
+  }
+
+  if (yogaNode_.style().padding(Edge::Bottom) != padding) {
+    yoga::Style adjustedStyle = props.yogaStyle;
+    adjustedStyle.setPadding(Edge::Bottom, padding);
+    yogaNode_.setStyle(adjustedStyle);
+    yogaNode_.setDirty(true);
+  }
+}
+
+} // namespace facebook::react

package/common/cpp/react/renderer/components/TrueSheetSpec/TrueSheetFooterViewShadowNode.h

@@ -0,0 +1,28 @@
+#pragma once
+
+#include <jsi/jsi.h>
+#include <react/renderer/components/TrueSheetSpec/EventEmitters.h>
+#include <react/renderer/components/TrueSheetSpec/Props.h>
+#include <react/renderer/components/TrueSheetSpec/TrueSheetFooterViewState.h>
+#include <react/renderer/components/view/ConcreteViewShadowNode.h>
+
+namespace facebook::react {
+
+JSI_EXPORT extern const char TrueSheetFooterViewComponentName[];
+
+/*
+ * `ShadowNode` for <TrueSheetFooterView> component.
+ */
+class JSI_EXPORT TrueSheetFooterViewShadowNode final
+    : public ConcreteViewShadowNode<
+          TrueSheetFooterViewComponentName,
+          TrueSheetFooterViewProps,
+          TrueSheetFooterViewEventEmitter,
+          TrueSheetFooterViewState> {
+  using ConcreteViewShadowNode::ConcreteViewShadowNode;
+
+ public:
+  void adjustLayoutWithState();
+};
+
+} // namespace facebook::react

package/common/cpp/react/renderer/components/TrueSheetSpec/TrueSheetFooterViewState.cpp

@@ -0,0 +1,11 @@
+#include "TrueSheetFooterViewState.h"
+
+namespace facebook::react {
+
+#ifdef ANDROID
+folly::dynamic TrueSheetFooterViewState::getDynamic() const {
+  return folly::dynamic::object("bottomInset", bottomInset);
+}
+#endif
+
+} // namespace facebook::react

package/common/cpp/react/renderer/components/TrueSheetSpec/TrueSheetFooterViewState.h

@@ -0,0 +1,41 @@
+#pragma once
+
+#ifdef ANDROID
+#include <folly/dynamic.h>
+#include <react/renderer/mapbuffer/MapBuffer.h>
+#include <react/renderer/mapbuffer/MapBufferBuilder.h>
+#endif
+
+namespace facebook::react {
+
+/*
+ * State for <TrueSheetFooterView> component.
+ * Set from native with the sheet's bottom safe-area inset so the shadow node
+ * pads the footer's bottom edge (see TrueSheetFooterViewShadowNode).
+ */
+class TrueSheetFooterViewState final {
+ public:
+  TrueSheetFooterViewState() = default;
+
+#ifdef ANDROID
+  TrueSheetFooterViewState(
+      TrueSheetFooterViewState const &previousState,
+      folly::dynamic data)
+      : bottomInset(static_cast<float>(data["bottomInset"].getDouble())),
+        initialized(true) {}
+#endif
+
+  float bottomInset{0};
+  // True once native has pushed a real inset — until then the shadow node
+  // seeds the layout from TrueSheetInsets (see TrueSheetFooterViewShadowNode)
+  bool initialized{false};
+
+#ifdef ANDROID
+  folly::dynamic getDynamic() const;
+  MapBuffer getMapBuffer() const {
+    return MapBufferBuilder::EMPTY();
+  }
+#endif
+};
+
+} // namespace facebook::react

package/common/cpp/react/renderer/components/TrueSheetSpec/TrueSheetInsets.cpp

@@ -0,0 +1,18 @@
+#include "TrueSheetInsets.h"
+
+#include <atomic>
+
+namespace facebook::react {
+
+// Written from the UI thread, read from the layout thread
+static std::atomic<float> gBottomSafeArea{0};
+
+void TrueSheetInsets::setBottomSafeArea(float inset) {
+  gBottomSafeArea.store(inset, std::memory_order_relaxed);
+}
+
+float TrueSheetInsets::bottomSafeArea() {
+  return gBottomSafeArea.load(std::memory_order_relaxed);
+}
+
+} // namespace facebook::react

package/common/cpp/react/renderer/components/TrueSheetSpec/TrueSheetInsets.h

@@ -0,0 +1,16 @@
+#pragma once
+
+namespace facebook::react {
+
+/*
+ * Bottom safe-area inset published by the host platform (points/dp) so a
+ * late-mounted footer's first layout can be padded before any Fabric state
+ * lands (see TrueSheetFooterViewShadowNode).
+ */
+class TrueSheetInsets {
+ public:
+  static void setBottomSafeArea(float inset);
+  static float bottomSafeArea();
+};
+
+} // namespace facebook::react

package/common/cpp/react/renderer/components/TrueSheetSpec/TrueSheetLayoutUtils.h

@@ -0,0 +1,46 @@
+#pragma once
+
+#include <react/renderer/components/view/conversions.h>
+#include <yoga/node/Node.h>
+#include <yoga/style/Style.h>
+
+namespace facebook::react {
+
+/*
+ * Overrides a node's Yoga dimensions with the container size reported from
+ * native. A zero dimension leaves that axis to Yoga.
+ */
+inline void applyContainerSizeToYogaNode(
+    yoga::Node &node,
+    const yoga::Style &baseStyle,
+    float containerWidth,
+    float containerHeight) {
+  if (containerWidth <= 0 && containerHeight <= 0) {
+    return;
+  }
+
+  yoga::Style adjustedStyle = baseStyle;
+  const auto &currentStyle = node.style();
+  bool needsUpdate = false;
+
+  if (containerWidth > 0) {
+    adjustedStyle.setDimension(yoga::Dimension::Width, yoga::StyleSizeLength::points(containerWidth));
+    if (adjustedStyle.dimension(yoga::Dimension::Width) != currentStyle.dimension(yoga::Dimension::Width)) {
+      needsUpdate = true;
+    }
+  }
+
+  if (containerHeight > 0) {
+    adjustedStyle.setDimension(yoga::Dimension::Height, yoga::StyleSizeLength::points(containerHeight));
+    if (adjustedStyle.dimension(yoga::Dimension::Height) != currentStyle.dimension(yoga::Dimension::Height)) {
+      needsUpdate = true;
+    }
+  }
+
+  if (needsUpdate) {
+    node.setStyle(adjustedStyle);
+    node.setDirty(true);
+  }
+}
+
+} // namespace facebook::react

package/common/cpp/react/renderer/components/TrueSheetSpec/TrueSheetOverlayViewComponentDescriptor.h

@@ -0,0 +1,21 @@
+#pragma once
+
+#include <react/renderer/components/TrueSheetSpec/TrueSheetOverlayViewShadowNode.h>
+#include <react/renderer/core/ConcreteComponentDescriptor.h>
+
+namespace facebook::react {
+
+/*
+ * Descriptor for <TrueSheetOverlayView> component.
+ */
+class TrueSheetOverlayViewComponentDescriptor final
+    : public ConcreteComponentDescriptor<TrueSheetOverlayViewShadowNode> {
+  using ConcreteComponentDescriptor::ConcreteComponentDescriptor;
+
+  void adopt(ShadowNode &shadowNode) const override {
+    static_cast<TrueSheetOverlayViewShadowNode &>(shadowNode).adjustLayoutWithState();
+    ConcreteComponentDescriptor::adopt(shadowNode);
+  }
+};
+
+} // namespace facebook::react

package/common/cpp/react/renderer/components/TrueSheetSpec/TrueSheetOverlayViewShadowNode.cpp

@@ -0,0 +1,17 @@
+#include "TrueSheetOverlayViewShadowNode.h"
+
+#include "TrueSheetLayoutUtils.h"
+
+namespace facebook::react {
+
+extern const char TrueSheetOverlayViewComponentName[] = "TrueSheetOverlayView";
+
+void TrueSheetOverlayViewShadowNode::adjustLayoutWithState() {
+  ensureUnsealed();
+
+  const auto &stateData = getStateData();
+  applyContainerSizeToYogaNode(
+      yogaNode_, getConcreteProps().yogaStyle, stateData.containerWidth, stateData.containerHeight);
+}
+
+} // namespace facebook::react

package/common/cpp/react/renderer/components/TrueSheetSpec/TrueSheetOverlayViewShadowNode.h

@@ -0,0 +1,36 @@
+#pragma once
+
+#include <jsi/jsi.h>
+#include <react/renderer/components/TrueSheetSpec/EventEmitters.h>
+#include <react/renderer/components/TrueSheetSpec/Props.h>
+#include <react/renderer/components/TrueSheetSpec/TrueSheetViewState.h>
+#include <react/renderer/components/view/ConcreteViewShadowNode.h>
+
+namespace facebook::react {
+
+JSI_EXPORT extern const char TrueSheetOverlayViewComponentName[];
+
+/*
+ * `ShadowNode` for <TrueSheetOverlayView> component.
+ * Sized to the window from native (via TrueSheetViewState) so its children
+ * lay out against the full window like the sheet's container.
+ */
+class JSI_EXPORT TrueSheetOverlayViewShadowNode final
+    : public ConcreteViewShadowNode<
+          TrueSheetOverlayViewComponentName,
+          TrueSheetOverlayViewProps,
+          TrueSheetOverlayViewEventEmitter,
+          TrueSheetViewState> {
+  using ConcreteViewShadowNode::ConcreteViewShadowNode;
+
+ public:
+  static ShadowNodeTraits BaseTraits() {
+    auto traits = ConcreteViewShadowNode::BaseTraits();
+    traits.set(ShadowNodeTraits::Trait::RootNodeKind);
+    return traits;
+  }
+
+  void adjustLayoutWithState();
+};
+
+} // namespace facebook::react

package/common/cpp/react/renderer/components/TrueSheetSpec/TrueSheetViewComponentDescriptor.h

@@ -0,0 +1,28 @@
+#pragma once
+
+#include <react/renderer/components/TrueSheetSpec/TrueSheetViewShadowNode.h>
+#include <react/renderer/core/ConcreteComponentDescriptor.h>
+
+namespace facebook::react {
+
+/*
+ * Descriptor for <TrueSheetView> component.
+ */
+class TrueSheetViewComponentDescriptor final
+    : public ConcreteComponentDescriptor<TrueSheetViewShadowNode> {
+  using ConcreteComponentDescriptor::ConcreteComponentDescriptor;
+
+  void adopt(ShadowNode &shadowNode) const override {
+    auto &concreteShadowNode =
+        static_cast<TrueSheetViewShadowNode &>(shadowNode);
+    concreteShadowNode.adjustLayoutWithState();
+
+    ConcreteComponentDescriptor::adopt(shadowNode);
+
+#if !defined(ANDROID)
+    concreteShadowNode.setEventDispatcher(eventDispatcher_);
+#endif
+  }
+};
+
+} // namespace facebook::react

package/common/cpp/react/renderer/components/TrueSheetSpec/TrueSheetViewShadowNode.cpp

@@ -0,0 +1,30 @@
+#include "TrueSheetViewShadowNode.h"
+
+#include "TrueSheetLayoutUtils.h"
+
+namespace facebook::react {
+
+extern const char TrueSheetViewComponentName[] = "TrueSheetView";
+
+void TrueSheetViewShadowNode::adjustLayoutWithState() {
+  ensureUnsealed();
+
+  const auto &stateData = getStateData();
+  applyContainerSizeToYogaNode(
+      yogaNode_, getConcreteProps().yogaStyle, stateData.containerWidth, stateData.containerHeight);
+}
+
+#if !defined(ANDROID)
+void TrueSheetViewShadowNode::setEventDispatcher(
+    std::weak_ptr<const EventDispatcher> dispatcher) {
+  getStateDataMutable().setEventDispatcher(dispatcher);
+}
+
+TrueSheetViewShadowNode::StateData &
+TrueSheetViewShadowNode::getStateDataMutable() {
+  ensureUnsealed();
+  return const_cast<TrueSheetViewShadowNode::StateData &>(getStateData());
+}
+#endif
+
+} // namespace facebook::react

package/common/cpp/react/renderer/components/TrueSheetSpec/TrueSheetViewShadowNode.h

@@ -0,0 +1,45 @@
+#pragma once
+
+#include <jsi/jsi.h>
+#include <react/renderer/components/TrueSheetSpec/EventEmitters.h>
+#include <react/renderer/components/TrueSheetSpec/Props.h>
+#include <react/renderer/components/TrueSheetSpec/TrueSheetViewState.h>
+#include <react/renderer/components/view/ConcreteViewShadowNode.h>
+
+namespace facebook::react {
+
+class EventDispatcher;
+
+JSI_EXPORT extern const char TrueSheetViewComponentName[];
+
+/*
+ * `ShadowNode` for <TrueSheetView> component.
+ */
+class JSI_EXPORT TrueSheetViewShadowNode final
+    : public ConcreteViewShadowNode<
+          TrueSheetViewComponentName,
+          TrueSheetViewProps,
+          TrueSheetViewEventEmitter,
+          TrueSheetViewState> {
+  using ConcreteViewShadowNode::ConcreteViewShadowNode;
+
+ public:
+  using StateData = ConcreteViewShadowNode::ConcreteStateData;
+
+  static ShadowNodeTraits BaseTraits() {
+    auto traits = ConcreteViewShadowNode::BaseTraits();
+    traits.set(ShadowNodeTraits::Trait::RootNodeKind);
+    return traits;
+  }
+
+  void adjustLayoutWithState();
+
+#if !defined(ANDROID)
+  void setEventDispatcher(std::weak_ptr<const EventDispatcher> dispatcher);
+
+ private:
+  StateData &getStateDataMutable();
+#endif
+};
+
+} // namespace facebook::react

package/common/cpp/react/renderer/components/TrueSheetSpec/TrueSheetViewState.cpp

@@ -0,0 +1,23 @@
+#include "TrueSheetViewState.h"
+
+namespace facebook::react {
+
+#ifdef ANDROID
+folly::dynamic TrueSheetViewState::getDynamic() const {
+  return folly::dynamic::object("containerWidth", containerWidth)("containerHeight", containerHeight);
+}
+#endif
+
+#if !defined(ANDROID)
+void TrueSheetViewState::setEventDispatcher(
+    std::weak_ptr<const EventDispatcher> dispatcher) {
+  eventDispatcher_ = dispatcher;
+}
+
+std::weak_ptr<const EventDispatcher> TrueSheetViewState::getEventDispatcher()
+    const noexcept {
+  return eventDispatcher_;
+}
+#endif
+
+} // namespace facebook::react

package/common/cpp/react/renderer/components/TrueSheetSpec/TrueSheetViewState.h

@@ -0,0 +1,52 @@
+#pragma once
+
+#include <memory>
+
+#ifdef ANDROID
+#include <folly/dynamic.h>
+#include <react/renderer/mapbuffer/MapBuffer.h>
+#include <react/renderer/mapbuffer/MapBufferBuilder.h>
+#endif
+
+namespace facebook::react {
+
+class EventDispatcher;
+
+/*
+ * State for <TrueSheetView> component.
+ * Contains the container dimensions from native.
+ */
+class TrueSheetViewState final {
+ public:
+  using Shared = std::shared_ptr<const TrueSheetViewState>;
+
+  TrueSheetViewState() = default;
+
+#ifdef ANDROID
+  TrueSheetViewState(
+      TrueSheetViewState const &previousState,
+      folly::dynamic data)
+      : containerWidth(static_cast<float>(data["containerWidth"].getDouble())),
+        containerHeight(static_cast<float>(data["containerHeight"].getDouble())) {}
+#endif
+
+  float containerWidth{0};
+  float containerHeight{0};
+
+#ifdef ANDROID
+  folly::dynamic getDynamic() const;
+  MapBuffer getMapBuffer() const {
+    return MapBufferBuilder::EMPTY();
+  }
+#endif
+
+#if !defined(ANDROID)
+  void setEventDispatcher(std::weak_ptr<const EventDispatcher> dispatcher);
+  std::weak_ptr<const EventDispatcher> getEventDispatcher() const noexcept;
+
+ private:
+  std::weak_ptr<const EventDispatcher> eventDispatcher_;
+#endif
+};
+
+} // namespace facebook::react

package/ios/TrueSheetContainerView.h

@@ -10,16 +10,33 @@
 
 #import <React/RCTViewComponentView.h>
 #import <UIKit/UIKit.h>
+#import <react/renderer/components/TrueSheetSpec/Props.h>
 
 NS_ASSUME_NONNULL_BEGIN
 
+@interface ScrollableOptions : NSObject
+
+@property (nonatomic, assign) BOOL contentInsetAdjustment;
+@property (nonatomic, assign) CGFloat keyboardScrollOffset;
+@property (nonatomic, assign) CGFloat keyboardOffset;
+@property (nonatomic, assign) BOOL scrollingExpandsSheet;
+@property (nonatomic, assign) facebook::react::TrueSheetViewTopScrollEdgeEffect topScrollEdgeEffect;
+@property (nonatomic, assign) facebook::react::TrueSheetViewBottomScrollEdgeEffect bottomScrollEdgeEffect;
+
+@end
+
+@class TrueSheetPeekView;
+
 @protocol TrueSheetContainerViewDelegate <NSObject>
 
-/**
- * Called when the container's content size changes
- * @param newSize The new size of the content
- */
 - (void)containerViewContentDidChangeSize:(CGSize)newSize;
+- (void)containerViewScrollViewDidChange;
+
+@optional
+
+- (void)containerViewHeaderDidChangeSize:(CGSize)newSize;
+- (void)containerViewFooterDidChangeSize:(CGSize)newSize;
+- (void)containerViewPeekDidChangeSize:(CGSize)newSize;
 
 @end
 
@@ -30,15 +47,80 @@ NS_ASSUME_NONNULL_BEGIN
  */
 @property (nonatomic, weak, nullable) id<TrueSheetContainerViewDelegate> delegate;
 
+/**
+ * Options for scrollable behavior
+ */
+@property (nonatomic, strong, nullable) ScrollableOptions *scrollableOptions;
+
+/**
+ * React tag of the user-provided scrollable within the content (see the `scrollableRef` prop)
+ */
+@property (nonatomic, assign) NSInteger scrollableHandle;
+
+/**
+ * Whether the resolved scrollable's `contentInsetAdjustmentBehavior` is set to
+ * `automatic` — already gated by the sheet's `insetAdjustment`
+ */
+@property (nonatomic, assign) BOOL contentInsetAdjustment;
+
+/**
+ * Bottom safe-area inset the footer absorbs as padding — the footer
+ * owns the sheet's bottom edge, so its background fills the inset
+ */
+@property (nonatomic, assign) CGFloat footerBottomInset;
+
 /**
  * Returns the current content height
  */
 - (CGFloat)contentHeight;
 
 /**
- * Updates footer layout constraints if needed
+ * Returns the current header height
+ */
+- (CGFloat)headerHeight;
+
+/**
+ * Returns the current footer height
+ */
+- (CGFloat)footerHeight;
+
+/**
+ * Returns the bottom inset currently baked into the footer's height
+ */
+- (CGFloat)footerAppliedBottomInset;
+
+/**
+ * Returns the current height of the peek view within the content
+ */
+- (CGFloat)peekContentHeight;
+
+/**
+ * Registers a peek view found within the content subtree
+ */
+- (void)attachPeekView:(TrueSheetPeekView *)peekView;
+
+/**
+ * Re-applies the footer's keyboard slide to reflect a live `keyboardOffset` change.
+ */
+- (void)updateFooterKeyboardOffset;
+
+- (BOOL)hasAccessibilityFooterElements;
+
+/**
+ * Setup scrollable content
+ */
+- (void)setupScrollable;
+
+/**
+ * Setup keyboard observer for content and footer
+ * @param viewController The sheet view controller to observe keyboard events for
+ */
+- (void)setupKeyboardObserverWithViewController:(UIViewController *)viewController;
+
+/**
+ * Cleanup keyboard observer
  */
-- (void)layoutFooter;
+- (void)cleanupKeyboardObserver;
 
 @end