react-native-windows 0.0.0-canary.556 → 0.0.0-canary.558

package/Microsoft.ReactNative/CompositionSwitcher.idl

@@ -53,6 +53,7 @@ namespace Microsoft.ReactNative.Composition
     void Size(Windows.Foundation.Numerics.Vector2 size);
     void Offset(Windows.Foundation.Numerics.Vector3 offset);
     void Offset(Windows.Foundation.Numerics.Vector3 offset, Windows.Foundation.Numerics.Vector3 relativeAdjustment);
+    void RelativeSizeWithOffset(Windows.Foundation.Numerics.Vector2 size, Windows.Foundation.Numerics.Vector2 relativeSizeAdjustment);
   }
 
   [webhosthidden]

package/Microsoft.ReactNative/Fabric/Composition/CompositionContextHelper.cpp

@@ -230,6 +230,13 @@ struct CompVisual : public winrt::implements<
     m_visual.RelativeOffsetAdjustment(relativeAdjustment);
   }
 
+  void RelativeSizeWithOffset(
+      winrt::Windows::Foundation::Numerics::float2 size,
+      winrt::Windows::Foundation::Numerics::float2 relativeSizeAdjustment) noexcept {
+    m_visual.Size(size);
+    m_visual.RelativeSizeAdjustment(relativeSizeAdjustment);
+  }
+
  private:
   winrt::Windows::UI::Composition::Visual m_visual;
 };
