Use std::optional instead of butter::optional (#1498)

Summary: changelog: Use std::optional instead of butter::optional

Reviewed By: fkgozali

Differential Revision: D33352680

fbshipit-source-id: 45a53fec181a6ffb6218909bc23348f7c9f21ec4

# Conflicts:
#	ReactAndroid/src/main/java/com/facebook/react/fabric/jni/viewPropConversions.h
#	ReactCommon/react/renderer/components/view/ViewProps.h
#	ReactCommon/react/renderer/components/view/primitives.h
#	ReactCommon/react/renderer/components/view/propsConversions.h
#	ReactCommon/react/renderer/scheduler/Scheduler.cpp

Co-authored-by: Samuel Susla <samuelsusla@fb.com>

React/Fabric/Mounting/ComponentViews/TextInput/RCTTextInputComponentView.mm

@@ -566,8 +566,8 @@ using namespace facebook::react;
 
 - (void)_restoreTextSelection
 {
-  const auto selection = std::dynamic_pointer_cast<TextInputProps const>(_props)->selection.get_pointer();
+  auto const selection = std::dynamic_pointer_cast<TextInputProps const>(_props)->selection;
-  if (selection == nullptr) {
+  if (!selection.has_value()) {
     return;
   }
   auto start = [_backedTextInputView positionFromPosition:_backedTextInputView.beginningOfDocument

React/Fabric/Mounting/ComponentViews/TextInput/RCTTextInputUtils.h

@@ -7,8 +7,9 @@
 
 #import <UIKit/UIKit.h>
 
+#import <optional>
+
 #import <React/RCTBackedTextInputViewProtocol.h>
-#import <butter/optional.h>
 #import <react/renderer/components/iostextinput/primitives.h>
 
 NS_ASSUME_NONNULL_BEGIN
@@ -17,7 +18,7 @@ void RCTCopyBackedTextInput(
     UIView<RCTBackedTextInputViewProtocol> *fromTextInput,
     UIView<RCTBackedTextInputViewProtocol> *toTextInput);
 
-UITextAutocorrectionType RCTUITextAutocorrectionTypeFromOptionalBool(facebook::butter::optional<bool> autoCorrect);
+UITextAutocorrectionType RCTUITextAutocorrectionTypeFromOptionalBool(std::optional<bool> autoCorrect);
 
 UITextAutocapitalizationType RCTUITextAutocapitalizationTypeFromAutocapitalizationType(
     facebook::react::AutocapitalizationType autocapitalizationType);
@@ -25,7 +26,7 @@ UITextAutocapitalizationType RCTUITextAutocapitalizationTypeFromAutocapitalizati
 UIKeyboardAppearance RCTUIKeyboardAppearanceFromKeyboardAppearance(
     facebook::react::KeyboardAppearance keyboardAppearance);
 
-UITextSpellCheckingType RCTUITextSpellCheckingTypeFromOptionalBool(facebook::butter::optional<bool> spellCheck);
+UITextSpellCheckingType RCTUITextSpellCheckingTypeFromOptionalBool(std::optional<bool> spellCheck);
 
 UITextFieldViewMode RCTUITextFieldViewModeFromTextInputAccessoryVisibilityMode(
     facebook::react::TextInputAccessoryVisibilityMode mode);

React/Fabric/Mounting/ComponentViews/TextInput/RCTTextInputUtils.mm

@@ -51,7 +51,7 @@ void RCTCopyBackedTextInput(
   [toTextInput setSelectedTextRange:fromTextInput.selectedTextRange notifyDelegate:NO];
 }
 
-UITextAutocorrectionType RCTUITextAutocorrectionTypeFromOptionalBool(facebook::butter::optional<bool> autoCorrect)
+UITextAutocorrectionType RCTUITextAutocorrectionTypeFromOptionalBool(std::optional<bool> autoCorrect)
 {
   return autoCorrect.has_value() ? (*autoCorrect ? UITextAutocorrectionTypeYes : UITextAutocorrectionTypeNo)
                                  : UITextAutocorrectionTypeDefault;
@@ -84,7 +84,7 @@ UIKeyboardAppearance RCTUIKeyboardAppearanceFromKeyboardAppearance(KeyboardAppea
   }
 }
 
-UITextSpellCheckingType RCTUITextSpellCheckingTypeFromOptionalBool(facebook::butter::optional<bool> spellCheck)
+UITextSpellCheckingType RCTUITextSpellCheckingTypeFromOptionalBool(std::optional<bool> spellCheck)
 {
   return spellCheck.has_value() ? (*spellCheck ? UITextSpellCheckingTypeYes : UITextSpellCheckingTypeNo)
                                 : UITextSpellCheckingTypeDefault;

React/Fabric/Mounting/ComponentViews/View/RCTViewComponentView.mm

@@ -336,12 +336,12 @@ using namespace facebook::react;
 
   // `accessibilityValue`
   if (oldViewProps.accessibilityValue != newViewProps.accessibilityValue) {
-    if (newViewProps.accessibilityValue.text.hasValue()) {
+    if (newViewProps.accessibilityValue.text.has_value()) {
       self.accessibilityElement.accessibilityValue =
           RCTNSStringFromStringNilIfEmpty(newViewProps.accessibilityValue.text.value());
     } else if (
-        newViewProps.accessibilityValue.now.hasValue() && newViewProps.accessibilityValue.min.hasValue() &&
+        newViewProps.accessibilityValue.now.has_value() && newViewProps.accessibilityValue.min.has_value() &&
-        newViewProps.accessibilityValue.max.hasValue()) {
+        newViewProps.accessibilityValue.max.has_value()) {
       CGFloat val = (CGFloat)(newViewProps.accessibilityValue.now.value()) /
           (newViewProps.accessibilityValue.max.value() - newViewProps.accessibilityValue.min.value());
       self.accessibilityElement.accessibilityValue =

React/Fabric/RCTSurfacePresenter.mm

@@ -271,7 +271,7 @@ static BackgroundExecutor RCTGetBackgroundExecutor()
   toolbox.componentRegistryFactory = componentRegistryFactory;
 
   auto weakRuntimeScheduler = _contextContainer->find<std::weak_ptr<RuntimeScheduler>>("RuntimeScheduler");
-  auto runtimeScheduler = weakRuntimeScheduler.hasValue() ? weakRuntimeScheduler.value().lock() : nullptr;
+  auto runtimeScheduler = weakRuntimeScheduler.has_value() ? weakRuntimeScheduler.value().lock() : nullptr;
   if (runtimeScheduler) {
     runtimeExecutor = [runtimeScheduler](std::function<void(jsi::Runtime & runtime)> &&callback) {
       runtimeScheduler->scheduleWork(std::move(callback));

React/Fabric/Surface/RCTFabricSurface.mm

@@ -34,7 +34,7 @@ using namespace facebook::react;
   // `SurfaceHandler` is a thread-safe object, so we don't need additional synchronization.
   // Objective-C++ classes cannot have instance variables without default constructors,
   // hence we wrap a value into `optional` to workaround it.
-  butter::optional<SurfaceHandler> _surfaceHandler;
+  std::optional<SurfaceHandler> _surfaceHandler;
 
   // Protects Surface's start and stop processes.
   // Even though SurfaceHandler is tread-safe, it will crash if we try to stop a surface that is not running.

ReactAndroid/src/main/java/com/facebook/react/fabric/jni/viewPropConversions.h

@@ -0,0 +1,527 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#pragma once
+
+#include <react/renderer/components/view/ViewProps.h>
+#include <react/renderer/components/view/conversions.h>
+#include <react/renderer/graphics/conversions.h>
+#include <react/renderer/mapbuffer/MapBuffer.h>
+#include <react/renderer/mapbuffer/MapBufferBuilder.h>
+
+#include <optional>
+
+namespace facebook {
+namespace react {
+
+namespace {
+// ViewProps values
+constexpr MapBuffer::Key VP_ACCESSIBILITY_ACTIONS = 0;
+constexpr MapBuffer::Key VP_ACCESSIBILITY_HINT = 1;
+constexpr MapBuffer::Key VP_ACCESSIBILITY_LABEL = 2;
+constexpr MapBuffer::Key VP_ACCESSIBILITY_LABELLED_BY = 3;
+constexpr MapBuffer::Key VP_ACCESSIBILITY_LIVE_REGION = 4;
+constexpr MapBuffer::Key VP_ACCESSIBILITY_ROLE = 5;
+constexpr MapBuffer::Key VP_ACCESSIBILITY_STATE = 6;
+constexpr MapBuffer::Key VP_ACCESSIBILITY_VALUE = 7;
+constexpr MapBuffer::Key VP_ACCESSIBLE = 8;
+constexpr MapBuffer::Key VP_BACKFACE_VISIBILITY = 9;
+constexpr MapBuffer::Key VP_BG_COLOR = 10;
+constexpr MapBuffer::Key VP_BORDER_COLOR = 11;
+constexpr MapBuffer::Key VP_BORDER_RADII = 12;
+constexpr MapBuffer::Key VP_BORDER_STYLE = 13;
+constexpr MapBuffer::Key VP_COLLAPSABLE = 14;
+constexpr MapBuffer::Key VP_ELEVATION = 15;
+constexpr MapBuffer::Key VP_FOCUSABLE = 16;
+constexpr MapBuffer::Key VP_HAS_TV_FOCUS = 17;
+constexpr MapBuffer::Key VP_HIT_SLOP = 18;
+constexpr MapBuffer::Key VP_IMPORTANT_FOR_ACCESSIBILITY = 19;
+constexpr MapBuffer::Key VP_NATIVE_BACKGROUND = 20;
+constexpr MapBuffer::Key VP_NATIVE_FOREGROUND = 21;
+constexpr MapBuffer::Key VP_NATIVE_ID = 22;
+constexpr MapBuffer::Key VP_OFFSCREEN_ALPHA_COMPOSITING = 23;
+constexpr MapBuffer::Key VP_OPACITY = 24;
+constexpr MapBuffer::Key VP_POINTER_EVENTS = 25;
+constexpr MapBuffer::Key VP_POINTER_ENTER = 26;
+constexpr MapBuffer::Key VP_POINTER_LEAVE = 27;
+constexpr MapBuffer::Key VP_POINTER_MOVE = 28;
+constexpr MapBuffer::Key VP_REMOVE_CLIPPED_SUBVIEW = 29;
+constexpr MapBuffer::Key VP_RENDER_TO_HARDWARE_TEXTURE = 30;
+constexpr MapBuffer::Key VP_SHADOW_COLOR = 31;
+constexpr MapBuffer::Key VP_TEST_ID = 32;
+constexpr MapBuffer::Key VP_TRANSFORM = 33;
+constexpr MapBuffer::Key VP_ZINDEX = 34;
+
+// Yoga values
+constexpr MapBuffer::Key YG_BORDER_WIDTH = 100;
+constexpr MapBuffer::Key YG_OVERFLOW = 101;
+
+// AccessibilityAction values
+constexpr MapBuffer::Key ACCESSIBILITY_ACTION_NAME = 0;
+constexpr MapBuffer::Key ACCESSIBILITY_ACTION_LABEL = 1;
+
+static MapBuffer convertAccessibilityActions(
+    std::vector<AccessibilityAction> const &actions) {
+  MapBufferBuilder builder(actions.size());
+  for (auto i = 0; i < actions.size(); i++) {
+    auto const &action = actions[i];
+    MapBufferBuilder actionsBuilder(2);
+    actionsBuilder.putString(ACCESSIBILITY_ACTION_NAME, action.name);
+    if (action.label.has_value()) {
+      actionsBuilder.putString(
+          ACCESSIBILITY_ACTION_LABEL, action.label.value());
+    }
+    builder.putMapBuffer(i, actionsBuilder.build());
+  }
+  return builder.build();
+}
+
+static MapBuffer convertAccessibilityLabelledBy(
+    AccessibilityLabelledBy const &labelledBy) {
+  MapBufferBuilder builder(labelledBy.value.size());
+  for (auto i = 0; i < labelledBy.value.size(); i++) {
+    builder.putString(i, labelledBy.value[i]);
+  }
+  return builder.build();
+}
+
+// AccessibilityState values
+constexpr MapBuffer::Key ACCESSIBILITY_STATE_BUSY = 0;
+constexpr MapBuffer::Key ACCESSIBILITY_STATE_DISABLED = 1;
+constexpr MapBuffer::Key ACCESSIBILITY_STATE_EXPANDED = 2;
+constexpr MapBuffer::Key ACCESSIBILITY_STATE_SELECTED = 3;
+constexpr MapBuffer::Key ACCESSIBILITY_STATE_CHECKED = 4;
+
+MapBuffer convertAccessibilityState(AccessibilityState const &state) {
+  MapBufferBuilder builder(5);
+  builder.putBool(ACCESSIBILITY_STATE_BUSY, state.busy);
+  builder.putBool(ACCESSIBILITY_STATE_DISABLED, state.disabled);
+  builder.putBool(ACCESSIBILITY_STATE_EXPANDED, state.expanded);
+  builder.putBool(ACCESSIBILITY_STATE_SELECTED, state.selected);
+  int checked;
+  switch (state.checked) {
+    case AccessibilityState::Unchecked:
+      checked = 0;
+      break;
+    case AccessibilityState::Checked:
+      checked = 1;
+      break;
+    case AccessibilityState::Mixed:
+      checked = 2;
+      break;
+    case AccessibilityState::None:
+      checked = 3;
+      break;
+  }
+  builder.putInt(ACCESSIBILITY_STATE_CHECKED, checked);
+  return builder.build();
+}
+
+inline void putOptionalColor(
+    MapBufferBuilder &builder,
+    MapBuffer::Key key,
+    std::optional<SharedColor> const &color) {
+  builder.putInt(key, color.has_value() ? toAndroidRepr(color.value()) : -1);
+}
+
+constexpr MapBuffer::Key EDGE_TOP = 0;
+constexpr MapBuffer::Key EDGE_LEFT = 1;
+constexpr MapBuffer::Key EDGE_RIGHT = 2;
+constexpr MapBuffer::Key EDGE_BOTTOM = 3;
+constexpr MapBuffer::Key EDGE_START = 4;
+constexpr MapBuffer::Key EDGE_END = 5;
+constexpr MapBuffer::Key EDGE_ALL = 6;
+
+MapBuffer convertBorderColors(CascadedBorderColors const &colors) {
+  MapBufferBuilder builder(7);
+  putOptionalColor(builder, EDGE_TOP, colors.top);
+  putOptionalColor(builder, EDGE_RIGHT, colors.right);
+  putOptionalColor(builder, EDGE_BOTTOM, colors.bottom);
+  putOptionalColor(builder, EDGE_LEFT, colors.left);
+  putOptionalColor(builder, EDGE_START, colors.start);
+  putOptionalColor(builder, EDGE_END, colors.end);
+  putOptionalColor(builder, EDGE_ALL, colors.all);
+  return builder.build();
+}
+
+constexpr MapBuffer::Key CORNER_TOP_LEFT = 0;
+constexpr MapBuffer::Key CORNER_TOP_RIGHT = 1;
+constexpr MapBuffer::Key CORNER_BOTTOM_RIGHT = 2;
+constexpr MapBuffer::Key CORNER_BOTTOM_LEFT = 3;
+constexpr MapBuffer::Key CORNER_TOP_START = 4;
+constexpr MapBuffer::Key CORNER_TOP_END = 5;
+constexpr MapBuffer::Key CORNER_BOTTOM_END = 6;
+constexpr MapBuffer::Key CORNER_BOTTOM_START = 7;
+constexpr MapBuffer::Key CORNER_ALL = 8;
+
+inline void putOptionalFloat(
+    MapBufferBuilder &builder,
+    MapBuffer::Key key,
+    std::optional<Float> const &value) {
+  builder.putDouble(key, value.value_or(NAN));
+}
+
+MapBuffer convertBorderRadii(CascadedBorderRadii const &radii) {
+  MapBufferBuilder builder(9);
+  putOptionalFloat(builder, CORNER_TOP_LEFT, radii.topLeft);
+  putOptionalFloat(builder, CORNER_TOP_RIGHT, radii.topRight);
+  putOptionalFloat(builder, CORNER_BOTTOM_RIGHT, radii.bottomRight);
+  putOptionalFloat(builder, CORNER_BOTTOM_LEFT, radii.bottomLeft);
+  putOptionalFloat(builder, CORNER_TOP_START, radii.topStart);
+  putOptionalFloat(builder, CORNER_TOP_END, radii.topEnd);
+  putOptionalFloat(builder, CORNER_BOTTOM_END, radii.bottomEnd);
+  putOptionalFloat(builder, CORNER_BOTTOM_START, radii.bottomStart);
+  putOptionalFloat(builder, CORNER_ALL, radii.all);
+  return builder.build();
+}
+
+MapBuffer convertBorderWidths(YGStyle::Edges const &border) {
+  MapBufferBuilder builder(7);
+  putOptionalFloat(
+      builder, EDGE_TOP, optionalFloatFromYogaValue(border[YGEdgeTop]));
+  putOptionalFloat(
+      builder, EDGE_RIGHT, optionalFloatFromYogaValue(border[YGEdgeRight]));
+  putOptionalFloat(
+      builder, EDGE_BOTTOM, optionalFloatFromYogaValue(border[YGEdgeBottom]));
+  putOptionalFloat(
+      builder, EDGE_LEFT, optionalFloatFromYogaValue(border[YGEdgeLeft]));
+  putOptionalFloat(
+      builder, EDGE_START, optionalFloatFromYogaValue(border[YGEdgeStart]));
+  putOptionalFloat(
+      builder, EDGE_END, optionalFloatFromYogaValue(border[YGEdgeEnd]));
+  putOptionalFloat(
+      builder, EDGE_ALL, optionalFloatFromYogaValue(border[YGEdgeAll]));
+  return builder.build();
+}
+
+MapBuffer convertEdgeInsets(EdgeInsets const &insets) {
+  MapBufferBuilder builder(4);
+  builder.putDouble(EDGE_TOP, insets.top);
+  builder.putDouble(EDGE_RIGHT, insets.right);
+  builder.putDouble(EDGE_BOTTOM, insets.bottom);
+  builder.putDouble(EDGE_LEFT, insets.left);
+  return builder.build();
+}
+
+#ifdef ANDROID
+
+constexpr MapBuffer::Key NATIVE_DRAWABLE_KIND = 0;
+constexpr MapBuffer::Key NATIVE_DRAWABLE_ATTRIBUTE = 1;
+constexpr MapBuffer::Key NATIVE_DRAWABLE_COLOR = 2;
+constexpr MapBuffer::Key NATIVE_DRAWABLE_BORDERLESS = 3;
+constexpr MapBuffer::Key NATIVE_DRAWABLE_RIPPLE_RADIUS = 4;
+
+MapBuffer convertNativeBackground(std::optional<NativeDrawable> const &value) {
+  if (!value.has_value()) {
+    return MapBufferBuilder::EMPTY();
+  }
+
+  auto const &drawable = value.value();
+  MapBufferBuilder builder(4);
+  switch (drawable.kind) {
+    case NativeDrawable::Kind::ThemeAttr:
+      builder.putInt(NATIVE_DRAWABLE_KIND, 0);
+      builder.putString(NATIVE_DRAWABLE_ATTRIBUTE, drawable.themeAttr);
+      break;
+    case NativeDrawable::Kind::Ripple:
+      builder.putInt(NATIVE_DRAWABLE_KIND, 1);
+      if (drawable.ripple.color.has_value()) {
+        builder.putInt(NATIVE_DRAWABLE_COLOR, drawable.ripple.color.value());
+      }
+
+      builder.putBool(NATIVE_DRAWABLE_BORDERLESS, drawable.ripple.borderless);
+      if (drawable.ripple.rippleRadius.has_value()) {
+        builder.putDouble(
+            NATIVE_DRAWABLE_RIPPLE_RADIUS,
+            drawable.ripple.rippleRadius.value());
+      }
+      break;
+  }
+  return builder.build();
+}
+
+#endif
+
+MapBuffer convertTransform(Transform const &transform) {
+  MapBufferBuilder builder(16);
+  for (int32_t i = 0; i < transform.matrix.size(); i++) {
+    builder.putDouble(i, transform.matrix[i]);
+  }
+  return builder.build();
+}
+} // namespace
+
+/**
+ * Diffs two sets of ViewProps into MapBuffer.
+ * TODO: Currently unsupported: nextFocusForward/Left/Up/Right/Down
+ */
+static inline MapBuffer viewPropsDiff(
+    ViewProps const &oldProps,
+    ViewProps const &newProps) {
+  MapBufferBuilder builder;
+  if (oldProps.accessibilityActions != newProps.accessibilityActions) {
+    builder.putMapBuffer(
+        VP_ACCESSIBILITY_ACTIONS,
+        convertAccessibilityActions(newProps.accessibilityActions));
+  }
+
+  if (oldProps.accessibilityHint != newProps.accessibilityHint) {
+    builder.putString(VP_ACCESSIBILITY_HINT, newProps.accessibilityHint);
+  }
+
+  if (oldProps.accessibilityLabel != newProps.accessibilityLabel) {
+    builder.putString(VP_ACCESSIBILITY_LABEL, newProps.accessibilityLabel);
+  }
+
+  if (oldProps.accessibilityLabelledBy != newProps.accessibilityLabelledBy) {
+    builder.putMapBuffer(
+        VP_ACCESSIBILITY_LABELLED_BY,
+        convertAccessibilityLabelledBy(newProps.accessibilityLabelledBy));
+  }
+
+  if (oldProps.accessibilityLiveRegion != newProps.accessibilityLiveRegion) {
+    int value;
+    switch (newProps.accessibilityLiveRegion) {
+      case AccessibilityLiveRegion::None:
+        value = 0;
+        break;
+      case AccessibilityLiveRegion::Polite:
+        value = 1;
+        break;
+      case AccessibilityLiveRegion::Assertive:
+        value = 2;
+        break;
+    }
+    builder.putInt(VP_ACCESSIBILITY_LIVE_REGION, value);
+  }
+
+  if (oldProps.accessibilityRole != newProps.accessibilityRole) {
+    builder.putString(VP_ACCESSIBILITY_ROLE, newProps.accessibilityRole);
+  }
+
+  if (oldProps.accessibilityState != newProps.accessibilityState) {
+    builder.putMapBuffer(
+        VP_ACCESSIBILITY_STATE,
+        convertAccessibilityState(newProps.accessibilityState));
+  }
+
+  if (oldProps.accessibilityValue != newProps.accessibilityValue) {
+    builder.putString(
+        VP_ACCESSIBILITY_VALUE, newProps.accessibilityValue.text.value_or(""));
+  }
+
+  if (oldProps.accessible != newProps.accessible) {
+    builder.putBool(VP_ACCESSIBLE, newProps.accessible);
+  }
+
+  if (oldProps.backfaceVisibility != newProps.backfaceVisibility) {
+    int value;
+    switch (newProps.backfaceVisibility) {
+      case BackfaceVisibility::Auto:
+        value = 0;
+        break;
+      case BackfaceVisibility::Visible:
+        value = 1;
+        break;
+      case BackfaceVisibility::Hidden:
+        value = 2;
+        break;
+    }
+    builder.putInt(VP_BACKFACE_VISIBILITY, value);
+  }
+
+  if (oldProps.backgroundColor != newProps.backgroundColor) {
+    builder.putInt(VP_BG_COLOR, toAndroidRepr(newProps.backgroundColor));
+  }
+
+  if (oldProps.borderColors != newProps.borderColors) {
+    builder.putMapBuffer(
+        VP_BORDER_COLOR, convertBorderColors(newProps.borderColors));
+  }
+
+  if (oldProps.borderRadii != newProps.borderRadii) {
+    builder.putMapBuffer(
+        VP_BORDER_RADII, convertBorderRadii(newProps.borderRadii));
+  }
+
+  if (oldProps.borderStyles != newProps.borderStyles) {
+    int value = -1;
+    if (newProps.borderStyles.all.has_value()) {
+      switch (newProps.borderStyles.all.value()) {
+        case BorderStyle::Solid:
+          value = 0;
+          break;
+        case BorderStyle::Dotted:
+          value = 1;
+          break;
+        case BorderStyle::Dashed:
+          value = 2;
+          break;
+      }
+    }
+    builder.putInt(VP_BORDER_STYLE, value);
+  }
+
+  if (oldProps.elevation != newProps.elevation) {
+    builder.putDouble(VP_ELEVATION, newProps.elevation);
+  }
+
+#ifdef ANDROID
+  if (oldProps.focusable != newProps.focusable) {
+    builder.putBool(VP_FOCUSABLE, newProps.focusable);
+  }
+
+  if (oldProps.hasTVPreferredFocus != newProps.hasTVPreferredFocus) {
+    builder.putBool(VP_HAS_TV_FOCUS, newProps.hasTVPreferredFocus);
+  }
+#endif
+
+  if (oldProps.hitSlop != newProps.hitSlop) {
+    builder.putMapBuffer(VP_HIT_SLOP, convertEdgeInsets(newProps.hitSlop));
+  }
+
+  if (oldProps.importantForAccessibility !=
+      newProps.importantForAccessibility) {
+    int value;
+    switch (newProps.importantForAccessibility) {
+      case ImportantForAccessibility::Auto:
+        value = 0;
+        break;
+      case ImportantForAccessibility::Yes:
+        value = 1;
+        break;
+      case ImportantForAccessibility::No:
+        value = 2;
+        break;
+      case ImportantForAccessibility::NoHideDescendants:
+        value = 3;
+        break;
+    }
+    builder.putInt(VP_IMPORTANT_FOR_ACCESSIBILITY, value);
+  }
+
+#ifdef ANDROID
+  if (oldProps.nativeBackground != newProps.nativeBackground) {
+    builder.putMapBuffer(
+        VP_NATIVE_BACKGROUND,
+        convertNativeBackground(newProps.nativeBackground));
+  }
+
+  if (oldProps.nativeForeground != newProps.nativeForeground) {
+    builder.putMapBuffer(
+        VP_NATIVE_FOREGROUND,
+        convertNativeBackground(newProps.nativeForeground));
+  }
+#endif
+
+  if (oldProps.nativeId != newProps.nativeId) {
+    builder.putString(VP_NATIVE_ID, newProps.nativeId);
+  }
+
+#ifdef ANDROID
+  if (oldProps.needsOffscreenAlphaCompositing !=
+      newProps.needsOffscreenAlphaCompositing) {
+    builder.putBool(
+        VP_OFFSCREEN_ALPHA_COMPOSITING,
+        newProps.needsOffscreenAlphaCompositing);
+  }
+#endif
+
+  if (oldProps.opacity != newProps.opacity) {
+    builder.putDouble(VP_OPACITY, newProps.opacity);
+  }
+
+  if (oldProps.pointerEvents != newProps.pointerEvents) {
+    int value;
+    switch (newProps.pointerEvents) {
+      case PointerEventsMode::Auto:
+        value = 0;
+        break;
+      case PointerEventsMode::None:
+        value = 1;
+        break;
+      case PointerEventsMode::BoxNone:
+        value = 2;
+        break;
+      case PointerEventsMode::BoxOnly:
+        value = 3;
+        break;
+    }
+
+    builder.putInt(VP_POINTER_EVENTS, value);
+  }
+
+  if (oldProps.events != newProps.events) {
+    builder.putBool(
+        VP_POINTER_ENTER, newProps.events[ViewEvents::Offset::PointerEnter]);
+    builder.putBool(
+        VP_POINTER_LEAVE, newProps.events[ViewEvents::Offset::PointerLeave]);
+    builder.putBool(
+        VP_POINTER_MOVE, newProps.events[ViewEvents::Offset::PointerMove]);
+  }
+
+  if (oldProps.removeClippedSubviews != newProps.removeClippedSubviews) {
+    builder.putBool(VP_REMOVE_CLIPPED_SUBVIEW, newProps.removeClippedSubviews);
+  }
+
+#ifdef ANDROID
+  if (oldProps.renderToHardwareTextureAndroid !=
+      newProps.renderToHardwareTextureAndroid) {
+    builder.putBool(
+        VP_RENDER_TO_HARDWARE_TEXTURE, newProps.renderToHardwareTextureAndroid);
+  }
+#endif
+
+  if (oldProps.shadowColor != newProps.shadowColor) {
+    builder.putInt(VP_SHADOW_COLOR, toAndroidRepr(newProps.shadowColor));
+  }
+
+  if (oldProps.testId != newProps.testId) {
+    builder.putString(VP_TEST_ID, newProps.testId);
+  }
+
+  // TODO: seems like transform covers rotation/translate/scale/skew?
+
+  if (oldProps.transform != newProps.transform) {
+    builder.putMapBuffer(VP_TRANSFORM, convertTransform(newProps.transform));
+  }
+
+  if (oldProps.zIndex != newProps.zIndex) {
+    builder.putInt(VP_ZINDEX, newProps.zIndex.value_or(0));
+  }
+
+  if (oldProps.yogaStyle != newProps.yogaStyle) {
+    auto const &oldStyle = oldProps.yogaStyle;
+    auto const &newStyle = newProps.yogaStyle;
+
+    if (!(oldStyle.border() == newStyle.border())) {
+      builder.putMapBuffer(
+          YG_BORDER_WIDTH, convertBorderWidths(newStyle.border()));
+    }
+
+    if (oldStyle.overflow() != newStyle.overflow()) {
+      int value;
+      switch (newStyle.overflow()) {
+        case YGOverflowVisible:
+          value = 0;
+          break;
+        case YGOverflowHidden:
+          value = 1;
+          break;
+        case YGOverflowScroll:
+          value = 2;
+          break;
+      }
+      builder.putInt(YG_OVERFLOW, value);
+    }
+  }
+
+  return builder.build();
+}
+
+} // namespace react
+} // namespace facebook

ReactCommon/butter/optional.h

@@ -1,38 +0,0 @@
-/*
- * Copyright (c) Meta Platforms, Inc. and affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-#pragma once
-
-#include <butter/butter.h>
-
-#if defined(BUTTER_USE_FOLLY_CONTAINERS) || __cplusplus < 202000L
-
-#include <folly/Optional.h>
-
-#else
-
-#include <optional>
-
-#endif
-
-namespace facebook {
-namespace butter {
-
-#if defined(BUTTER_USE_FOLLY_CONTAINERS) || __cplusplus < 202000L
-
-template <typename Value>
-using optional = folly::Optional<Value>;
-
-#else
-
-template <typename Value>
-using optional = std::optional<Value>;
-
-#endif
-
-} // namespace butter
-} // namespace facebook

ReactCommon/react/renderer/animations/LayoutAnimationKeyFrameManager.cpp

@@ -173,7 +173,7 @@ bool LayoutAnimationKeyFrameManager::shouldOverridePullTransaction() const {
   return shouldAnimateFrame();
 }
 
-butter::optional<MountingTransaction>
+std::optional<MountingTransaction>
 LayoutAnimationKeyFrameManager::pullTransaction(
     SurfaceId surfaceId,
     MountingTransaction::Number transactionNumber,
@@ -251,7 +251,7 @@ LayoutAnimationKeyFrameManager::pullTransaction(
         surfaceId, mutations, conflictingAnimations);
 
     // Are we animating this list of mutations?
-    butter::optional<LayoutAnimation> currentAnimation{};
+    std::optional<LayoutAnimation> currentAnimation{};
     {
       std::lock_guard<std::mutex> lock(currentAnimationMutex_);
       if (currentAnimation_) {
@@ -260,7 +260,7 @@ LayoutAnimationKeyFrameManager::pullTransaction(
       }
     }
 
-    if (currentAnimation.hasValue()) {
+    if (currentAnimation.has_value()) {
       LayoutAnimation animation = std::move(currentAnimation).value();
       animation.surfaceId = surfaceId;
       animation.startTime = now;
@@ -321,7 +321,7 @@ LayoutAnimationKeyFrameManager::pullTransaction(
           continue;
         }
 
-        butter::optional<ShadowViewMutation> executeMutationImmediately{};
+        std::optional<ShadowViewMutation> executeMutationImmediately{};
 
         bool isRemoveReinserted =
             mutation.type == ShadowViewMutation::Type::Remove &&
@@ -703,7 +703,7 @@ LayoutAnimationKeyFrameManager::pullTransaction(
           keyFramesToAnimate.push_back(keyFrame);
         }
 
-        if (executeMutationImmediately.hasValue()) {
+        if (executeMutationImmediately.has_value()) {
           PrintMutationInstruction(
               "Queue Up For Immediate Execution", *executeMutationImmediately);
           immediateMutations.push_back(*executeMutationImmediately);
@@ -1064,7 +1064,7 @@ LayoutAnimationKeyFrameManager::pullTransaction(
 
 void LayoutAnimationKeyFrameManager::uiManagerDidConfigureNextLayoutAnimation(
     LayoutAnimation layoutAnimation) const {
-  currentAnimation_ = butter::optional<LayoutAnimation>{layoutAnimation};
+  currentAnimation_ = std::optional<LayoutAnimation>{layoutAnimation};
 }
 
 void LayoutAnimationKeyFrameManager::setLayoutAnimationStatusDelegate(

ReactCommon/react/renderer/animations/LayoutAnimationKeyFrameManager.h

@@ -8,7 +8,6 @@
 #pragma once
 
 #include <ReactCommon/RuntimeExecutor.h>
-#include <butter/optional.h>
 #include <butter/set.h>
 #include <react/renderer/animations/LayoutAnimationCallbackWrapper.h>
 #include <react/renderer/animations/primitives.h>
@@ -20,6 +19,8 @@
 #include <react/renderer/uimanager/LayoutAnimationStatusDelegate.h>
 #include <react/renderer/uimanager/UIManagerAnimationDelegate.h>
 
+#include <optional>
+
 namespace facebook {
 namespace react {
 
@@ -67,7 +68,7 @@ class LayoutAnimationKeyFrameManager : public UIManagerAnimationDelegate,
   // This is used to "hijack" the diffing process to figure out which mutations
   // should be animated. The mutations returned by this function will be
   // executed immediately.
-  butter::optional<MountingTransaction> pullTransaction(
+  std::optional<MountingTransaction> pullTransaction(
       SurfaceId surfaceId,
       MountingTransaction::Number number,
       TransactionTelemetry const &telemetry,
@@ -95,7 +96,7 @@ class LayoutAnimationKeyFrameManager : public UIManagerAnimationDelegate,
 
  protected:
   SharedComponentDescriptorRegistry componentDescriptorRegistry_;
-  mutable butter::optional<LayoutAnimation> currentAnimation_{};
+  mutable std::optional<LayoutAnimation> currentAnimation_{};
   mutable std::mutex currentAnimationMutex_;
 
   /**

ReactCommon/react/renderer/animations/conversions.h

@@ -5,15 +5,15 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-#include <butter/optional.h>
+#include <glog/logging.h>
 #include <react/renderer/animations/primitives.h>
 
-#include <glog/logging.h>
+#include <optional>
 
 namespace facebook {
 namespace react {
 
-static inline butter::optional<AnimationType> parseAnimationType(
+static inline std::optional<AnimationType> parseAnimationType(
     std::string param) {
   if (param == "spring") {
     return AnimationType::Spring;
@@ -38,7 +38,7 @@ static inline butter::optional<AnimationType> parseAnimationType(
   return {};
 }
 
-static inline butter::optional<AnimationProperty> parseAnimationProperty(
+static inline std::optional<AnimationProperty> parseAnimationProperty(
     std::string param) {
   if (param == "opacity") {
     return AnimationProperty::Opacity;
@@ -57,7 +57,7 @@ static inline butter::optional<AnimationProperty> parseAnimationProperty(
   return {};
 }
 
-static inline butter::optional<AnimationConfig> parseAnimationConfig(
+static inline std::optional<AnimationConfig> parseAnimationConfig(
     folly::dynamic const &config,
     double defaultDuration,
     bool parsePropertyType) {
@@ -163,7 +163,7 @@ static inline butter::optional<AnimationConfig> parseAnimationConfig(
     }
   }
 
-  return butter::optional<AnimationConfig>(AnimationConfig{
+  return std::optional<AnimationConfig>(AnimationConfig{
       *animationType,
       animationProperty,
       duration,
@@ -173,8 +173,8 @@ static inline butter::optional<AnimationConfig> parseAnimationConfig(
 }
 
 // Parse animation config from JS
-static inline butter::optional<LayoutAnimationConfig>
+static inline std::optional<LayoutAnimationConfig> parseLayoutAnimationConfig(
-parseLayoutAnimationConfig(folly::dynamic const &config) {
+    folly::dynamic const &config) {
   if (config.empty() || !config.isObject()) {
     return {};
   }
@@ -187,17 +187,17 @@ parseLayoutAnimationConfig(folly::dynamic const &config) {
 
   const auto createConfigIt = config.find("create");
   const auto createConfig = createConfigIt == config.items().end()
-      ? butter::optional<AnimationConfig>(AnimationConfig{})
+      ? std::optional<AnimationConfig>(AnimationConfig{})
       : parseAnimationConfig(createConfigIt->second, duration, true);
 
   const auto updateConfigIt = config.find("update");
   const auto updateConfig = updateConfigIt == config.items().end()
-      ? butter::optional<AnimationConfig>(AnimationConfig{})
+      ? std::optional<AnimationConfig>(AnimationConfig{})
       : parseAnimationConfig(updateConfigIt->second, duration, false);
 
   const auto deleteConfigIt = config.find("delete");
   const auto deleteConfig = deleteConfigIt == config.items().end()
-      ? butter::optional<AnimationConfig>(AnimationConfig{})
+      ? std::optional<AnimationConfig>(AnimationConfig{})
       : parseAnimationConfig(deleteConfigIt->second, duration, true);
 
   if (!createConfig || !updateConfig || !deleteConfig) {

ReactCommon/react/renderer/animations/tests/LayoutAnimationTest.cpp

@@ -273,7 +273,7 @@ static void testShadowNodeTreeLifeCycleLayoutAnimations(
       auto transaction =
           animationDriver->pullTransaction(surfaceId, 0, telemetry, {});
       // We have something to validate.
-      if (transaction.hasValue()) {
+      if (transaction.has_value()) {
         auto mutations = transaction->getMutations();
 
         // Mutating the view tree.

ReactCommon/react/renderer/attributedstring/TextAttributes.cpp

@@ -37,20 +37,20 @@ void TextAttributes::apply(TextAttributes textAttributes) {
   fontSizeMultiplier = !std::isnan(textAttributes.fontSizeMultiplier)
       ? textAttributes.fontSizeMultiplier
       : fontSizeMultiplier;
-  fontWeight = textAttributes.fontWeight.hasValue() ? textAttributes.fontWeight
+  fontWeight = textAttributes.fontWeight.has_value() ? textAttributes.fontWeight
-                                                    : fontWeight;
+                                                     : fontWeight;
-  fontStyle = textAttributes.fontStyle.hasValue() ? textAttributes.fontStyle
+  fontStyle = textAttributes.fontStyle.has_value() ? textAttributes.fontStyle
-                                                  : fontStyle;
+                                                   : fontStyle;
-  fontVariant = textAttributes.fontVariant.hasValue()
+  fontVariant = textAttributes.fontVariant.has_value()
       ? textAttributes.fontVariant
       : fontVariant;
-  allowFontScaling = textAttributes.allowFontScaling.hasValue()
+  allowFontScaling = textAttributes.allowFontScaling.has_value()
       ? textAttributes.allowFontScaling
       : allowFontScaling;
   letterSpacing = !std::isnan(textAttributes.letterSpacing)
       ? textAttributes.letterSpacing
       : letterSpacing;
-  textTransform = textAttributes.textTransform.hasValue()
+  textTransform = textAttributes.textTransform.has_value()
       ? textAttributes.textTransform
       : textTransform;
 
@@ -58,9 +58,9 @@ void TextAttributes::apply(TextAttributes textAttributes) {
   lineHeight = !std::isnan(textAttributes.lineHeight)
       ? textAttributes.lineHeight
       : lineHeight;
-  alignment = textAttributes.alignment.hasValue() ? textAttributes.alignment
+  alignment = textAttributes.alignment.has_value() ? textAttributes.alignment
-                                                  : alignment;
+                                                   : alignment;
-  baseWritingDirection = textAttributes.baseWritingDirection.hasValue()
+  baseWritingDirection = textAttributes.baseWritingDirection.has_value()
       ? textAttributes.baseWritingDirection
       : baseWritingDirection;
 
@@ -68,15 +68,15 @@ void TextAttributes::apply(TextAttributes textAttributes) {
   textDecorationColor = textAttributes.textDecorationColor
       ? textAttributes.textDecorationColor
       : textDecorationColor;
-  textDecorationLineType = textAttributes.textDecorationLineType.hasValue()
+  textDecorationLineType = textAttributes.textDecorationLineType.has_value()
       ? textAttributes.textDecorationLineType
       : textDecorationLineType;
-  textDecorationStyle = textAttributes.textDecorationStyle.hasValue()
+  textDecorationStyle = textAttributes.textDecorationStyle.has_value()
       ? textAttributes.textDecorationStyle
       : textDecorationStyle;
 
   // Shadow
-  textShadowOffset = textAttributes.textShadowOffset.hasValue()
+  textShadowOffset = textAttributes.textShadowOffset.has_value()
       ? textAttributes.textShadowOffset.value()
       : textShadowOffset;
   textShadowRadius = !std::isnan(textAttributes.textShadowRadius)
@@ -87,13 +87,13 @@ void TextAttributes::apply(TextAttributes textAttributes) {
       : textShadowColor;
 
   // Special
-  isHighlighted = textAttributes.isHighlighted.hasValue()
+  isHighlighted = textAttributes.isHighlighted.has_value()
       ? textAttributes.isHighlighted
       : isHighlighted;
-  layoutDirection = textAttributes.layoutDirection.hasValue()
+  layoutDirection = textAttributes.layoutDirection.has_value()
       ? textAttributes.layoutDirection
       : layoutDirection;
-  accessibilityRole = textAttributes.accessibilityRole.hasValue()
+  accessibilityRole = textAttributes.accessibilityRole.has_value()
       ? textAttributes.accessibilityRole
       : accessibilityRole;
 }

ReactCommon/react/renderer/attributedstring/TextAttributes.h

@@ -9,8 +9,8 @@
 
 #include <functional>
 #include <limits>
+#include <optional>
 
-#include <butter/optional.h>
 #include <folly/Hash.h>
 #include <react/renderer/attributedstring/primitives.h>
 #include <react/renderer/core/LayoutPrimitives.h>
@@ -46,38 +46,38 @@ class TextAttributes : public DebugStringConvertible {
   std::string fontFamily{""};
   Float fontSize{std::numeric_limits<Float>::quiet_NaN()};
   Float fontSizeMultiplier{std::numeric_limits<Float>::quiet_NaN()};
-  butter::optional<FontWeight> fontWeight{};
+  std::optional<FontWeight> fontWeight{};
-  butter::optional<FontStyle> fontStyle{};
+  std::optional<FontStyle> fontStyle{};
-  butter::optional<FontVariant> fontVariant{};
+  std::optional<FontVariant> fontVariant{};
-  butter::optional<bool> allowFontScaling{};
+  std::optional<bool> allowFontScaling{};
   Float letterSpacing{std::numeric_limits<Float>::quiet_NaN()};
-  butter::optional<TextTransform> textTransform{};
+  std::optional<TextTransform> textTransform{};
 
   // Paragraph Styles
   Float lineHeight{std::numeric_limits<Float>::quiet_NaN()};
-  butter::optional<TextAlignment> alignment{};
+  std::optional<TextAlignment> alignment{};
-  butter::optional<WritingDirection> baseWritingDirection{};
+  std::optional<WritingDirection> baseWritingDirection{};
 
   // Decoration
   SharedColor textDecorationColor{};
-  butter::optional<TextDecorationLineType> textDecorationLineType{};
+  std::optional<TextDecorationLineType> textDecorationLineType{};
-  butter::optional<TextDecorationStyle> textDecorationStyle{};
+  std::optional<TextDecorationStyle> textDecorationStyle{};
 
   // Shadow
   // TODO: Use `Point` type instead of `Size` for `textShadowOffset` attribute.
-  butter::optional<Size> textShadowOffset{};
+  std::optional<Size> textShadowOffset{};
   Float textShadowRadius{std::numeric_limits<Float>::quiet_NaN()};
   SharedColor textShadowColor{};
 
   // Special
-  butter::optional<bool> isHighlighted{};
+  std::optional<bool> isHighlighted{};
 
   // TODO T59221129: document where this value comes from and how it is set.
   // It's not clear if this is being used properly, or if it's being set at all.
   // Currently, it is intentionally *not* being set as part of BaseTextProps
   // construction.
-  butter::optional<LayoutDirection> layoutDirection{};
+  std::optional<LayoutDirection> layoutDirection{};
-  butter::optional<AccessibilityRole> accessibilityRole{};
+  std::optional<AccessibilityRole> accessibilityRole{};
 
 #pragma mark - Operations
 

ReactCommon/react/renderer/attributedstring/conversions.h

@@ -860,7 +860,7 @@ inline folly::dynamic toDynamic(const TextAttributes &textAttributes) {
   if (!std::isnan(textAttributes.letterSpacing)) {
     _textAttributes("letterSpacing", textAttributes.letterSpacing);
   }
-  if (textAttributes.textTransform.hasValue()) {
+  if (textAttributes.textTransform.has_value()) {
     _textAttributes("textTransform", toString(*textAttributes.textTransform));
   }
   if (!std::isnan(textAttributes.lineHeight)) {

ReactCommon/react/renderer/components/text/ParagraphShadowNode.h

@@ -102,7 +102,7 @@ class ParagraphShadowNode final : public ConcreteViewShadowNode<
   /*
    * Cached content of the subtree started from the node.
    */
-  mutable butter::optional<Content> content_{};
+  mutable std::optional<Content> content_{};
 };
 
 } // namespace react

ReactCommon/react/renderer/components/textinput/androidtextinput/react/renderer/components/androidtextinput/AndroidTextInputShadowNode.h

@@ -81,7 +81,7 @@ class AndroidTextInputShadowNode final : public ConcreteViewShadowNode<
    * Cached attributed string that represents the content of the subtree started
    * from the node.
    */
-  mutable butter::optional<AttributedString> cachedAttributedString_{};
+  mutable std::optional<AttributedString> cachedAttributedString_{};
 };
 
 } // namespace react

ReactCommon/react/renderer/components/textinput/iostextinput/TextInputProps.cpp

@@ -87,7 +87,7 @@ TextInputProps::TextInputProps(
           rawProps,
           "selection",
           sourceProps.selection,
-          butter::optional<Selection>())),
+          std::optional<Selection>())),
       inputAccessoryViewID(convertRawProp(
           context,
           rawProps,

ReactCommon/react/renderer/components/textinput/iostextinput/TextInputProps.h

@@ -58,7 +58,7 @@ class TextInputProps final : public ViewProps, public BaseTextProps {
   int const mostRecentEventCount{0};
 
   bool autoFocus{false};
-  butter::optional<Selection> selection{};
+  std::optional<Selection> selection{};
 
   std::string const inputAccessoryViewID{};
 

ReactCommon/react/renderer/components/textinput/iostextinput/primitives.h

@@ -7,10 +7,9 @@
 
 #pragma once
 
+#include <optional>
 #include <string>
 
-#include <butter/optional.h>
-
 namespace facebook {
 namespace react {
 
@@ -106,7 +105,7 @@ class TextInputTraits final {
    * iOS & Android
    * Default value: `empty` (`null`).
    */
-  butter::optional<bool> autoCorrect{};
+  std::optional<bool> autoCorrect{};
 
   /*
    * iOS & Android
@@ -141,7 +140,7 @@ class TextInputTraits final {
    * Can be empty (`null` in JavaScript) which means `default`.
    * Default value: `empty` (`null`).
    */
-  butter::optional<bool> spellCheck{};
+  std::optional<bool> spellCheck{};
 
   /*
    * iOS & Android

ReactCommon/react/renderer/components/view/AccessibilityPrimitives.h

@@ -7,8 +7,8 @@
 
 #pragma once
 
-#include <butter/optional.h>
 #include <cinttypes>
+#include <optional>
 #include <string>
 
 namespace facebook {
@@ -50,7 +50,7 @@ constexpr enum AccessibilityTraits operator&(
 
 struct AccessibilityAction {
   std::string name{""};
-  butter::optional<std::string> label{};
+  std::optional<std::string> label{};
 };
 
 struct AccessibilityState {
@@ -76,10 +76,10 @@ constexpr bool operator!=(
 }
 
 struct AccessibilityValue {
-  butter::optional<int> min;
+  std::optional<int> min;
-  butter::optional<int> max;
+  std::optional<int> max;
-  butter::optional<int> now;
+  std::optional<int> now;
-  butter::optional<std::string> text{};
+  std::optional<std::string> text{};
 };
 
 constexpr bool operator==(

ReactCommon/react/renderer/components/view/ViewProps.h

@@ -17,6 +17,8 @@
 #include <react/renderer/graphics/Geometry.h>
 #include <react/renderer/graphics/Transform.h>
 
+#include <optional>
+
 namespace facebook {
 namespace react {
 
@@ -54,7 +56,7 @@ class ViewProps : public YogaStylableProps, public AccessibilityProps {
   Transform transform{};
   BackfaceVisibility backfaceVisibility{};
   bool shouldRasterize{};
-  butter::optional<int> zIndex{};
+  std::optional<int> zIndex{};
 
   // Events
   PointerEventsMode pointerEvents{};

ReactCommon/react/renderer/components/view/YogaLayoutableShadowNode.cpp

@@ -690,44 +690,44 @@ void YogaLayoutableShadowNode::swapLeftAndRightInViewProps(
   auto &props = const_cast<ViewProps &>(typedCasting);
 
   // Swap border node values, borderRadii, borderColors and borderStyles.
-  if (props.borderRadii.topLeft.hasValue()) {
+  if (props.borderRadii.topLeft.has_value()) {
     props.borderRadii.topStart = props.borderRadii.topLeft;
-    props.borderRadii.topLeft.clear();
+    props.borderRadii.topLeft.reset();
   }
 
-  if (props.borderRadii.bottomLeft.hasValue()) {
+  if (props.borderRadii.bottomLeft.has_value()) {
     props.borderRadii.bottomStart = props.borderRadii.bottomLeft;
-    props.borderRadii.bottomLeft.clear();
+    props.borderRadii.bottomLeft.reset();
   }
 
-  if (props.borderRadii.topRight.hasValue()) {
+  if (props.borderRadii.topRight.has_value()) {
     props.borderRadii.topEnd = props.borderRadii.topRight;
-    props.borderRadii.topRight.clear();
+    props.borderRadii.topRight.reset();
   }
 
-  if (props.borderRadii.bottomRight.hasValue()) {
+  if (props.borderRadii.bottomRight.has_value()) {
     props.borderRadii.bottomEnd = props.borderRadii.bottomRight;
-    props.borderRadii.bottomRight.clear();
+    props.borderRadii.bottomRight.reset();
   }
 
-  if (props.borderColors.left.hasValue()) {
+  if (props.borderColors.left.has_value()) {
     props.borderColors.start = props.borderColors.left;
-    props.borderColors.left.clear();
+    props.borderColors.left.reset();
   }
 
-  if (props.borderColors.right.hasValue()) {
+  if (props.borderColors.right.has_value()) {
     props.borderColors.end = props.borderColors.right;
-    props.borderColors.right.clear();
+    props.borderColors.right.reset();
   }
 
-  if (props.borderStyles.left.hasValue()) {
+  if (props.borderStyles.left.has_value()) {
     props.borderStyles.start = props.borderStyles.left;
-    props.borderStyles.left.clear();
+    props.borderStyles.left.reset();
   }
 
-  if (props.borderStyles.right.hasValue()) {
+  if (props.borderStyles.right.has_value()) {
     props.borderStyles.end = props.borderStyles.right;
-    props.borderStyles.right.clear();
+    props.borderStyles.right.reset();
   }
 
   YGStyle::Edges const &border = props.yogaStyle.border();

ReactCommon/react/renderer/components/view/conversions.h

@@ -8,7 +8,6 @@
 #pragma once
 
 #include <butter/map.h>
-#include <butter/optional.h>
 #include <folly/Conv.h>
 #include <folly/dynamic.h>
 #include <glog/logging.h>
@@ -23,6 +22,7 @@
 #include <yoga/YGNode.h>
 #include <yoga/Yoga.h>
 #include <cmath>
+#include <optional>
 
 namespace facebook {
 namespace react {
@@ -98,9 +98,9 @@ inline YGValue yogaStyleValueFromFloat(
   return {(float)value, unit};
 }
 
-inline butter::optional<Float> optionalFloatFromYogaValue(
+inline std::optional<Float> optionalFloatFromYogaValue(
     const YGValue value,
-    butter::optional<Float> base = {}) {
+    std::optional<Float> base = {}) {
   switch (value.unit) {
     case YGUnitUndefined:
       return {};
@@ -108,9 +108,8 @@ inline butter::optional<Float> optionalFloatFromYogaValue(
       return floatFromYogaFloat(value.value);
     case YGUnitPercent:
       return base.has_value()
-          ? butter::optional<Float>(
+          ? std::optional<Float>(base.value() * floatFromYogaFloat(value.value))
-                base.value() * floatFromYogaFloat(value.value))
+          : std::optional<Float>();
-          : butter::optional<Float>();
     case YGUnitAuto:
       return {};
   }

ReactCommon/react/renderer/components/view/primitives.h

@@ -7,11 +7,12 @@
 
 #pragma once
 
-#include <butter/optional.h>
 #include <react/renderer/graphics/Color.h>
 #include <react/renderer/graphics/Geometry.h>
+
 #include <array>
 #include <cmath>
+#include <optional>
 
 namespace facebook {
 namespace react {
@@ -25,7 +26,7 @@ enum class BorderStyle { Solid, Dotted, Dashed };
 template <typename T>
 struct CascadedRectangleEdges {
   using Counterpart = RectangleEdges<T>;
-  using OptionalT = butter::optional<T>;
+  using OptionalT = std::optional<T>;
 
   OptionalT left{};
   OptionalT top{};
@@ -86,7 +87,7 @@ struct CascadedRectangleEdges {
 template <typename T>
 struct CascadedRectangleCorners {
   using Counterpart = RectangleCorners<T>;
-  using OptionalT = butter::optional<T>;
+  using OptionalT = std::optional<T>;
 
   OptionalT topLeft{};
   OptionalT topRight{};

ReactCommon/react/renderer/components/view/propsConversions.h

@@ -11,6 +11,8 @@
 #include <react/renderer/core/PropsParserContext.h>
 #include <react/renderer/core/propsConversions.h>
 
+#include <optional>
+
 namespace facebook {
 namespace react {
 

ReactCommon/react/renderer/core/RawProps.h

@@ -8,9 +8,9 @@
 #pragma once
 
 #include <limits>
+#include <optional>
 
 #include <butter/map.h>
-#include <butter/optional.h>
 #include <butter/small_vector.h>
 
 #include <folly/dynamic.h>

ReactCommon/react/renderer/core/propsConversions.h

@@ -7,7 +7,8 @@
 
 #pragma once
 
-#include <butter/optional.h>
+#include <optional>
+
 #include <folly/Likely.h>
 #include <folly/dynamic.h>
 #include <react/renderer/core/PropsParserContext.h>
@@ -106,12 +107,12 @@ T convertRawProp(
 }
 
 template <typename T>
-static butter::optional<T> convertRawProp(
+static std::optional<T> convertRawProp(
     const PropsParserContext &context,
     RawProps const &rawProps,
     char const *name,
-    butter::optional<T> const &sourceValue,
+    std::optional<T> const &sourceValue,
-    butter::optional<T> const &defaultValue,
+    std::optional<T> const &defaultValue,
     char const *namePrefix = nullptr,
     char const *nameSuffix = nullptr) {
   const auto *rawValue = rawProps.at(name, namePrefix, nameSuffix);
@@ -128,7 +129,7 @@ static butter::optional<T> convertRawProp(
 
   T result;
   fromRawValue(context, *rawValue, result);
-  return butter::optional<T>{result};
+  return std::optional<T>{result};
 }
 
 } // namespace react

ReactCommon/react/renderer/debug/debugStringConvertibleUtils.h

@@ -7,9 +7,9 @@
 
 #pragma once
 
-#include <butter/optional.h>
 #include <limits>
 #include <memory>
+#include <optional>
 #include <string>
 #include <vector>
 
@@ -34,9 +34,9 @@ debugStringConvertibleItem(std::string name, T value, T defaultValue = {}) {
 template <typename T>
 inline SharedDebugStringConvertible debugStringConvertibleItem(
     std::string name,
-    butter::optional<T> value,
+    std::optional<T> value,
     T defaultValue = {}) {
-  if (!value.hasValue()) {
+  if (!value.has_value()) {
     return nullptr;
   }
 

ReactCommon/react/renderer/graphics/platform/ios/Color.h

@@ -9,6 +9,7 @@
 
 #include <butter/optional.h>
 #include <cmath>
+#include <optional>
 
 #include <folly/Hash.h>
 #include <react/renderer/graphics/ColorComponents.h>

ReactCommon/react/renderer/mounting/MountingCoordinator.cpp

@@ -75,11 +75,11 @@ void MountingCoordinator::resetLatestRevision() const {
   lastRevision_.reset();
 }
 
-butter::optional<MountingTransaction> MountingCoordinator::pullTransaction()
+std::optional<MountingTransaction> MountingCoordinator::pullTransaction()
     const {
   std::lock_guard<std::mutex> lock(mutex_);
 
-  auto transaction = butter::optional<MountingTransaction>{};
+  auto transaction = std::optional<MountingTransaction>{};
 
   // Base case
   if (lastRevision_.has_value()) {

ReactCommon/react/renderer/mounting/MountingCoordinator.h

@@ -7,8 +7,8 @@
 
 #pragma once
 
-#include <butter/optional.h>
 #include <chrono>
+#include <optional>
 
 #include <react/renderer/debug/flags.h>
 #include <react/renderer/mounting/Differentiator.h>
@@ -56,7 +56,7 @@ class MountingCoordinator final {
    * However, a consumer should always call it on the same thread (e.g. on the
    * main thread) or ensure sequentiality of mount transactions separately.
    */
-  butter::optional<MountingTransaction> pullTransaction() const;
+  std::optional<MountingTransaction> pullTransaction() const;
 
   /*
    * Blocks the current thread until a new mounting transaction is available or
@@ -104,7 +104,7 @@ class MountingCoordinator final {
 
   mutable std::mutex mutex_;
   mutable ShadowTreeRevision baseRevision_;
-  mutable butter::optional<ShadowTreeRevision> lastRevision_{};
+  mutable std::optional<ShadowTreeRevision> lastRevision_{};
   mutable MountingTransaction::Number number_{0};
   mutable std::condition_variable signal_;
   mutable std::weak_ptr<MountingOverrideDelegate const>

ReactCommon/react/renderer/mounting/MountingOverrideDelegate.h

@@ -36,7 +36,7 @@ class MountingOverrideDelegate {
    * @param mountingCoordinator
    * @return
    */
-  virtual butter::optional<MountingTransaction> pullTransaction(
+  virtual std::optional<MountingTransaction> pullTransaction(
       SurfaceId surfaceId,
       MountingTransaction::Number number,
       TransactionTelemetry const &telemetry,

ReactCommon/react/renderer/mounting/ShadowTreeRevision.h

@@ -7,8 +7,6 @@
 
 #pragma once
 
-#include <butter/optional.h>
-
 #include <react/renderer/components/root/RootShadowNode.h>
 #include <react/renderer/mounting/MountingOverrideDelegate.h>
 #include <react/renderer/mounting/MountingTransaction.h>

ReactCommon/react/renderer/runtimescheduler/Task.h

@@ -7,11 +7,12 @@
 
 #pragma once
 
-#include <butter/optional.h>
 #include <jsi/jsi.h>
 #include <react/renderer/runtimescheduler/RuntimeSchedulerClock.h>
 #include <react/renderer/runtimescheduler/SchedulerPriority.h>
 
+#include <optional>
+
 namespace facebook {
 namespace react {
 
@@ -29,7 +30,7 @@ struct Task final {
   friend TaskPriorityComparer;
 
   SchedulerPriority priority;
-  butter::optional<jsi::Function> callback;
+  std::optional<jsi::Function> callback;
   RuntimeSchedulerClock::time_point expirationTime;
 
   jsi::Value execute(jsi::Runtime &runtime);

ReactCommon/react/renderer/scheduler/Scheduler.cpp

@@ -42,8 +42,7 @@ Scheduler::Scheduler(
           "ReactNativeConfig");
 
   // Creating a container for future `EventDispatcher` instance.
-  eventDispatcher_ =
+  eventDispatcher_ = std::make_shared<std::optional<EventDispatcher const>>();
-      std::make_shared<butter::optional<EventDispatcher const>>();
 
   auto uiManager = std::make_shared<UIManager>(
       runtimeExecutor_, schedulerToolbox.backgroundExecutor, contextContainer_);

ReactCommon/react/renderer/scheduler/Scheduler.h

@@ -134,7 +134,7 @@ class Scheduler final : public UIManagerDelegate {
    * parts that need to have ownership (and only ownership) of that, and then
    * fill the optional.
    */
-  std::shared_ptr<butter::optional<EventDispatcher const>> eventDispatcher_;
+  std::shared_ptr<std::optional<EventDispatcher const>> eventDispatcher_;
 
   /**
    * Hold onto ContextContainer. See SchedulerToolbox.

ReactCommon/react/renderer/textlayoutmanager/platform/ios/RCTAttributedTextUtils.mm

@@ -62,13 +62,13 @@ inline static UIFont *RCTEffectiveFontFromTextAttributes(const TextAttributes &t
   RCTFontProperties fontProperties;
   fontProperties.family = fontFamily;
   fontProperties.size = textAttributes.fontSize;
-  fontProperties.style = textAttributes.fontStyle.hasValue()
+  fontProperties.style = textAttributes.fontStyle.has_value()
       ? RCTFontStyleFromFontStyle(textAttributes.fontStyle.value())
       : RCTFontStyleUndefined;
-  fontProperties.variant = textAttributes.fontVariant.hasValue()
+  fontProperties.variant = textAttributes.fontVariant.has_value()
       ? RCTFontVariantFromFontVariant(textAttributes.fontVariant.value())
       : RCTFontVariantUndefined;
-  fontProperties.weight = textAttributes.fontWeight.hasValue()
+  fontProperties.weight = textAttributes.fontWeight.has_value()
       ? RCTUIFontWeightFromInteger((NSInteger)textAttributes.fontWeight.value())
       : NAN;
   fontProperties.sizeMultiplier = textAttributes.fontSizeMultiplier;
@@ -136,7 +136,7 @@ NSDictionary<NSAttributedStringKey, id> *RCTNSTextAttributesFromTextAttributes(T
   // Paragraph Style
   NSMutableParagraphStyle *paragraphStyle = [NSMutableParagraphStyle new];
   BOOL isParagraphStyleUsed = NO;
-  if (textAttributes.alignment.hasValue()) {
+  if (textAttributes.alignment.has_value()) {
     TextAlignment textAlignment = textAttributes.alignment.value_or(TextAlignment::Natural);
     if (textAttributes.layoutDirection.value_or(LayoutDirection::LeftToRight) == LayoutDirection::RightToLeft) {
       if (textAlignment == TextAlignment::Right) {
@@ -150,7 +150,7 @@ NSDictionary<NSAttributedStringKey, id> *RCTNSTextAttributesFromTextAttributes(T
     isParagraphStyleUsed = YES;
   }
 
-  if (textAttributes.baseWritingDirection.hasValue()) {
+  if (textAttributes.baseWritingDirection.has_value()) {
     paragraphStyle.baseWritingDirection =
         RCTNSWritingDirectionFromWritingDirection(textAttributes.baseWritingDirection.value());
     isParagraphStyleUsed = YES;
@@ -198,7 +198,7 @@ NSDictionary<NSAttributedStringKey, id> *RCTNSTextAttributesFromTextAttributes(T
   }
 
   // Shadow
-  if (textAttributes.textShadowOffset.hasValue()) {
+  if (textAttributes.textShadowOffset.has_value()) {
     auto textShadowOffset = textAttributes.textShadowOffset.value();
     NSShadow *shadow = [NSShadow new];
     shadow.shadowOffset = CGSize{textShadowOffset.width, textShadowOffset.height};
@@ -212,7 +212,7 @@ NSDictionary<NSAttributedStringKey, id> *RCTNSTextAttributesFromTextAttributes(T
     attributes[RCTAttributedStringIsHighlightedAttributeName] = @YES;
   }
 
-  if (textAttributes.accessibilityRole.hasValue()) {
+  if (textAttributes.accessibilityRole.has_value()) {
     auto accessibilityRole = textAttributes.accessibilityRole.value();
     switch (accessibilityRole) {
       case AccessibilityRole::None:
@@ -334,7 +334,7 @@ NSAttributedString *RCTNSAttributedStringFromAttributedString(const AttributedSt
     } else {
       NSString *string = [NSString stringWithCString:fragment.string.c_str() encoding:NSUTF8StringEncoding];
 
-      if (fragment.textAttributes.textTransform.hasValue()) {
+      if (fragment.textAttributes.textTransform.has_value()) {
         auto textTransform = fragment.textAttributes.textTransform.value();
         string = RCTNSStringFromStringApplyingTextTransform(string, textTransform);
       }

ReactCommon/react/utils/ContextContainer.h

@@ -9,11 +9,11 @@
 
 #include <memory>
 #include <mutex>
+#include <optional>
 #include <string>
 
 #include <butter/map.h>
 #include <butter/mutex.h>
-#include <butter/optional.h>
 
 #include <react/debug/flags.h>
 #include <react/debug/react_native_assert.h>
@@ -92,7 +92,7 @@ class ContextContainer final {
    * Returns an empty optional if the instance could not be found.
    */
   template <typename T>
-  butter::optional<T> find(std::string const &key) const {
+  std::optional<T> find(std::string const &key) const {
     std::shared_lock<butter::shared_mutex> lock(mutex_);
 
     auto iterator = instances_.find(key);

ReactCommon/react/utils/SimpleThreadSafeCache.h

@@ -8,8 +8,8 @@
 #include <functional>
 #include <memory>
 #include <mutex>
+#include <optional>
 
-#include <butter/optional.h>
 #include <folly/container/EvictingCacheMap.h>
 
 namespace facebook {
@@ -48,7 +48,7 @@ class SimpleThreadSafeCache {
    * If the value wasn't found in the cache, returns empty optional.
    * Can be called from any thread.
    */
-  butter::optional<ValueT> get(const KeyT &key) const {
+  std::optional<ValueT> get(const KeyT &key) const {
     std::lock_guard<std::mutex> lock(mutex_);
     auto iterator = map_.find(key);
     if (iterator == map_.end()) {