CKRatioLayoutComponent live editing

Summary:
CKRatioLayoutComponent's ratio is now live editable

P.S. Now it takes some time to see the view changed and the new value of everything on flipper side

Reviewed By: kevin0571

Differential Revision: D16458380

fbshipit-source-id: 0f06426477b6747f6ad71716dc66e69316b23208

iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutComponentKitSupport/CKComponent+Sonar.mm

@@ -21,6 +21,7 @@
 #import <objc/runtime.h>
 #import <objc/message.h>
 
+#import "CKRatioLayoutComponent+Sonar.h"
 #import "CKFlexboxComponent+Sonar.h"
 #import "CKInsetComponent+Sonar.h"
 #import "CKStatelessComponent+Sonar.h"

iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutComponentKitSupport/CKRatioLayoutComponent+Sonar.h

@@ -0,0 +1,14 @@
+/*
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the LICENSE
+ * file in the root directory of this source tree.
+ */
+#import <ComponentKit/CKRatioLayoutComponent.h>
+#import <FlipperKit/SKMacros.h>
+
+FB_LINK_REQUIRE_CATEGORY(CKRatioLayoutComponent_Sonar)
+@interface CKRatioLayoutComponent (Sonar)
+
+@end
+

iOS/Plugins/FlipperKitLayoutPlugin/FlipperKitLayoutComponentKitSupport/CKRatioLayoutComponent+Sonar.mm

@@ -0,0 +1,40 @@
+/*
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the LICENSE
+ * file in the root directory of this source tree.
+ */
+#if FB_SONARKIT_ENABLED
+
+#import "CKRatioLayoutComponent+Sonar.h"
+
+#import <FlipperKitLayoutPlugin/SKNamed.h>
+#import <FlipperKitLayoutPlugin/SKObject.h>
+
+#import "CKComponent+Sonar.h"
+
+FB_LINKABLE(CKRatioLayoutComponent_Sonar)
+@implementation CKRatioLayoutComponent (Sonar)
+
+- (NSArray<SKNamed<NSDictionary<NSString *, NSObject *> *> *> *)sonar_additionalDataOverride
+{
+  return @[[SKNamed newWithName:@"CKRatioLayoutComponent" withValue:@{@"ratio": SKMutableObject((NSNumber *)[self valueForKey:@"_ratio"])}]];
+}
+
+- (void)setMutableData:(id)data {
+  [self setValue:data forKey:@"_ratio"];
+}
+
+- (NSDictionary<NSString *, SKNodeDataChanged> *)sonar_getDataMutationsChanged {
+  return @{
+           @"CKRatioLayoutComponent.ratio": ^(NSNumber *value) {
+             CGFloat ratio = [(NSNumber *)[self valueForKey:@"_ratio"] floatValue];
+             ratio = value.floatValue;
+             return [NSNumber numberWithFloat:ratio];
+           },
+           };
+}
+
+@end
+
+#endif