@@ -245,8 +252,8 @@ struct CompSpriteVisual : winrt::Microsoft::ReactNative::Composition::implementa
   void InsertAt(const winrt::Microsoft::ReactNative::Composition::IVisual &visual, uint32_t index) noexcept {
     auto containerChildren = m_visual.Children();
     auto compVisual = winrt::Microsoft::ReactNative::Composition::CompositionContextHelper::InnerVisual(visual);
-    if (index == 0 || containerChildren.Count() == 0) {
-      containerChildren.InsertAtTop(compVisual);
+    if (index == 0) {
+      containerChildren.InsertAtBottom(compVisual);
       return;
     }
     auto insertAfter = containerChildren.First();
@@ -305,6 +312,13 @@ struct CompSpriteVisual : winrt::Microsoft::ReactNative::Composition::implementa
     m_visual.RelativeOffsetAdjustment(relativeAdjustment);
   }
 
+  void RelativeSizeWithOffset(
+      winrt::Windows::Foundation::Numerics::float2 size,
+      winrt::Windows::Foundation::Numerics::float2 relativeSizeAdjustment) noexcept {
+    m_visual.Size(size);
+    m_visual.RelativeSizeAdjustment(relativeSizeAdjustment);
+  }
+
   void SetClippingPath(ID2D1Geometry *clippingPath) noexcept {
     if (!clippingPath) {
       m_visual.Clip(nullptr);
@@ -462,7 +476,9 @@ struct CompScrollerVisual : winrt::Microsoft::ReactNative::Composition::implemen
   }
 
   void Size(winrt::Windows::Foundation::Numerics::float2 const &size) noexcept {
+    m_visualSize = size;
     m_visual.Size(size);
+    UpdateMaxPosition();
   }
 
   void Offset(winrt::Windows::Foundation::Numerics::float3 const &offset) noexcept {
@@ -476,6 +492,13 @@ struct CompScrollerVisual : winrt::Microsoft::ReactNative::Composition::implemen
     m_visual.RelativeOffsetAdjustment(relativeAdjustment);
   }
 
+  void RelativeSizeWithOffset(
+      winrt::Windows::Foundation::Numerics::float2 size,
+      winrt::Windows::Foundation::Numerics::float2 relativeSizeAdjustment) noexcept {
+    m_visual.Size(size);
+    m_visual.RelativeSizeAdjustment(relativeSizeAdjustment);
+  }
+
   void SetClippingPath(ID2D1Geometry *clippingPath) noexcept {
     auto geometry = winrt::make<GeometrySource>(clippingPath);
     auto path = winrt::Windows::UI::Composition::CompositionPath(geometry);
@@ -499,8 +522,9 @@ struct CompScrollerVisual : winrt::Microsoft::ReactNative::Composition::implemen
   }
 
   void ContentSize(winrt::Windows::Foundation::Numerics::float2 const &size) noexcept {
+    m_contentSize = size;
     m_contentVisual.Size(size);
-    m_interactionTracker.MaxPosition({size.x, size.y, 0});
+    UpdateMaxPosition();
   }
 
   winrt::Windows::Foundation::Numerics::float3 ScrollPosition() noexcept {
@@ -516,6 +540,15 @@ struct CompScrollerVisual : winrt::Microsoft::ReactNative::Composition::implemen
     m_scrollPositionChangedEvent(*this, winrt::make<CompScrollPositionChangedArgs>(position));
   }
 
+  void UpdateMaxPosition() {
+    m_interactionTracker.MaxPosition(
+        {std::max<float>(m_contentSize.x - m_visualSize.x, 0),
+         std::max<float>(m_contentSize.y - m_visualSize.y, 0),
+         0});
+  }
+
+  winrt::Windows::Foundation::Numerics::float2 m_contentSize{0};
+  winrt::Windows::Foundation::Numerics::float2 m_visualSize{0};
   winrt::event<
       winrt::Windows::Foundation::EventHandler<winrt::Microsoft::ReactNative::Composition::ScrollPositionChangedArgs>>
       m_scrollPositionChangedEvent;

package/Microsoft.ReactNative/Fabric/Composition/CompositionViewComponentView.cpp

@@ -90,10 +90,12 @@ bool CompositionBaseComponentView::ScrollWheel(facebook::react::Point pt, int32_
   return false;
 }
 
-std::array<winrt::Microsoft::ReactNative::Composition::SpriteVisual, 12>
+std::array<
+    winrt::Microsoft::ReactNative::Composition::SpriteVisual,
+    CompositionBaseComponentView::SpecialBorderLayerCount>
 CompositionBaseComponentView::FindSpecialBorderLayers() const noexcept {
-  std::array<winrt::Microsoft::ReactNative::Composition::SpriteVisual, 12> layers{
-      nullptr, nullptr, nullptr, nullptr, nullptr, nullptr, nullptr, nullptr, nullptr, nullptr, nullptr, nullptr};
+  std::array<winrt::Microsoft::ReactNative::Composition::SpriteVisual, SpecialBorderLayerCount> layers{
+      nullptr, nullptr, nullptr, nullptr, nullptr, nullptr, nullptr, nullptr};
 
   if (m_numBorderVisuals) {
     for (uint8_t i = 0; i < m_numBorderVisuals; i++) {
@@ -375,6 +377,8 @@ void SetBorderLayerPropertiesCommon(
     const D2D1_RECT_F &textureRect,
     facebook::react::Point anchorPoint,
     facebook::react::Point anchorOffset,
+    winrt::Windows::Foundation::Numerics::float2 size,
+    winrt::Windows::Foundation::Numerics::float2 relativeSizeAdjustment,
     FLOAT strokeWidth,
     const facebook::react::SharedColor &borderColor,
     facebook::react::BorderStyle borderStyle) {
@@ -389,7 +393,7 @@ void SetBorderLayerPropertiesCommon(
 
   layer.Brush(compContext.CreateSurfaceBrush(surface));
   layer.Offset({anchorOffset.x, anchorOffset.y, 0}, {anchorPoint.x, anchorPoint.y, 0});
-  layer.Size({textureRect.right - textureRect.left, textureRect.bottom - textureRect.top});
+  layer.RelativeSizeWithOffset(size, relativeSizeAdjustment);
 
   AutoDrawHelper autoDraw(borderTexture);
 
@@ -462,6 +466,8 @@ void SetBorderLayerProperties(
     const D2D1_RECT_F &textureRect,
     facebook::react::Point anchorPoint,
     facebook::react::Point anchorOffset,
+    winrt::Windows::Foundation::Numerics::float2 size,
+    winrt::Windows::Foundation::Numerics::float2 relativeSizeAdjustment,
     FLOAT strokeWidth,
     const facebook::react::SharedColor &borderColor,
     facebook::react::BorderStyle borderStyle) {
@@ -474,6 +480,8 @@ void SetBorderLayerProperties(
         textureRect,
         anchorPoint,
         anchorOffset,
+        size,
+        relativeSizeAdjustment,
         strokeWidth,
         borderColor,
         borderStyle);
@@ -516,16 +524,19 @@ const float Bottom = 1.0;
 template <typename TShape>
 void DrawAllBorderLayers(
     winrt::Microsoft::ReactNative::Composition::ICompositionContext &compContext,
-    std::array<winrt::Microsoft::ReactNative::Composition::SpriteVisual, 12> &spBorderLayers,
+    std::array<
+        winrt::Microsoft::ReactNative::Composition::SpriteVisual,
+        CompositionBaseComponentView::SpecialBorderLayerCount> &spBorderLayers,
     TShape &shape,
-    FLOAT strokeWidth,
+    const facebook::react::BorderWidths &borderWidths,
+    const facebook::react::BorderRadii &borderRadii,
     float textureWidth,
     float textureHeight,
     const facebook::react::BorderColors &borderColors,
     facebook::react::BorderStyle borderStyle) {
   // Now that we've drawn our nice border in one layer, split it into its component layers
-  winrt::com_ptr<Composition::ICompositionDrawingSurfaceInterop> spTextures[12];
-  float cornerSize = strokeWidth;
+  winrt::com_ptr<Composition::ICompositionDrawingSurfaceInterop>
+      spTextures[CompositionBaseComponentView::SpecialBorderLayerCount];
 
   // Set component border properties
   // Top Left Corner
@@ -534,162 +545,144 @@ void DrawAllBorderLayers(
       spBorderLayers[0],
       shape,
       spTextures[0], // Target Layer, Source Texture, Target Texture
-      {0, 0, cornerSize, cornerSize}, // Texture Left, Top, Width, Height
+      {0,
+       0,
+       borderRadii.topLeft + borderWidths.left,
+       borderRadii.topLeft + borderWidths.top}, // Texture Left, Top, Width, Height
       {AnchorPosition::Left, AnchorPosition::Top}, // Layer Anchor Point
       {0, 0}, // Layer Anchor Offset
-      strokeWidth,
+      {borderRadii.topLeft + borderWidths.left, borderRadii.topLeft + borderWidths.top}, // size
+      {0.0f, 0.0f}, // relativeSize
+      std::max(borderWidths.left, borderWidths.top),
       borderColors.left ? borderColors.left : borderColors.top,
       borderStyle);
 
-  // Top Left Inset Corner
+  // Top Edge Border
   SetBorderLayerProperties(
       compContext,
       spBorderLayers[1],
       shape,
       spTextures[1],
-      {cornerSize, cornerSize, std::ceil(textureWidth / 2.0f), std::ceil(textureHeight / 2.0f)},
+      {borderRadii.topLeft + borderWidths.left,
+       0,
+       textureWidth - (borderRadii.topRight + borderWidths.right),
+       borderWidths.top},
       {AnchorPosition::Left, AnchorPosition::Top},
-      {cornerSize, cornerSize},
-      strokeWidth,
-      borderColors.left ? borderColors.left : borderColors.top,
-      borderStyle);
-
-  // Top Edge Border
-  SetBorderLayerProperties(
-      compContext,
-      spBorderLayers[2],
-      shape,
-      spTextures[2],
-      {cornerSize, 0, textureWidth - cornerSize, cornerSize},
-      {AnchorPosition::Left, AnchorPosition::Top},
-      {cornerSize, 0},
-      strokeWidth,
+      {borderRadii.topLeft + borderWidths.left, 0},
+      {-(borderRadii.topLeft + borderWidths.left + borderRadii.topRight + borderWidths.right),
+       borderWidths.top}, // size
+      {1.0f, 0.0f}, // relativeSize
+      borderWidths.top,
       borderColors.top,
       borderStyle);
 
   // Top Right Corner Border
   SetBorderLayerProperties(
       compContext,
-      spBorderLayers[3],
-      shape,
-      spTextures[3],
-      {textureWidth - cornerSize, 0, textureWidth, cornerSize},
-      {AnchorPosition::Right, AnchorPosition::Top},
-      {-cornerSize, 0},
-      strokeWidth,
-      borderColors.right ? borderColors.right : borderColors.top,
-      borderStyle);
-
-  // Top Right Inset Corner Border
-  SetBorderLayerProperties(
-      compContext,
-      spBorderLayers[4],
+      spBorderLayers[2],
       shape,
-      spTextures[4],
-      {std::floor(textureWidth / 2.0f),
-       cornerSize,
-       textureWidth - cornerSize /* - (textureWidth % 2)*/,
-       std::ceil(textureHeight / 2.0f)},
+      spTextures[2],
+      {textureWidth - (borderRadii.topRight + borderWidths.right),
+       0,
+       textureWidth,
+       borderRadii.topRight + borderWidths.top},
       {AnchorPosition::Right, AnchorPosition::Top},
-      {-std::floor(textureWidth / 2.0f), cornerSize},
-      strokeWidth,
+      {-(borderRadii.topRight + borderWidths.right), 0},
+      {borderRadii.topRight + borderWidths.right, borderRadii.topRight + borderWidths.top},
+      {0.0f, 0.0f},
+      std::max(borderWidths.right, borderWidths.top),
       borderColors.right ? borderColors.right : borderColors.top,
       borderStyle);
 
   // Right Edge Border
   SetBorderLayerProperties(
       compContext,
-      spBorderLayers[5],
+      spBorderLayers[3],
       shape,
-      spTextures[5],
-      {textureWidth - cornerSize, cornerSize, textureWidth, textureHeight - cornerSize},
+      spTextures[3],
+      {textureWidth - borderWidths.right,
+       borderWidths.top + borderRadii.topRight,
+       textureWidth,
+       textureHeight - (borderWidths.bottom + borderRadii.bottomRight)},
       {AnchorPosition::Right, AnchorPosition::Top},
-      {-cornerSize, cornerSize},
-      strokeWidth,
+      {-borderWidths.right, borderWidths.top + borderRadii.topRight},
+      {borderWidths.right,
+       -(borderWidths.top + borderRadii.topRight + borderWidths.bottom + borderRadii.bottomRight)}, // size
+      {0.0f, 1.0f},
+      borderWidths.right,
       borderColors.right,
       borderStyle);
 
   // Bottom Right Corner Border
   SetBorderLayerProperties(
       compContext,
-      spBorderLayers[6],
-      shape,
-      spTextures[6],
-      {textureWidth - cornerSize, textureHeight - cornerSize, textureWidth, textureHeight},
-      {AnchorPosition::Right, AnchorPosition::Bottom},
-      {-cornerSize, -cornerSize},
-      strokeWidth,
-      borderColors.right ? borderColors.right : borderColors.bottom,
-      borderStyle);
-
-  // Bottom Right Inset Corner Border
-  SetBorderLayerProperties(
-      compContext,
-      spBorderLayers[7],
+      spBorderLayers[4],
       shape,
-      spTextures[7],
-      {std::floor(textureWidth / 2),
-       std::floor(textureHeight / 2.0f),
-       textureWidth - cornerSize /* - (textureWidth % 2)*/,
-       textureHeight - cornerSize /* - (textureHeight % 2) */},
+      spTextures[4],
+      {textureWidth - (borderWidths.right + borderRadii.bottomRight),
+       textureHeight - (borderWidths.bottom + borderRadii.bottomRight),
+       textureWidth,
+       textureHeight},
       {AnchorPosition::Right, AnchorPosition::Bottom},
-      {-std::floor(textureWidth / 2.0f), -std::floor(textureHeight / 2.0f)},
-      strokeWidth,
+      {-(borderWidths.right + borderRadii.bottomRight), -(borderWidths.bottom + borderRadii.bottomRight)},
+      {borderWidths.right + borderRadii.bottomRight, borderWidths.bottom + borderRadii.bottomRight},
+      {0, 0},
+      std::max(borderWidths.right, borderWidths.bottom),
       borderColors.right ? borderColors.right : borderColors.bottom,
       borderStyle);
 
   // Bottom Edge Border
   SetBorderLayerProperties(
       compContext,
-      spBorderLayers[8],
+      spBorderLayers[5],
       shape,
-      spTextures[8],
-      {cornerSize, textureHeight - cornerSize, textureWidth - cornerSize, textureHeight},
+      spTextures[5],
+      {borderWidths.left + borderRadii.bottomLeft,
+       textureHeight - borderWidths.bottom,
+       textureWidth - (borderWidths.right + borderRadii.bottomLeft),
+       textureHeight},
       {AnchorPosition::Left, AnchorPosition::Bottom},
-      {cornerSize, -cornerSize},
-      strokeWidth,
+      {borderWidths.left + borderRadii.bottomLeft, -borderWidths.bottom},
+      {-(borderWidths.right + borderRadii.bottomLeft + borderWidths.left + borderRadii.bottomLeft),
+       borderWidths.bottom},
+      {1.0f, 0.0f},
+      borderWidths.bottom,
       borderColors.bottom,
       borderStyle);
 
   // Bottom Left Corner Border
   SetBorderLayerProperties(
       compContext,
-      spBorderLayers[9],
-      shape,
-      spTextures[9],
-      {0, textureHeight - cornerSize, cornerSize, textureHeight},
-      {AnchorPosition::Left, AnchorPosition::Bottom},
-      {0, -cornerSize},
-      strokeWidth,
-      borderColors.left ? borderColors.left : borderColors.bottom,
-      borderStyle);
-
-  // Bottom Left Inset Corner Border
-  SetBorderLayerProperties(
-      compContext,
-      spBorderLayers[10],
+      spBorderLayers[6],
       shape,
-      spTextures[10],
-      {cornerSize,
-       std::floor(textureHeight / 2.0f),
-       std::ceil(textureWidth / 2.0f),
-       textureHeight - cornerSize /* - (textureHeight % 2)*/},
+      spTextures[6],
+      {0,
+       textureHeight - (borderWidths.bottom + borderRadii.bottomLeft),
+       borderWidths.left + borderRadii.bottomLeft,
+       textureHeight},
       {AnchorPosition::Left, AnchorPosition::Bottom},
-      {cornerSize, -std::floor(textureHeight / 2.0f)},
-      strokeWidth,
+      {0, -(borderWidths.bottom + borderRadii.bottomLeft)},
+      {borderWidths.left + borderRadii.bottomLeft, borderWidths.bottom + borderRadii.bottomLeft},
+      {0, 0},
+      std::max(borderWidths.left, borderWidths.bottom),
       borderColors.left ? borderColors.left : borderColors.bottom,
       borderStyle);
 
   // Left Edge Border
   SetBorderLayerProperties(
       compContext,
-      spBorderLayers[11],
+      spBorderLayers[7],
       shape,
-      spTextures[11],
-      {0, cornerSize, cornerSize, textureHeight - cornerSize},
+      spTextures[7],
+      {0,
+       borderWidths.top + borderRadii.topLeft,
+       borderWidths.left,
+       textureHeight - (borderWidths.bottom + borderRadii.bottomLeft)},
       {AnchorPosition::Left, AnchorPosition::Top},
-      {0, cornerSize},
-      strokeWidth,
+      {0, borderWidths.top + borderRadii.topLeft},
+      {borderWidths.left, -(borderWidths.top + borderRadii.topLeft + borderWidths.bottom + borderRadii.bottomLeft)},
+      {0, 1},
+      borderWidths.left,
       borderColors.left,
       borderStyle);
 }
@@ -827,7 +820,7 @@ facebook::react::BorderMetrics resolveAndAlignBorderMetrics(
 }
 
 bool CompositionBaseComponentView::TryUpdateSpecialBorderLayers(
-    std::array<winrt::Microsoft::ReactNative::Composition::SpriteVisual, 12> &spBorderVisuals,
+    std::array<winrt::Microsoft::ReactNative::Composition::SpriteVisual, SpecialBorderLayerCount> &spBorderVisuals,
     facebook::react::LayoutMetrics const &layoutMetrics,
     const facebook::react::ViewProps &viewProps) noexcept {
   auto borderMetrics = resolveAndAlignBorderMetrics(layoutMetrics, viewProps);
@@ -843,7 +836,7 @@ bool CompositionBaseComponentView::TryUpdateSpecialBorderLayers(
 
   // Create the special border layers if they don't exist yet
   if (!spBorderVisuals[0]) {
-    for (uint8_t i = 0; i < 12; i++) {
+    for (uint8_t i = 0; i < SpecialBorderLayerCount; i++) {
       auto visual = m_compContext.CreateSpriteVisual();
       Visual().InsertAt(visual, i);
       spBorderVisuals[i] = std::move(visual);
@@ -859,13 +852,11 @@ bool CompositionBaseComponentView::TryUpdateSpecialBorderLayers(
     if (borderStyle == facebook::react::BorderStyle::Dotted || borderStyle == facebook::react::BorderStyle::Dashed) {
       // Because in DirectX geometry starts at the center of the stroke, we need to deflate
       // rectangle by half the stroke width to render correctly.
-      float strokeCenteringOffset = borderMetrics.borderWidths.left / 2.0f;
-
       facebook::react::RectangleEdges<float> rectPathGeometry = {
-          strokeCenteringOffset,
-          strokeCenteringOffset,
-          extentWidth - strokeCenteringOffset,
-          extentHeight - strokeCenteringOffset};
+          borderMetrics.borderWidths.left / 2.0f,
+          borderMetrics.borderWidths.top / 2.0f,
+          extentWidth - borderMetrics.borderWidths.right / 2.0f,
+          extentHeight - borderMetrics.borderWidths.bottom / 2.0f};
 
       winrt::com_ptr<ID2D1PathGeometry> pathGeometry =
           GenerateRoundedRectPathGeometry(m_compContext, borderMetrics.borderRadii, {0, 0, 0, 0}, rectPathGeometry);
@@ -875,7 +866,8 @@ bool CompositionBaseComponentView::TryUpdateSpecialBorderLayers(
             m_compContext,
             spBorderVisuals,
             *pathGeometry,
-            borderMetrics.borderWidths.left,
+            borderMetrics.borderWidths,
+            borderMetrics.borderRadii,
             extentWidth,
             extentHeight,
             borderMetrics.borderColors,
@@ -897,7 +889,8 @@ bool CompositionBaseComponentView::TryUpdateSpecialBorderLayers(
           m_compContext,
           spBorderVisuals,
           *pathGeometry,
-          borderMetrics.borderWidths.left,
+          borderMetrics.borderWidths,
+          borderMetrics.borderRadii,
           extentWidth,
           extentHeight,
           borderMetrics.borderColors,
@@ -906,18 +899,17 @@ bool CompositionBaseComponentView::TryUpdateSpecialBorderLayers(
   } else {
     // Because in DirectX geometry starts at the center of the stroke, we need to deflate rectangle by half the stroke
     // width / height to render correctly.
-    float strokeCenteringOffsetX = (borderMetrics.borderWidths.left / 2.0f);
-    float strokeCenteringOffsetY = (borderMetrics.borderWidths.top / 2.0f);
     D2D1_RECT_F rectShape{
-        strokeCenteringOffsetX,
-        strokeCenteringOffsetY,
-        extentWidth - strokeCenteringOffsetX,
-        extentHeight - strokeCenteringOffsetY};
+        borderMetrics.borderWidths.left / 2.0f,
+        borderMetrics.borderWidths.top / 2.0f,
+        extentWidth - (borderMetrics.borderWidths.right / 2.0f),
+        extentHeight - (borderMetrics.borderWidths.bottom / 2.0f)};
     DrawAllBorderLayers(
         m_compContext,
         spBorderVisuals,
         rectShape,
-        borderMetrics.borderWidths.left,
+        borderMetrics.borderWidths,
+        borderMetrics.borderRadii,
         extentWidth,
         extentHeight,
         borderMetrics.borderColors,

package/Microsoft.ReactNative/Fabric/Composition/CompositionViewComponentView.h

@@ -19,6 +19,8 @@ CompositionBaseComponentView *GetFocusedComponent() noexcept;
 void SetFocusedComponent(CompositionBaseComponentView *value) noexcept;
 
 struct CompositionBaseComponentView : public IComponentView {
+  static constexpr size_t SpecialBorderLayerCount = 8;
+
   CompositionBaseComponentView(
       const winrt::Microsoft::ReactNative::Composition::ICompositionContext &compContext,
       facebook::react::Tag tag);
@@ -49,9 +51,10 @@ struct CompositionBaseComponentView : public IComponentView {
   virtual void OnRenderingDeviceLost() noexcept;
 
  protected:
-  std::array<winrt::Microsoft::ReactNative::Composition::SpriteVisual, 12> FindSpecialBorderLayers() const noexcept;
+  std::array<winrt::Microsoft::ReactNative::Composition::SpriteVisual, SpecialBorderLayerCount>
+  FindSpecialBorderLayers() const noexcept;
   bool TryUpdateSpecialBorderLayers(
-      std::array<winrt::Microsoft::ReactNative::Composition::SpriteVisual, 12> &spBorderVisuals,
+      std::array<winrt::Microsoft::ReactNative::Composition::SpriteVisual, SpecialBorderLayerCount> &spBorderVisuals,
       facebook::react::LayoutMetrics const &layoutMetrics,
       const facebook::react::ViewProps &viewProps) noexcept;
   void UpdateSpecialBorderLayers(
@@ -66,12 +69,6 @@ struct CompositionBaseComponentView : public IComponentView {
   facebook::react::LayoutMetrics m_layoutMetrics;
   bool m_needsBorderUpdate{false};
   uint8_t m_numBorderVisuals{0};
-
-  /*
-    winrt::Windows::UI::Composition::ShapeVisual m_borderVisual{nullptr};
-    winrt::Windows::UI::Composition::CompositionSpriteShape m_borderShape{nullptr};
-    winrt::Windows::UI::Composition::CompositionRoundedRectangleGeometry m_borderGeometry{nullptr};
-    */
 };
 
 struct CompositionViewComponentView : public CompositionBaseComponentView {

package/Microsoft.ReactNative/Utils/LocalBundleReader.cpp

@@ -76,14 +76,15 @@ std::future<std::string> LocalBundleReader::LoadBundleAsync(const std::string &b
   auto fileBuffer{co_await winrt::Windows::Storage::FileIO::ReadBufferAsync(file)};
   auto dataReader{winrt::Windows::Storage::Streams::DataReader::FromBuffer(fileBuffer)};
 
-  std::string script(fileBuffer.Length() + 1, '\0');
+  // No need to use length + 1, STL guarantees that string storage is null-terminated.
+  std::string script(fileBuffer.Length(), '\0');
 
   // Construct the array_view to slice into the first fileBuffer.Length bytes.
   // DataReader.ReadBytes will read as many bytes as are present in the
   // array_view. The backing string has fileBuffer.Length() + 1 bytes, without
   // an explicit end it will read 1 byte to many and throw.
   dataReader.ReadBytes(winrt::array_view<uint8_t>{
-      reinterpret_cast<uint8_t *>(&script[0]), reinterpret_cast<uint8_t *>(&script[script.length() - 1])});
+      reinterpret_cast<uint8_t *>(&script[0]), reinterpret_cast<uint8_t *>(&script[script.length()])});
   dataReader.Close();
 
   co_return script;

package/PropertySheets/Generated/PackageVersion.g.props

@@ -10,7 +10,7 @@
 -->
 <Project xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
   <PropertyGroup>
-    <ReactNativeWindowsVersion>0.0.0-canary.556</ReactNativeWindowsVersion>
+    <ReactNativeWindowsVersion>0.0.0-canary.558</ReactNativeWindowsVersion>
     <ReactNativeWindowsMajor>0</ReactNativeWindowsMajor>
     <ReactNativeWindowsMinor>0</ReactNativeWindowsMinor>
     <ReactNativeWindowsPatch>0</ReactNativeWindowsPatch>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-windows",
-  "version": "0.0.0-canary.556",
+  "version": "0.0.0-canary.558",
   "license": "MIT",
   "repository": {
     "type": "git",