Add Swift code snippets to Fabric native component iOS documentation

docs/fabric-native-components-ios.md

@@ -70,7 +70,10 @@ Demo
 
 After creating the header file and the implementation file, you can start implementing them.
 
-This is the code for the `RCTWebView.h` file, which declares the component interface.
+This is the code for the header file, which declares the component interface.
+
+<Tabs groupId="ios-language" queryString defaultValue={constants.defaultAppleLanguage} values={constants.appleLanguages}>
+<TabItem value="objc">
 
 ```objc title="Demo/RCTWebView/RCTWebView.h"
 #import <React/RCTViewComponentView.h>
@@ -87,9 +90,28 @@ NS_ASSUME_NONNULL_BEGIN
 NS_ASSUME_NONNULL_END
 ```
 
+</TabItem>
+<TabItem value="swift">
+
+```swift title="Demo/RCTWebView/RCTWebView.swift"
+import React
+import UIKit
+
+@objc(RCTWebView)
+class RCTWebView: RCTViewComponentView {
+    // You would declare native methods you'd want to access from the view here
+}
+```
+
+</TabItem>
+</Tabs>
+
 This class defines an `RCTWebView` which extends the `RCTViewComponentView` class. This is the base class for all the native components and it is provided by React Native.
 
-The code for the implementation file (`RCTWebView.mm`) is the following:
+The code for the implementation file is the following:
+
+<Tabs groupId="ios-language" queryString defaultValue={constants.defaultAppleLanguage} values={constants.appleLanguages}>
+<TabItem value="objc">
 
 ```objc title="Demo/RCTWebView/RCTWebView.mm"
 #import "RCTWebView.h"
@@ -184,6 +206,102 @@ using namespace facebook::react;
 @end
 ```
 
+</TabItem>
+<TabItem value="swift">
+
+```swift title="Demo/RCTWebView/RCTWebView.swift"
+import React
+import WebKit
+
+@objc(RCTWebView)
+class RCTWebView: RCTViewComponentView {
+    private var sourceURL: URL?
+    private var webView: WKWebView!
+
+    override init(frame: CGRect) {
+        super.init(frame: frame)
+        setupWebView()
+    }
+
+    required init?(coder: NSCoder) {
+        super.init(coder: coder)
+        setupWebView()
+    }
+
+    private func setupWebView() {
+        // highlight-start
+        webView = WKWebView()
+        webView.navigationDelegate = self
+        addSubview(webView)
+        // highlight-end
+    }
+
+    override func updateProps(_ props: Props, oldProps: Props) {
+        guard let oldViewProps = _props as? CustomWebViewProps,
+              let newViewProps = props as? CustomWebViewProps else {
+            super.updateProps(props, oldProps: oldProps)
+            return
+        }
+
+        // Handle your props here
+        if oldViewProps.sourceURL != newViewProps.sourceURL {
+            let urlString = String(cString: newViewProps.sourceURL)
+            sourceURL = URL(string: urlString)
+            // highlight-start
+            if urlIsValid(newViewProps.sourceURL) {
+                if let url = sourceURL {
+                    webView.load(URLRequest(url: url))
+                }
+            }
+            // highlight-end
+        }
+
+        super.updateProps(props, oldProps: oldProps)
+    }
+
+    override func layoutSubviews() {
+        super.layoutSubviews()
+        webView.frame = bounds
+    }
+
+    // highlight-start
+    private func urlIsValid(_ propString: String) -> Bool {
+        if !propString.isEmpty && sourceURL == nil {
+            let result = CustomWebViewEventEmitter.OnScriptLoaded(
+                result: .error
+            )
+            eventEmitter.onScriptLoaded(result)
+            return false
+        }
+        return true
+    }
+
+    private var eventEmitter: CustomWebViewEventEmitter {
+        return _eventEmitter as! CustomWebViewEventEmitter
+    }
+    // highlight-end
+
+    @objc static func componentDescriptorProvider() -> ComponentDescriptorProvider {
+        return concreteComponentDescriptorProvider<CustomWebViewComponentDescriptor>()
+    }
+}
+
+// MARK: - WKNavigationDelegate
+extension RCTWebView: WKNavigationDelegate {
+    // highlight-start
+    func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
+        let result = CustomWebViewEventEmitter.OnScriptLoaded(
+            result: .success
+        )
+        eventEmitter.onScriptLoaded(result)
+    }
+    // highlight-end
+}
+```
+
+</TabItem>
+</Tabs>
+
 This code is written in Objective-C++ and contains various details:
 
 - the `@interface` implements two protocols:

docs/profiling.md

