⭐️ Impl: ModalSheetViewMainContent

ios/RNIModalSheetView/RNIModalSheetViewDelegate.swift

@@ -11,6 +11,10 @@ import react_native_ios_utilities
 
 @objc(RNIModalSheetViewDelegate)
 public final class RNIModalSheetViewDelegate: UIView, RNIContentView {
+
+  enum NativeIDKey: String {
+    case mainSheetContent;
+  };
 
   public static var propKeyPathMap: Dictionary<String, PartialKeyPath<RNIModalSheetViewDelegate>> {
     return [:];
@@ -23,13 +27,15 @@ public final class RNIModalSheetViewDelegate: UIView, RNIContentView {
   // MARK: Properties
   // ----------------
 
+  public var detachedModalContentParentViews: [RNIContentViewParentDelegate] = [];
+
+  public var modalSheetController: RNIModalSheetViewController?;
+  public var sheetMainContentParentView: RNIContentViewParentDelegate?;
+
   // MARK: - Properties - RNIContentViewDelegate
   // -------------------------------------------
 
   public weak var parentReactView: RNIContentViewParentDelegate?;
-  public var modalSheetController: RNIModalSheetViewController?;
-
-  public var detachedModalContentParentViews: [RNIContentViewParentDelegate] = [];
 
   // MARK: Properties - Props
   // ------------------------
@@ -68,16 +74,27 @@ extension RNIModalSheetViewDelegate: RNIContentViewDelegate {
     superBlock: () -> Void
   ) {
 
+    defer {
+      childComponentView.removeFromSuperview();
+    };
+
     guard let reactView = childComponentView as? RNIContentViewParentDelegate,
-          reactView.contentDelegate is RNIWrapperViewContent
+          reactView.contentDelegate is RNIWrapperViewContent,
+          let nativeID = reactView.reactNativeID,
+          let nativeIDKey = NativeIDKey(rawValue: nativeID)
     else {
       return;
     };
 
-    reactView.removeFromSuperview();
-    reactView.attachReactTouchHandler();
+    defer {
+      reactView.attachReactTouchHandler();
+      self.detachedModalContentParentViews.append(reactView);
+    };
 
-    self.detachedModalContentParentViews.append(reactView);
+    switch nativeIDKey {
+      case .mainSheetContent:
+        self.sheetMainContentParentView = reactView;
+    };
   };
 
   public func notifyOnUnmountChildComponentView(
@@ -122,11 +139,8 @@ extension RNIModalSheetViewDelegate: RNIContentViewDelegate {
           guard let closestVC = closestVC else {
             throw RNIUtilitiesError(errorCode: .unexpectedNilValue);
           };
-
-          let mainSheetContentParent =
-            self.detachedModalContentParentViews.first;
 
-          guard let mainSheetContentParent = mainSheetContentParent else {
+          guard let mainSheetContentParent = self.sheetMainContentParentView else {
             throw RNIUtilitiesError(errorCode: .unexpectedNilValue);
           };
 

src/components/ModalSheetView/ModalSheetViewContent.tsx

@@ -40,7 +40,6 @@ export function ModalSheetViewContent(
           ? styles.wrapperViewDetached
           : styles.wrapperViewAttached
         ),
-        props.style,
       ]}
       onDidSetViewID={(event) => {
         props.onDidSetViewID?.(event);

src/components/ModalSheetView/ModalSheetViewContentTypes.tsx

@@ -1,5 +1,4 @@
 import type { ViewStyle } from 'react-native';
-
 import type { RNIWrapperViewProps } from 'react-native-ios-utilities';
 
 import type { RNIModalSheetViewProps } from "../../native_components/RNIModalSheetVIew";
@@ -8,6 +7,9 @@ import type { ModalSheetContentMap } from "./ModalSheetContentMap";
 
 export type ModalSheetViewContentInheritedProps = Pick<RNIModalSheetViewProps, 
   | 'shouldEnableDebugBackgroundColors'
+> & Pick<RNIWrapperViewProps,
+  | 'onDidSetViewID'
+  | 'nativeID'
 >;
 
 export type ModalSheetViewContentBaseProps = {
@@ -17,6 +19,5 @@ export type ModalSheetViewContentBaseProps = {
 };
 
 export type ModalSheetViewContentProps = 
-    RNIWrapperViewProps
   & ModalSheetViewContentInheritedProps
   & ModalSheetViewContentBaseProps;

src/components/ModalSheetView/ModalSheetViewMainContent.tsx

@@ -0,0 +1,20 @@
+import * as React from 'react';
+
+import { ModalSheetViewContent } from './ModalSheetViewContent';
+import type { ModalSheetViewMainContentProps } from './ModalSheetViewMainContentTypes';
+import { ModalSheetViewNativeIDKeys } from './ModalSheetViewNativeIDKeys';
+
+
+export function ModalSheetViewMainContent(
+  props: React.PropsWithChildren<ModalSheetViewMainContentProps>
+) {
+  const { children, ...otherProps } = props;
+  return (
+    <ModalSheetViewContent
+      {...otherProps}
+      nativeID={ModalSheetViewNativeIDKeys.mainSheetContent}
+    >
+      {children}
+    </ModalSheetViewContent>
+  );
+};

src/components/ModalSheetView/ModalSheetViewMainContentTypes.ts

@@ -0,0 +1,13 @@
+import type { ModalSheetViewContentProps } from './ModalSheetViewContentTypes';
+
+
+export type ModalSheetViewMainContentInheritedProps = Pick<ModalSheetViewContentProps, 
+  | 'contentContainerStyle'
+>;
+
+export type ModalSheetViewMainContentBaseProps = {
+};
+
+export type ModalSheetViewMainContentProps = 
+  & ModalSheetViewMainContentInheritedProps
+  & ModalSheetViewMainContentBaseProps;

src/components/ModalSheetView/ModalSheetViewNativeIDKeys.ts

@@ -1,5 +1,5 @@
 
 
-export const MODAL_SHEET_VIEW_CONTENT_NATIVE_ID_KEYS = Object.freeze({
+export const ModalSheetViewNativeIDKeys = Object.freeze({
   mainSheetContent: 'mainSheetContent',
 });

src/components/ModalSheetView/index.ts

@@ -1,7 +1,7 @@
 
 
 export * from './ModalSheetView';
-export * from './ModalSheetViewContent';
+export * from './ModalSheetViewMainContent';
 
 export type * from './ModalSheetViewTypes';
 export type * from './ModalSheetViewContentTypes';