@@ -15,6 +15,10 @@ Android supports 10k+ different phones and is generalized to support software re
 
 The first step for debugging this jank is to answer the fundamental question of where your time is being spent during each 16ms frame. For that, we'll be using the [built-in System Tracing profiler in the Android Studio](https://developer.android.com/studio/profile).
 
+:::note
+The standalone `systrace` tool has been removed from Android platform-tools. Use the Android Studio Profiler instead, which provides the same functionality with a better user interface.
+:::
+
 ### 1. Collecting a trace
 
 First, connect a device that exhibits the stuttering you want to investigate to your computer via USB. Open your project's `android` folder in Android Studio, select your device in the top right pane, and [run your project as profileable](https://developer.android.com/studio/profile#build-and-run).

website/versioned_docs/version-0.77/profiling.md

@@ -7,14 +7,18 @@ Profiling is the process of analyzing an app's performance, resource usage, and
 
 For iOS, Instruments is an invaluable tool, and on Android you should learn to use the [Android Studio Profiler](profiling.md#profiling-android-ui-performance-with-system-tracing).
 
-But first, [**make sure that Development Mode is OFF!**](performance.md#running-in-development-mode-devtrue) You should see `__DEV__ === false, development-level warning are OFF, performance optimizations are ON` in your application logs.
+But first, [**make sure that Development Mode is OFF!**](performance.md#running-in-development-mode-devtrue).
 
 ## Profiling Android UI Performance with System Tracing
 
 Android supports 10k+ different phones and is generalized to support software rendering: the framework architecture and need to generalize across many hardware targets unfortunately means you get less for free relative to iOS. But sometimes, there are things you can improve -- and many times it's not native code's fault at all!
 
 The first step for debugging this jank is to answer the fundamental question of where your time is being spent during each 16ms frame. For that, we'll be using the [built-in System Tracing profiler in the Android Studio](https://developer.android.com/studio/profile).
 
+:::note
+The standalone `systrace` tool has been removed from Android platform-tools. Use the Android Studio Profiler instead, which provides the same functionality with a better user interface.
+:::
+
 ### 1. Collecting a trace
 
 First, connect a device that exhibits the stuttering you want to investigate to your computer via USB. Open your project's `android` folder in Android Studio, select your device in the top right pane, and [run your project as profileable](https://developer.android.com/studio/profile#build-and-run).

website/versioned_docs/version-0.78/profiling.md

@@ -7,14 +7,18 @@ Profiling is the process of analyzing an app's performance, resource usage, and
 
 For iOS, Instruments is an invaluable tool, and on Android you should learn to use the [Android Studio Profiler](profiling.md#profiling-android-ui-performance-with-system-tracing).
 
-But first, [**make sure that Development Mode is OFF!**](performance.md#running-in-development-mode-devtrue) You should see `__DEV__ === false, development-level warning are OFF, performance optimizations are ON` in your application logs.
+But first, [**make sure that Development Mode is OFF!**](performance.md#running-in-development-mode-devtrue).
 
 ## Profiling Android UI Performance with System Tracing
 
 Android supports 10k+ different phones and is generalized to support software rendering: the framework architecture and need to generalize across many hardware targets unfortunately means you get less for free relative to iOS. But sometimes, there are things you can improve -- and many times it's not native code's fault at all!
 
 The first step for debugging this jank is to answer the fundamental question of where your time is being spent during each 16ms frame. For that, we'll be using the [built-in System Tracing profiler in the Android Studio](https://developer.android.com/studio/profile).
 
+:::note
+The standalone `systrace` tool has been removed from Android platform-tools. Use the Android Studio Profiler instead, which provides the same functionality with a better user interface.
+:::
+
 ### 1. Collecting a trace
 
 First, connect a device that exhibits the stuttering you want to investigate to your computer via USB. Open your project's `android` folder in Android Studio, select your device in the top right pane, and [run your project as profileable](https://developer.android.com/studio/profile#build-and-run).

website/versioned_docs/version-0.79/profiling.md

@@ -7,14 +7,18 @@ Profiling is the process of analyzing an app's performance, resource usage, and
 
 For iOS, Instruments is an invaluable tool, and on Android you should learn to use the [Android Studio Profiler](profiling.md#profiling-android-ui-performance-with-system-tracing).
 
-But first, [**make sure that Development Mode is OFF!**](performance.md#running-in-development-mode-devtrue) You should see `__DEV__ === false, development-level warning are OFF, performance optimizations are ON` in your application logs.
+But first, [**make sure that Development Mode is OFF!**](performance.md#running-in-development-mode-devtrue).
 
 ## Profiling Android UI Performance with System Tracing
 
 Android supports 10k+ different phones and is generalized to support software rendering: the framework architecture and need to generalize across many hardware targets unfortunately means you get less for free relative to iOS. But sometimes, there are things you can improve -- and many times it's not native code's fault at all!
 
 The first step for debugging this jank is to answer the fundamental question of where your time is being spent during each 16ms frame. For that, we'll be using the [built-in System Tracing profiler in the Android Studio](https://developer.android.com/studio/profile).
 
+:::note
+The standalone `systrace` tool has been removed from Android platform-tools. Use the Android Studio Profiler instead, which provides the same functionality with a better user interface.
+:::
+
 ### 1. Collecting a trace
 
 First, connect a device that exhibits the stuttering you want to investigate to your computer via USB. Open your project's `android` folder in Android Studio, select your device in the top right pane, and [run your project as profileable](https://developer.android.com/studio/profile#build-and-run).

website/versioned_docs/version-0.80/profiling.md

@@ -7,14 +7,18 @@ Profiling is the process of analyzing an app's performance, resource usage, and
 
 For iOS, Instruments is an invaluable tool, and on Android you should learn to use the [Android Studio Profiler](profiling.md#profiling-android-ui-performance-with-system-tracing).
 
-But first, [**make sure that Development Mode is OFF!**](performance.md#running-in-development-mode-devtrue) You should see `__DEV__ === false, development-level warning are OFF, performance optimizations are ON` in your application logs.
+But first, [**make sure that Development Mode is OFF!**](performance.md#running-in-development-mode-devtrue).
 
 ## Profiling Android UI Performance with System Tracing
 
 Android supports 10k+ different phones and is generalized to support software rendering: the framework architecture and need to generalize across many hardware targets unfortunately means you get less for free relative to iOS. But sometimes, there are things you can improve -- and many times it's not native code's fault at all!
 
 The first step for debugging this jank is to answer the fundamental question of where your time is being spent during each 16ms frame. For that, we'll be using the [built-in System Tracing profiler in the Android Studio](https://developer.android.com/studio/profile).
 
+:::note
+The standalone `systrace` tool has been removed from Android platform-tools. Use the Android Studio Profiler instead, which provides the same functionality with a better user interface.
+:::
+
 ### 1. Collecting a trace
 
 First, connect a device that exhibits the stuttering you want to investigate to your computer via USB. Open your project's `android` folder in Android Studio, select your device in the top right pane, and [run your project as profileable](https://developer.android.com/studio/profile#build-and-run).

website/versioned_docs/version-0.81/profiling.md

@@ -15,6 +15,10 @@ Android supports 10k+ different phones and is generalized to support software re
 
 The first step for debugging this jank is to answer the fundamental question of where your time is being spent during each 16ms frame. For that, we'll be using the [built-in System Tracing profiler in the Android Studio](https://developer.android.com/studio/profile).
 
+:::note
+The standalone `systrace` tool has been removed from Android platform-tools. Use the Android Studio Profiler instead, which provides the same functionality with a better user interface.
+:::
+
 ### 1. Collecting a trace
 
 First, connect a device that exhibits the stuttering you want to investigate to your computer via USB. Open your project's `android` folder in Android Studio, select your device in the top right pane, and [run your project as profileable](https://developer.android.com/studio/profile#build-and-run).

website/versioned_docs/version-0.82/profiling.md

@@ -15,6 +15,10 @@ Android supports 10k+ different phones and is generalized to support software re
 
 The first step for debugging this jank is to answer the fundamental question of where your time is being spent during each 16ms frame. For that, we'll be using the [built-in System Tracing profiler in the Android Studio](https://developer.android.com/studio/profile).
 
+:::note
+The standalone `systrace` tool has been removed from Android platform-tools. Use the Android Studio Profiler instead, which provides the same functionality with a better user interface.
+:::
+
 ### 1. Collecting a trace
 
 First, connect a device that exhibits the stuttering you want to investigate to your computer via USB. Open your project's `android` folder in Android Studio, select your device in the top right pane, and [run your project as profileable](https://developer.android.com/studio/profile#build-and-run).

website/versioned_docs/version-0.83/profiling.md

@@ -15,6 +15,10 @@ Android supports 10k+ different phones and is generalized to support software re
 
 The first step for debugging this jank is to answer the fundamental question of where your time is being spent during each 16ms frame. For that, we'll be using the [built-in System Tracing profiler in the Android Studio](https://developer.android.com/studio/profile).
 
+:::note
+The standalone `systrace` tool has been removed from Android platform-tools. Use the Android Studio Profiler instead, which provides the same functionality with a better user interface.
+:::
+
 ### 1. Collecting a trace
 
 First, connect a device that exhibits the stuttering you want to investigate to your computer via USB. Open your project's `android` folder in Android Studio, select your device in the top right pane, and [run your project as profileable](https://developer.android.com/studio/profile#build-and-run).