From 5704ce1a11e199bd102cb2667061df5744383f95 Mon Sep 17 00:00:00 2001
From: Christopher Blackman <cblackman@microsoft.com>
Date: Thu, 21 Oct 2021 20:11:17 -0400
Subject: [PATCH 01/14] Additional null checks

---
 .../Shadows/AttachedShadowElementContext.cs              | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/Microsoft.Toolkit.Uwp.UI/Shadows/AttachedShadowElementContext.cs b/Microsoft.Toolkit.Uwp.UI/Shadows/AttachedShadowElementContext.cs
index 63afa4581e3..42e510539eb 100644
--- a/Microsoft.Toolkit.Uwp.UI/Shadows/AttachedShadowElementContext.cs
+++ b/Microsoft.Toolkit.Uwp.UI/Shadows/AttachedShadowElementContext.cs
@@ -137,10 +137,13 @@ private void Uninitialize()
 
             Parent.OnElementContextUninitialized(this);
 
-            SpriteVisual.Shadow = null;
-            SpriteVisual.Dispose();
+            if (SpriteVisual != null)
+            {
+                SpriteVisual.Shadow = null;
+                SpriteVisual.Dispose();
+            }
 
-            Shadow.Dispose();
+            Shadow?.Dispose();
 
             ElementCompositionPreview.SetElementChildVisual(Element, null);
 

From fded2edffade5d25cdbd70769fbef26604870101 Mon Sep 17 00:00:00 2001
From: Christopher Blackman <cblackman@microsoft.com>
Date: Wed, 27 Oct 2021 11:33:19 -0400
Subject: [PATCH 02/14] Add InnerContentClipMode

---
 .../Enums/InnerContentClipMode.cs             | 30 +++++++++++++++++++
 1 file changed, 30 insertions(+)
 create mode 100644 Microsoft.Toolkit.Uwp.UI.Media/Enums/InnerContentClipMode.cs

diff --git a/Microsoft.Toolkit.Uwp.UI.Media/Enums/InnerContentClipMode.cs b/Microsoft.Toolkit.Uwp.UI.Media/Enums/InnerContentClipMode.cs
new file mode 100644
index 00000000000..35eb4c9f4d6
--- /dev/null
+++ b/Microsoft.Toolkit.Uwp.UI.Media/Enums/InnerContentClipMode.cs
@@ -0,0 +1,30 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace Microsoft.Toolkit.Uwp.UI.Media
+{
+    /// <summary>
+    /// The method that shadows deriving from <see cref="AttachedCardShadowBase"/> use when clipping their inner content.
+    /// </summary>
+    public enum InnerContentClipMode
+    {
+        /// <summary>
+        /// Use <see cref="Windows.UI.Composition.CompositionMaskBrush"/> to clip inner content.
+        /// </summary>
+        /// <remarks>
+        /// This mode has better performance than <see cref="CompositionGeometricClip"/>.
+        /// </remarks>
+        CompositionMaskBrush,
+
+        /// <summary>
+        /// Use <see cref="Windows.UI.Composition.CompositionGeometricClip"/> to clip inner content.
+        /// </summary>
+        /// <remarks>
+        /// Content clipped in this mode will have smoother corners than when using <see cref="CompositionMaskBrush"/>.
+        /// </remarks>
+        CompositionGeometricClip
+    }
+}

From 136436f4ac79c928942312171304bef3219ef3fc Mon Sep 17 00:00:00 2001
From: Christopher Blackman <cblackman@microsoft.com>
Date: Wed, 27 Oct 2021 19:25:36 -0400
Subject: [PATCH 03/14] Remove unused code. Add InnerContentClipMode.None.

---
 Microsoft.Toolkit.Uwp.UI.Media/Enums/InnerContentClipMode.cs | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/Microsoft.Toolkit.Uwp.UI.Media/Enums/InnerContentClipMode.cs b/Microsoft.Toolkit.Uwp.UI.Media/Enums/InnerContentClipMode.cs
index 35eb4c9f4d6..aa06714d1f9 100644
--- a/Microsoft.Toolkit.Uwp.UI.Media/Enums/InnerContentClipMode.cs
+++ b/Microsoft.Toolkit.Uwp.UI.Media/Enums/InnerContentClipMode.cs
@@ -11,6 +11,11 @@ namespace Microsoft.Toolkit.Uwp.UI.Media
     /// </summary>
     public enum InnerContentClipMode
     {
+        /// <summary>
+        /// Do not clip inner content.
+        /// </summary>
+        None,
+
         /// <summary>
         /// Use <see cref="Windows.UI.Composition.CompositionMaskBrush"/> to clip inner content.
         /// </summary>

From aa9a7aebe8c86e9043ce08730aa5d7e4161969f0 Mon Sep 17 00:00:00 2001
From: Christopher Blackman <cblackman@microsoft.com>
Date: Fri, 5 Nov 2021 14:43:47 -0400
Subject: [PATCH 04/14] Fix NullReferenceException

---
 .../Shadows/AttachedShadowElementContext.cs                   | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/Microsoft.Toolkit.Uwp.UI/Shadows/AttachedShadowElementContext.cs b/Microsoft.Toolkit.Uwp.UI/Shadows/AttachedShadowElementContext.cs
index 42e510539eb..3c8e5d51e87 100644
--- a/Microsoft.Toolkit.Uwp.UI/Shadows/AttachedShadowElementContext.cs
+++ b/Microsoft.Toolkit.Uwp.UI/Shadows/AttachedShadowElementContext.cs
@@ -234,7 +234,7 @@ public T GetResource<T>(string key)
         /// <returns>The resource that was removed, if any</returns>
         public T RemoveResource<T>(string key)
         {
-            if (_resources.TryGetValue(key, out var objResource))
+            if (_resources != null && _resources.TryGetValue(key, out var objResource))
             {
                 _resources.Remove(key);
                 if (objResource is T resource)
@@ -255,7 +255,7 @@ public T RemoveResource<T>(string key)
         public T RemoveAndDisposeResource<T>(string key)
             where T : IDisposable
         {
-            if (_resources.TryGetValue(key, out var objResource))
+            if (_resources != null && _resources.TryGetValue(key, out var objResource))
             {
                 _resources.Remove(key);
                 if (objResource is T resource)

From 7c1da95dfeb26792d82099ccb62474ecc1d3be28 Mon Sep 17 00:00:00 2001
From: Christopher Blackman <cblackman@microsoft.com>
Date: Fri, 5 Nov 2021 16:43:25 -0400
Subject: [PATCH 05/14] Add InnerContentClipMode to sample

---
 .../SamplePages/Shadows/AttachedShadowWin2DXaml.bind           | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Shadows/AttachedShadowWin2DXaml.bind b/Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Shadows/AttachedShadowWin2DXaml.bind
index 84897111675..532452185da 100644
--- a/Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Shadows/AttachedShadowWin2DXaml.bind
+++ b/Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Shadows/AttachedShadowWin2DXaml.bind
@@ -37,7 +37,8 @@
                                     CornerRadius="32"
                                     Color="@[Color:Brush:Black]"
                                     Offset="@[Offset:Vector3:4,4]"
-                                    Opacity="@[Opacity:DoubleSlider:1.0:0.0-1.0]"/>
+                                    Opacity="@[Opacity:DoubleSlider:1.0:0.0-1.0]"
+                                    InnerContentClipMode="@[InnerContentClipMode:Enum:InnerContentClipMode.CompositionMaskBrush]"/>
         </ui:Effects.Shadow>
       </Rectangle>
       <!-- If you want to apply a shadow directly in your visual tree to an untemplated element

From 095c31568bb869a804c205260c8b8760f5e15229 Mon Sep 17 00:00:00 2001
From: Christopher Blackman <cblackman@microsoft.com>
Date: Mon, 15 Nov 2021 12:54:58 -0500
Subject: [PATCH 06/14] Set CompositionGeometricClip as the default clipping
 mode

---
 .../SamplePages/Shadows/AttachedShadowWin2DXaml.bind            | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Shadows/AttachedShadowWin2DXaml.bind b/Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Shadows/AttachedShadowWin2DXaml.bind
index 532452185da..fe083487e81 100644
--- a/Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Shadows/AttachedShadowWin2DXaml.bind
+++ b/Microsoft.Toolkit.Uwp.SampleApp/SamplePages/Shadows/AttachedShadowWin2DXaml.bind
@@ -38,7 +38,7 @@
                                     Color="@[Color:Brush:Black]"
                                     Offset="@[Offset:Vector3:4,4]"
                                     Opacity="@[Opacity:DoubleSlider:1.0:0.0-1.0]"
-                                    InnerContentClipMode="@[InnerContentClipMode:Enum:InnerContentClipMode.CompositionMaskBrush]"/>
+                                    InnerContentClipMode="@[InnerContentClipMode:Enum:InnerContentClipMode.CompositionGeometricClip]"/>
         </ui:Effects.Shadow>
       </Rectangle>
       <!-- If you want to apply a shadow directly in your visual tree to an untemplated element

From d90b89aac5db3477aef0b83b27c987824100578a Mon Sep 17 00:00:00 2001
From: Christopher Blackman <cblackman@microsoft.com>
Date: Tue, 23 Nov 2021 20:13:58 -0500
Subject: [PATCH 07/14] Don't inherit from AttachedCardShadowBase

---
 .../Enums/InnerContentClipMode.cs             |   2 +-
 .../Shadows/AttachedCardShadow.cs             | 211 +++++++++++++++---
 2 files changed, 176 insertions(+), 37 deletions(-)

diff --git a/Microsoft.Toolkit.Uwp.UI.Media/Enums/InnerContentClipMode.cs b/Microsoft.Toolkit.Uwp.UI.Media/Enums/InnerContentClipMode.cs
index aa06714d1f9..a4ec6eb3068 100644
--- a/Microsoft.Toolkit.Uwp.UI.Media/Enums/InnerContentClipMode.cs
+++ b/Microsoft.Toolkit.Uwp.UI.Media/Enums/InnerContentClipMode.cs
@@ -7,7 +7,7 @@
 namespace Microsoft.Toolkit.Uwp.UI.Media
 {
     /// <summary>
-    /// The method that shadows deriving from <see cref="AttachedCardShadowBase"/> use when clipping their inner content.
+    /// The method that each instance of <see cref="AttachedCardShadow"/> uses when clipping its inner content.
     /// </summary>
     public enum InnerContentClipMode
     {
diff --git a/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs b/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs
index 2373f7adac3..a15b35b21d8 100644
--- a/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs
+++ b/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs
@@ -8,6 +8,7 @@
 using Windows.UI;
 using Windows.UI.Composition;
 using Windows.UI.Xaml;
+using Windows.UI.Xaml.Hosting;
 
 namespace Microsoft.Toolkit.Uwp.UI.Media
 {
@@ -20,9 +21,18 @@ namespace Microsoft.Toolkit.Uwp.UI.Media
     public sealed class AttachedCardShadow : AttachedShadowBase
     {
         private const float MaxBlurRadius = 72;
-        private static readonly TypedResourceKey<CompositionGeometricClip> ClipResourceKey = "Clip";
 
+        private static readonly TypedResourceKey<CompositionGeometricClip> ClipResourceKey = "Clip";
         private static readonly TypedResourceKey<CompositionPathGeometry> PathGeometryResourceKey = "PathGeometry";
+        private static readonly TypedResourceKey<CompositionMaskBrush> OpacityMaskBrushResourceKey = "OpacityMask";
+        private static readonly TypedResourceKey<ShapeVisual> OpacityMaskShapeVisualResourceKey = "OpacityMaskShapeVisual";
+        private static readonly TypedResourceKey<CompositionRoundedRectangleGeometry> OpacityMaskGeometryResourceKey = "OpacityMaskGeometry";
+        private static readonly TypedResourceKey<CompositionSpriteShape> OpacityMaskSpriteShapeResourceKey = "OpacityMaskSpriteShape";
+        private static readonly TypedResourceKey<CompositionVisualSurface> OpacityMaskShapeVisualSurfaceResourceKey = "OpacityMaskShapeVisualSurface";
+        private static readonly TypedResourceKey<CompositionSurfaceBrush> OpacityMaskShapeVisualSurfaceBrushResourceKey = "OpacityMaskShapeVisualSurfaceBrush";
+        private static readonly TypedResourceKey<CompositionVisualSurface> OpacityMaskVisualSurfaceResourceKey = "OpacityMaskVisualSurface";
+        private static readonly TypedResourceKey<CompositionSurfaceBrush> OpacityMaskSurfaceBrushResourceKey = "OpacityMaskSurfaceBrush";
+        private static readonly TypedResourceKey<SpriteVisual> OpacityMaskVisualResourceKey = "OpacityMaskVisual";
         private static readonly TypedResourceKey<CompositionRoundedRectangleGeometry> RoundedRectangleGeometryResourceKey = "RoundedGeometry";
         private static readonly TypedResourceKey<CompositionSpriteShape> ShapeResourceKey = "Shape";
         private static readonly TypedResourceKey<ShapeVisual> ShapeVisualResourceKey = "ShapeVisual";
@@ -39,6 +49,16 @@ public sealed class AttachedCardShadow : AttachedShadowBase
                 typeof(AttachedCardShadow),
                 new PropertyMetadata(4d, OnDependencyPropertyChanged)); // Default WinUI ControlCornerRadius is 4
 
+        /// <summary>
+        /// The <see cref="DependencyProperty"/> for <see cref="InnerContentClipMode"/>.
+        /// </summary>
+        public static readonly DependencyProperty InnerContentClipModeProperty =
+            DependencyProperty.Register(
+                nameof(InnerContentClipMode),
+                typeof(InnerContentClipMode),
+                typeof(AttachedCardShadowBase),
+                new PropertyMetadata(InnerContentClipMode.CompositionGeometricClip, OnDependencyPropertyChanged));
+
         /// <summary>
         /// Gets or sets the roundness of the shadow's corners.
         /// </summary>
@@ -48,6 +68,15 @@ public double CornerRadius
             set => SetValue(CornerRadiusProperty, value);
         }
 
+        /// <summary>
+        /// Gets or sets the mode use to clip inner content from the shadow.
+        /// </summary>
+        public InnerContentClipMode InnerContentClipMode
+        {
+            get => (InnerContentClipMode)GetValue(InnerContentClipModeProperty);
+            set => SetValue(InnerContentClipModeProperty, value);
+        }
+
         /// <inheritdoc/>
         public override bool IsSupported => SupportsCompositionVisualSurface;
 
@@ -55,65 +84,109 @@ public double CornerRadius
         protected internal override bool SupportsOnSizeChangedEvent => true;
 
         /// <inheritdoc/>
-        protected override void OnPropertyChanged(AttachedShadowElementContext context, DependencyProperty property, object oldValue, object newValue)
+        protected internal override void OnElementContextInitialized(AttachedShadowElementContext context)
         {
-            if (property == CornerRadiusProperty)
+            UpdateVisualOpacityMask(context);
+            base.OnElementContextInitialized(context);
+        }
+
+        /// <inheritdoc/>
+        protected override void SetElementChildVisual(AttachedShadowElementContext context)
+        {
+            if (context.TryGetResource(OpacityMaskShapeVisualSurfaceBrushResourceKey, out var opacityMask))
             {
-                var geometry = context.GetResource(RoundedRectangleGeometryResourceKey);
-                if (geometry != null)
-                {
-                    geometry.CornerRadius = new Vector2((float)(double)newValue);
-                }
+                var visualSurface = context.GetResource(OpacityMaskVisualSurfaceResourceKey) ??
+                    context.AddResource(OpacityMaskVisualSurfaceResourceKey, context.Compositor.CreateVisualSurface());
+                visualSurface.SourceVisual = context.SpriteVisual;
+                context.SpriteVisual.RelativeSizeAdjustment = Vector2.Zero;
+                context.SpriteVisual.Size = new Vector2((float)context.Element.ActualWidth, (float)context.Element.ActualHeight);
+                visualSurface.SourceOffset = new Vector2(-MaxBlurRadius);
+                visualSurface.SourceSize = new Vector2((float)context.Element.ActualWidth, (float)context.Element.ActualHeight) + new Vector2(MaxBlurRadius * 2);
 
-                UpdateShadowClip(context);
+                var surfaceBrush = context.GetResource(OpacityMaskSurfaceBrushResourceKey) ??
+                    context.AddResource(OpacityMaskSurfaceBrushResourceKey, context.Compositor.CreateSurfaceBrush());
+                surfaceBrush.Surface = visualSurface;
+                surfaceBrush.Stretch = CompositionStretch.None;
+
+                CompositionMaskBrush maskBrush = context.GetResource(OpacityMaskBrushResourceKey) ??
+                    context.AddResource(OpacityMaskBrushResourceKey, context.Compositor.CreateMaskBrush());
+                maskBrush.Source = surfaceBrush;
+                maskBrush.Mask = opacityMask;
+
+                var visual = context.GetResource(OpacityMaskVisualResourceKey) ??
+                    context.AddResource(OpacityMaskVisualResourceKey, context.Compositor.CreateSpriteVisual());
+                visual.RelativeSizeAdjustment = Vector2.One;
+                visual.Offset = new Vector3(-MaxBlurRadius, -MaxBlurRadius, 0);
+                visual.Size = new Vector2(MaxBlurRadius * 2);
+                visual.Brush = maskBrush;
+                ElementCompositionPreview.SetElementChildVisual(context.Element, visual);
             }
             else
             {
-                base.OnPropertyChanged(context, property, oldValue, newValue);
+                base.SetElementChildVisual(context);
+                context.RemoveAndDisposeResource(OpacityMaskVisualSurfaceResourceKey);
+                context.RemoveAndDisposeResource(OpacityMaskSurfaceBrushResourceKey);
+                context.RemoveAndDisposeResource(OpacityMaskVisualResourceKey);
+                context.RemoveAndDisposeResource(OpacityMaskBrushResourceKey);
             }
         }
 
-        /// <inheritdoc/>
-        protected override CompositionBrush GetShadowMask(AttachedShadowElementContext context)
+        /// <summary>
+        /// Updates the <see cref="CompositionBrush"/> used to mask <paramref name="context"/>.<see cref="AttachedShadowElementContext.SpriteVisual">SpriteVisual</see>.
+        /// </summary>
+        /// <param name="context">The <see cref="AttachedShadowElementContext"/> whose <see cref="SpriteVisual"/> will be masked.</param>
+        private void UpdateVisualOpacityMask(AttachedShadowElementContext context)
         {
-            if (!SupportsCompositionVisualSurface)
+            if (InnerContentClipMode != InnerContentClipMode.CompositionMaskBrush)
             {
-                return null;
+                context.RemoveAndDisposeResource(OpacityMaskShapeVisualResourceKey);
+                context.RemoveAndDisposeResource(OpacityMaskGeometryResourceKey);
+                context.RemoveAndDisposeResource(OpacityMaskSpriteShapeResourceKey);
+                context.RemoveAndDisposeResource(OpacityMaskShapeVisualSurfaceResourceKey);
+                context.RemoveAndDisposeResource(OpacityMaskShapeVisualSurfaceBrushResourceKey);
+                return;
             }
 
-            // Create rounded rectangle geometry and add it to a shape
-            var geometry = context.GetResource(RoundedRectangleGeometryResourceKey) ?? context.AddResource(
-                RoundedRectangleGeometryResourceKey,
-                context.Compositor.CreateRoundedRectangleGeometry());
-            geometry.CornerRadius = new Vector2((float)CornerRadius);
+            var shapeVisual = context.GetResource(OpacityMaskShapeVisualResourceKey) ??
+                context.AddResource(OpacityMaskShapeVisualResourceKey, context.Compositor.CreateShapeVisual());
 
-            var shape = context.GetResource(ShapeResourceKey) ?? context.AddResource(ShapeResourceKey, context.Compositor.CreateSpriteShape(geometry));
-            shape.FillBrush = context.Compositor.CreateColorBrush(Colors.Black);
+            CompositionRoundedRectangleGeometry geom = context.GetResource(OpacityMaskGeometryResourceKey) ??
+                context.AddResource(OpacityMaskGeometryResourceKey, context.Compositor.CreateRoundedRectangleGeometry());
+            CompositionSpriteShape shape = context.GetResource(OpacityMaskSpriteShapeResourceKey) ??
+                context.AddResource(OpacityMaskSpriteShapeResourceKey, context.Compositor.CreateSpriteShape(geom));
 
-            // Create a ShapeVisual so that our geometry can be rendered to a visual
-            var shapeVisual = context.GetResource(ShapeVisualResourceKey) ??
-                              context.AddResource(ShapeVisualResourceKey, context.Compositor.CreateShapeVisual());
-            shapeVisual.Shapes.Add(shape);
+            geom.Offset = new Vector2(MaxBlurRadius / 2);
+            geom.CornerRadius = new Vector2((MaxBlurRadius / 2) + (float)CornerRadius);
+            shape.StrokeThickness = MaxBlurRadius;
+            shape.StrokeBrush = shape.StrokeBrush ?? context.Compositor.CreateColorBrush(Colors.Black);
 
-            // Create a CompositionVisualSurface, which renders our ShapeVisual to a texture
-            var visualSurface = context.GetResource(VisualSurfaceResourceKey) ??
-                                context.AddResource(VisualSurfaceResourceKey, context.Compositor.CreateVisualSurface());
-            visualSurface.SourceVisual = shapeVisual;
+            if (!shapeVisual.Shapes.Contains(shape))
+            {
+                shapeVisual.Shapes.Add(shape);
+            }
 
-            // Create a CompositionSurfaceBrush to render our CompositionVisualSurface to a brush.
-            // Now we have a rounded rectangle brush that can be used on as the mask for our shadow.
-            var surfaceBrush = context.GetResource(SurfaceBrushResourceKey) ?? context.AddResource(
-                SurfaceBrushResourceKey,
-                context.Compositor.CreateSurfaceBrush(visualSurface));
+            var visualSurface = context.GetResource(OpacityMaskShapeVisualSurfaceResourceKey) ??
+                context.AddResource(OpacityMaskShapeVisualSurfaceResourceKey, context.Compositor.CreateVisualSurface());
+            visualSurface.SourceVisual = shapeVisual;
 
-            geometry.Size = visualSurface.SourceSize = shapeVisual.Size = context.Element.RenderSize.ToVector2();
+            geom.Size = new Vector2((float)context.Element.ActualWidth, (float)context.Element.ActualHeight) + new Vector2(MaxBlurRadius);
+            shapeVisual.Size = visualSurface.SourceSize = new Vector2((float)context.Element.ActualWidth, (float)context.Element.ActualHeight) + new Vector2(MaxBlurRadius * 2);
 
-            return surfaceBrush;
+            var surfaceBrush = context.GetResource(OpacityMaskShapeVisualSurfaceBrushResourceKey) ??
+                context.AddResource(OpacityMaskShapeVisualSurfaceBrushResourceKey, context.Compositor.CreateSurfaceBrush());
+            surfaceBrush.Surface = visualSurface;
         }
 
         /// <inheritdoc/>
         protected override CompositionClip GetShadowClip(AttachedShadowElementContext context)
         {
+            if (InnerContentClipMode != InnerContentClipMode.CompositionGeometricClip)
+            {
+                context.RemoveAndDisposeResource(PathGeometryResourceKey);
+                context.RemoveAndDisposeResource(ClipResourceKey);
+                return null;
+            }
+
             // The way this shadow works without the need to project on another element is because
             // we're clipping the inner part of the shadow which would be cast on the element
             // itself away. This method is creating an outline so that we are only showing the
@@ -145,6 +218,72 @@ protected override CompositionClip GetShadowClip(AttachedShadowElementContext co
         }
 
         /// <inheritdoc/>
+        protected override CompositionBrush GetShadowMask(AttachedShadowElementContext context)
+        {
+            if (!SupportsCompositionVisualSurface)
+            {
+                return null;
+            }
+
+            // Create rounded rectangle geometry and add it to a shape
+            var geometry = context.GetResource(RoundedRectangleGeometryResourceKey) ?? context.AddResource(
+                RoundedRectangleGeometryResourceKey,
+                context.Compositor.CreateRoundedRectangleGeometry());
+            geometry.CornerRadius = new Vector2((float)CornerRadius);
+
+            var shape = context.GetResource(ShapeResourceKey) ?? context.AddResource(ShapeResourceKey, context.Compositor.CreateSpriteShape(geometry));
+            shape.FillBrush = context.Compositor.CreateColorBrush(Colors.Black);
+
+            // Create a ShapeVisual so that our geometry can be rendered to a visual
+            var shapeVisual = context.GetResource(ShapeVisualResourceKey) ??
+                              context.AddResource(ShapeVisualResourceKey, context.Compositor.CreateShapeVisual());
+            shapeVisual.Shapes.Add(shape);
+
+            // Create a CompositionVisualSurface, which renders our ShapeVisual to a texture
+            var visualSurface = context.GetResource(VisualSurfaceResourceKey) ??
+                                context.AddResource(VisualSurfaceResourceKey, context.Compositor.CreateVisualSurface());
+            visualSurface.SourceVisual = shapeVisual;
+
+            // Create a CompositionSurfaceBrush to render our CompositionVisualSurface to a brush.
+            // Now we have a rounded rectangle brush that can be used on as the mask for our shadow.
+            var surfaceBrush = context.GetResource(SurfaceBrushResourceKey) ?? context.AddResource(
+                SurfaceBrushResourceKey,
+                context.Compositor.CreateSurfaceBrush(visualSurface));
+
+            geometry.Size = visualSurface.SourceSize = shapeVisual.Size = context.Element.RenderSize.ToVector2();
+
+            return surfaceBrush;
+        }
+
+        /// <inheritdoc/>
+        protected override void OnPropertyChanged(AttachedShadowElementContext context, DependencyProperty property, object oldValue, object newValue)
+        {
+            if (property == CornerRadiusProperty)
+            {
+                UpdateShadowClip(context);
+                UpdateVisualOpacityMask(context);
+
+                var geometry = context.GetResource(RoundedRectangleGeometryResourceKey);
+                if (geometry != null)
+                {
+                    geometry.CornerRadius = new Vector2((float)(double)newValue);
+                }
+            }
+            else if (property == InnerContentClipModeProperty)
+            {
+                UpdateShadowClip(context);
+                UpdateVisualOpacityMask(context);
+                SetElementChildVisual(context);
+            }
+            else
+            {
+                base.OnPropertyChanged(context, property, oldValue, newValue);
+            }
+
+            base.OnPropertyChanged(context, property, oldValue, newValue);
+        }
+
+        /// <inheritdoc />
         protected internal override void OnSizeChanged(AttachedShadowElementContext context, Size newSize, Size previousSize)
         {
             var sizeAsVec2 = newSize.ToVector2();

From 2c870ee28535ee527228c8ce4ca81304f00bea63 Mon Sep 17 00:00:00 2001
From: Christopher Blackman <cblackman@microsoft.com>
Date: Tue, 23 Nov 2021 20:57:45 -0500
Subject: [PATCH 08/14] Rearrange elements

---
 .../Shadows/AttachedCardShadow.cs             | 218 +++++++++---------
 1 file changed, 109 insertions(+), 109 deletions(-)

diff --git a/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs b/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs
index a15b35b21d8..67391550278 100644
--- a/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs
+++ b/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs
@@ -91,90 +91,69 @@ protected internal override void OnElementContextInitialized(AttachedShadowEleme
         }
 
         /// <inheritdoc/>
-        protected override void SetElementChildVisual(AttachedShadowElementContext context)
+        protected override void OnPropertyChanged(AttachedShadowElementContext context, DependencyProperty property, object oldValue, object newValue)
         {
-            if (context.TryGetResource(OpacityMaskShapeVisualSurfaceBrushResourceKey, out var opacityMask))
+            if (property == CornerRadiusProperty)
             {
-                var visualSurface = context.GetResource(OpacityMaskVisualSurfaceResourceKey) ??
-                    context.AddResource(OpacityMaskVisualSurfaceResourceKey, context.Compositor.CreateVisualSurface());
-                visualSurface.SourceVisual = context.SpriteVisual;
-                context.SpriteVisual.RelativeSizeAdjustment = Vector2.Zero;
-                context.SpriteVisual.Size = new Vector2((float)context.Element.ActualWidth, (float)context.Element.ActualHeight);
-                visualSurface.SourceOffset = new Vector2(-MaxBlurRadius);
-                visualSurface.SourceSize = new Vector2((float)context.Element.ActualWidth, (float)context.Element.ActualHeight) + new Vector2(MaxBlurRadius * 2);
-
-                var surfaceBrush = context.GetResource(OpacityMaskSurfaceBrushResourceKey) ??
-                    context.AddResource(OpacityMaskSurfaceBrushResourceKey, context.Compositor.CreateSurfaceBrush());
-                surfaceBrush.Surface = visualSurface;
-                surfaceBrush.Stretch = CompositionStretch.None;
-
-                CompositionMaskBrush maskBrush = context.GetResource(OpacityMaskBrushResourceKey) ??
-                    context.AddResource(OpacityMaskBrushResourceKey, context.Compositor.CreateMaskBrush());
-                maskBrush.Source = surfaceBrush;
-                maskBrush.Mask = opacityMask;
+                UpdateShadowClip(context);
+                UpdateVisualOpacityMask(context);
 
-                var visual = context.GetResource(OpacityMaskVisualResourceKey) ??
-                    context.AddResource(OpacityMaskVisualResourceKey, context.Compositor.CreateSpriteVisual());
-                visual.RelativeSizeAdjustment = Vector2.One;
-                visual.Offset = new Vector3(-MaxBlurRadius, -MaxBlurRadius, 0);
-                visual.Size = new Vector2(MaxBlurRadius * 2);
-                visual.Brush = maskBrush;
-                ElementCompositionPreview.SetElementChildVisual(context.Element, visual);
+                var geometry = context.GetResource(RoundedRectangleGeometryResourceKey);
+                if (geometry != null)
+                {
+                    geometry.CornerRadius = new Vector2((float)(double)newValue);
+                }
+            }
+            else if (property == InnerContentClipModeProperty)
+            {
+                UpdateShadowClip(context);
+                UpdateVisualOpacityMask(context);
+                SetElementChildVisual(context);
             }
             else
             {
-                base.SetElementChildVisual(context);
-                context.RemoveAndDisposeResource(OpacityMaskVisualSurfaceResourceKey);
-                context.RemoveAndDisposeResource(OpacityMaskSurfaceBrushResourceKey);
-                context.RemoveAndDisposeResource(OpacityMaskVisualResourceKey);
-                context.RemoveAndDisposeResource(OpacityMaskBrushResourceKey);
+                base.OnPropertyChanged(context, property, oldValue, newValue);
             }
+
+            base.OnPropertyChanged(context, property, oldValue, newValue);
         }
 
-        /// <summary>
-        /// Updates the <see cref="CompositionBrush"/> used to mask <paramref name="context"/>.<see cref="AttachedShadowElementContext.SpriteVisual">SpriteVisual</see>.
-        /// </summary>
-        /// <param name="context">The <see cref="AttachedShadowElementContext"/> whose <see cref="SpriteVisual"/> will be masked.</param>
-        private void UpdateVisualOpacityMask(AttachedShadowElementContext context)
+        /// <inheritdoc/>
+        protected override CompositionBrush GetShadowMask(AttachedShadowElementContext context)
         {
-            if (InnerContentClipMode != InnerContentClipMode.CompositionMaskBrush)
+            if (!SupportsCompositionVisualSurface)
             {
-                context.RemoveAndDisposeResource(OpacityMaskShapeVisualResourceKey);
-                context.RemoveAndDisposeResource(OpacityMaskGeometryResourceKey);
-                context.RemoveAndDisposeResource(OpacityMaskSpriteShapeResourceKey);
-                context.RemoveAndDisposeResource(OpacityMaskShapeVisualSurfaceResourceKey);
-                context.RemoveAndDisposeResource(OpacityMaskShapeVisualSurfaceBrushResourceKey);
-                return;
+                return null;
             }
 
-            var shapeVisual = context.GetResource(OpacityMaskShapeVisualResourceKey) ??
-                context.AddResource(OpacityMaskShapeVisualResourceKey, context.Compositor.CreateShapeVisual());
-
-            CompositionRoundedRectangleGeometry geom = context.GetResource(OpacityMaskGeometryResourceKey) ??
-                context.AddResource(OpacityMaskGeometryResourceKey, context.Compositor.CreateRoundedRectangleGeometry());
-            CompositionSpriteShape shape = context.GetResource(OpacityMaskSpriteShapeResourceKey) ??
-                context.AddResource(OpacityMaskSpriteShapeResourceKey, context.Compositor.CreateSpriteShape(geom));
+            // Create rounded rectangle geometry and add it to a shape
+            var geometry = context.GetResource(RoundedRectangleGeometryResourceKey) ?? context.AddResource(
+                RoundedRectangleGeometryResourceKey,
+                context.Compositor.CreateRoundedRectangleGeometry());
+            geometry.CornerRadius = new Vector2((float)CornerRadius);
 
-            geom.Offset = new Vector2(MaxBlurRadius / 2);
-            geom.CornerRadius = new Vector2((MaxBlurRadius / 2) + (float)CornerRadius);
-            shape.StrokeThickness = MaxBlurRadius;
-            shape.StrokeBrush = shape.StrokeBrush ?? context.Compositor.CreateColorBrush(Colors.Black);
+            var shape = context.GetResource(ShapeResourceKey) ?? context.AddResource(ShapeResourceKey, context.Compositor.CreateSpriteShape(geometry));
+            shape.FillBrush = context.Compositor.CreateColorBrush(Colors.Black);
 
-            if (!shapeVisual.Shapes.Contains(shape))
-            {
-                shapeVisual.Shapes.Add(shape);
-            }
+            // Create a ShapeVisual so that our geometry can be rendered to a visual
+            var shapeVisual = context.GetResource(ShapeVisualResourceKey) ??
+                              context.AddResource(ShapeVisualResourceKey, context.Compositor.CreateShapeVisual());
+            shapeVisual.Shapes.Add(shape);
 
-            var visualSurface = context.GetResource(OpacityMaskShapeVisualSurfaceResourceKey) ??
-                context.AddResource(OpacityMaskShapeVisualSurfaceResourceKey, context.Compositor.CreateVisualSurface());
+            // Create a CompositionVisualSurface, which renders our ShapeVisual to a texture
+            var visualSurface = context.GetResource(VisualSurfaceResourceKey) ??
+                                context.AddResource(VisualSurfaceResourceKey, context.Compositor.CreateVisualSurface());
             visualSurface.SourceVisual = shapeVisual;
 
-            geom.Size = new Vector2((float)context.Element.ActualWidth, (float)context.Element.ActualHeight) + new Vector2(MaxBlurRadius);
-            shapeVisual.Size = visualSurface.SourceSize = new Vector2((float)context.Element.ActualWidth, (float)context.Element.ActualHeight) + new Vector2(MaxBlurRadius * 2);
+            // Create a CompositionSurfaceBrush to render our CompositionVisualSurface to a brush.
+            // Now we have a rounded rectangle brush that can be used on as the mask for our shadow.
+            var surfaceBrush = context.GetResource(SurfaceBrushResourceKey) ?? context.AddResource(
+                SurfaceBrushResourceKey,
+                context.Compositor.CreateSurfaceBrush(visualSurface));
 
-            var surfaceBrush = context.GetResource(OpacityMaskShapeVisualSurfaceBrushResourceKey) ??
-                context.AddResource(OpacityMaskShapeVisualSurfaceBrushResourceKey, context.Compositor.CreateSurfaceBrush());
-            surfaceBrush.Surface = visualSurface;
+            geometry.Size = visualSurface.SourceSize = shapeVisual.Size = context.Element.RenderSize.ToVector2();
+
+            return surfaceBrush;
         }
 
         /// <inheritdoc/>
@@ -217,70 +196,91 @@ protected override CompositionClip GetShadowClip(AttachedShadowElementContext co
             return clip;
         }
 
-        /// <inheritdoc/>
-        protected override CompositionBrush GetShadowMask(AttachedShadowElementContext context)
+        /// <summary>
+        /// Updates the <see cref="CompositionBrush"/> used to mask <paramref name="context"/>.<see cref="AttachedShadowElementContext.SpriteVisual">SpriteVisual</see>.
+        /// </summary>
+        /// <param name="context">The <see cref="AttachedShadowElementContext"/> whose <see cref="SpriteVisual"/> will be masked.</param>
+        private void UpdateVisualOpacityMask(AttachedShadowElementContext context)
         {
-            if (!SupportsCompositionVisualSurface)
+            if (InnerContentClipMode != InnerContentClipMode.CompositionMaskBrush)
             {
-                return null;
+                context.RemoveAndDisposeResource(OpacityMaskShapeVisualResourceKey);
+                context.RemoveAndDisposeResource(OpacityMaskGeometryResourceKey);
+                context.RemoveAndDisposeResource(OpacityMaskSpriteShapeResourceKey);
+                context.RemoveAndDisposeResource(OpacityMaskShapeVisualSurfaceResourceKey);
+                context.RemoveAndDisposeResource(OpacityMaskShapeVisualSurfaceBrushResourceKey);
+                return;
             }
 
-            // Create rounded rectangle geometry and add it to a shape
-            var geometry = context.GetResource(RoundedRectangleGeometryResourceKey) ?? context.AddResource(
-                RoundedRectangleGeometryResourceKey,
-                context.Compositor.CreateRoundedRectangleGeometry());
-            geometry.CornerRadius = new Vector2((float)CornerRadius);
+            var shapeVisual = context.GetResource(OpacityMaskShapeVisualResourceKey) ??
+                context.AddResource(OpacityMaskShapeVisualResourceKey, context.Compositor.CreateShapeVisual());
 
-            var shape = context.GetResource(ShapeResourceKey) ?? context.AddResource(ShapeResourceKey, context.Compositor.CreateSpriteShape(geometry));
-            shape.FillBrush = context.Compositor.CreateColorBrush(Colors.Black);
+            CompositionRoundedRectangleGeometry geom = context.GetResource(OpacityMaskGeometryResourceKey) ??
+                context.AddResource(OpacityMaskGeometryResourceKey, context.Compositor.CreateRoundedRectangleGeometry());
+            CompositionSpriteShape shape = context.GetResource(OpacityMaskSpriteShapeResourceKey) ??
+                context.AddResource(OpacityMaskSpriteShapeResourceKey, context.Compositor.CreateSpriteShape(geom));
 
-            // Create a ShapeVisual so that our geometry can be rendered to a visual
-            var shapeVisual = context.GetResource(ShapeVisualResourceKey) ??
-                              context.AddResource(ShapeVisualResourceKey, context.Compositor.CreateShapeVisual());
-            shapeVisual.Shapes.Add(shape);
+            geom.Offset = new Vector2(MaxBlurRadius / 2);
+            geom.CornerRadius = new Vector2((MaxBlurRadius / 2) + (float)CornerRadius);
+            shape.StrokeThickness = MaxBlurRadius;
+            shape.StrokeBrush = shape.StrokeBrush ?? context.Compositor.CreateColorBrush(Colors.Black);
 
-            // Create a CompositionVisualSurface, which renders our ShapeVisual to a texture
-            var visualSurface = context.GetResource(VisualSurfaceResourceKey) ??
-                                context.AddResource(VisualSurfaceResourceKey, context.Compositor.CreateVisualSurface());
-            visualSurface.SourceVisual = shapeVisual;
+            if (!shapeVisual.Shapes.Contains(shape))
+            {
+                shapeVisual.Shapes.Add(shape);
+            }
 
-            // Create a CompositionSurfaceBrush to render our CompositionVisualSurface to a brush.
-            // Now we have a rounded rectangle brush that can be used on as the mask for our shadow.
-            var surfaceBrush = context.GetResource(SurfaceBrushResourceKey) ?? context.AddResource(
-                SurfaceBrushResourceKey,
-                context.Compositor.CreateSurfaceBrush(visualSurface));
+            var visualSurface = context.GetResource(OpacityMaskShapeVisualSurfaceResourceKey) ??
+                context.AddResource(OpacityMaskShapeVisualSurfaceResourceKey, context.Compositor.CreateVisualSurface());
+            visualSurface.SourceVisual = shapeVisual;
 
-            geometry.Size = visualSurface.SourceSize = shapeVisual.Size = context.Element.RenderSize.ToVector2();
+            geom.Size = new Vector2((float)context.Element.ActualWidth, (float)context.Element.ActualHeight) + new Vector2(MaxBlurRadius);
+            shapeVisual.Size = visualSurface.SourceSize = new Vector2((float)context.Element.ActualWidth, (float)context.Element.ActualHeight) + new Vector2(MaxBlurRadius * 2);
 
-            return surfaceBrush;
+            var surfaceBrush = context.GetResource(OpacityMaskShapeVisualSurfaceBrushResourceKey) ??
+                context.AddResource(OpacityMaskShapeVisualSurfaceBrushResourceKey, context.Compositor.CreateSurfaceBrush());
+            surfaceBrush.Surface = visualSurface;
         }
 
         /// <inheritdoc/>
-        protected override void OnPropertyChanged(AttachedShadowElementContext context, DependencyProperty property, object oldValue, object newValue)
+        protected override void SetElementChildVisual(AttachedShadowElementContext context)
         {
-            if (property == CornerRadiusProperty)
+            if (context.TryGetResource(OpacityMaskShapeVisualSurfaceBrushResourceKey, out var opacityMask))
             {
-                UpdateShadowClip(context);
-                UpdateVisualOpacityMask(context);
+                var visualSurface = context.GetResource(OpacityMaskVisualSurfaceResourceKey) ??
+                    context.AddResource(OpacityMaskVisualSurfaceResourceKey, context.Compositor.CreateVisualSurface());
+                visualSurface.SourceVisual = context.SpriteVisual;
+                context.SpriteVisual.RelativeSizeAdjustment = Vector2.Zero;
+                context.SpriteVisual.Size = new Vector2((float)context.Element.ActualWidth, (float)context.Element.ActualHeight);
+                visualSurface.SourceOffset = new Vector2(-MaxBlurRadius);
+                visualSurface.SourceSize = new Vector2((float)context.Element.ActualWidth, (float)context.Element.ActualHeight) + new Vector2(MaxBlurRadius * 2);
 
-                var geometry = context.GetResource(RoundedRectangleGeometryResourceKey);
-                if (geometry != null)
-                {
-                    geometry.CornerRadius = new Vector2((float)(double)newValue);
-                }
-            }
-            else if (property == InnerContentClipModeProperty)
-            {
-                UpdateShadowClip(context);
-                UpdateVisualOpacityMask(context);
-                SetElementChildVisual(context);
+                var surfaceBrush = context.GetResource(OpacityMaskSurfaceBrushResourceKey) ??
+                    context.AddResource(OpacityMaskSurfaceBrushResourceKey, context.Compositor.CreateSurfaceBrush());
+                surfaceBrush.Surface = visualSurface;
+                surfaceBrush.Stretch = CompositionStretch.None;
+
+                CompositionMaskBrush maskBrush = context.GetResource(OpacityMaskBrushResourceKey) ??
+                    context.AddResource(OpacityMaskBrushResourceKey, context.Compositor.CreateMaskBrush());
+                maskBrush.Source = surfaceBrush;
+                maskBrush.Mask = opacityMask;
+
+                var visual = context.GetResource(OpacityMaskVisualResourceKey) ??
+                    context.AddResource(OpacityMaskVisualResourceKey, context.Compositor.CreateSpriteVisual());
+                visual.RelativeSizeAdjustment = Vector2.One;
+                visual.Offset = new Vector3(-MaxBlurRadius, -MaxBlurRadius, 0);
+                visual.Size = new Vector2(MaxBlurRadius * 2);
+                visual.Brush = maskBrush;
+                ElementCompositionPreview.SetElementChildVisual(context.Element, visual);
             }
             else
             {
-                base.OnPropertyChanged(context, property, oldValue, newValue);
+                base.SetElementChildVisual(context);
+                context.RemoveAndDisposeResource(OpacityMaskVisualSurfaceResourceKey);
+                context.RemoveAndDisposeResource(OpacityMaskSurfaceBrushResourceKey);
+                context.RemoveAndDisposeResource(OpacityMaskVisualResourceKey);
+                context.RemoveAndDisposeResource(OpacityMaskBrushResourceKey);
             }
-
-            base.OnPropertyChanged(context, property, oldValue, newValue);
         }
 
         /// <inheritdoc />

From 169e296e3e3f055d76b93bdf42cc58d5761990ba Mon Sep 17 00:00:00 2001
From: Christopher Blackman <cblackman@microsoft.com>
Date: Wed, 24 Nov 2021 12:01:20 -0500
Subject: [PATCH 09/14] Add comment.

---
 Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs b/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs
index 67391550278..4d747276667 100644
--- a/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs
+++ b/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs
@@ -212,6 +212,10 @@ private void UpdateVisualOpacityMask(AttachedShadowElementContext context)
                 return;
             }
 
+            // Create a rounded rectangle Visual with a thick outline and no fill, then use a VisualSurface of it as an opacity mask for the shadow.
+            // This will have the effect of clipping the inner content of the shadow, so that the casting element is not covered by the shadow,
+            // while the shadow is still rendered outside of the element. Similar to what takes place in GetVisualClip,
+            // except here we use a brush to mask content instead of a pure geometric clip.
             var shapeVisual = context.GetResource(OpacityMaskShapeVisualResourceKey) ??
                 context.AddResource(OpacityMaskShapeVisualResourceKey, context.Compositor.CreateShapeVisual());
 

From 0809907dce4be08cadebd3feaeb1cfa371ab6d3d Mon Sep 17 00:00:00 2001
From: Christopher Blackman <cblackman@microsoft.com>
Date: Mon, 29 Nov 2021 20:10:40 -0500
Subject: [PATCH 10/14] Add header

---
 Microsoft.Toolkit.Uwp.UI.Media/Enums/InnerContentClipMode.cs | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/Microsoft.Toolkit.Uwp.UI.Media/Enums/InnerContentClipMode.cs b/Microsoft.Toolkit.Uwp.UI.Media/Enums/InnerContentClipMode.cs
index a4ec6eb3068..1c5518f6b5d 100644
--- a/Microsoft.Toolkit.Uwp.UI.Media/Enums/InnerContentClipMode.cs
+++ b/Microsoft.Toolkit.Uwp.UI.Media/Enums/InnerContentClipMode.cs
@@ -1,3 +1,7 @@
+// Licensed to the .NET Foundation under one or more agreements.
+// The .NET Foundation licenses this file to you under the MIT license.
+// See the LICENSE file in the project root for more information.
+
 using System;
 using System.Collections.Generic;
 using System.Linq;

From d2c13d0f996e1bdd8c20221bbea88593b9a32224 Mon Sep 17 00:00:00 2001
From: Christopher Blackman <cblackman@microsoft.com>
Date: Tue, 5 Apr 2022 20:40:49 -0400
Subject: [PATCH 11/14] Update AttachedCardShadow.cs

Fix DependencyProperty registration
---
 Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs b/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs
index 4d747276667..633a452a62e 100644
--- a/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs
+++ b/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs
@@ -56,7 +56,7 @@ public sealed class AttachedCardShadow : AttachedShadowBase
             DependencyProperty.Register(
                 nameof(InnerContentClipMode),
                 typeof(InnerContentClipMode),
-                typeof(AttachedCardShadowBase),
+                typeof(AttachedCardShadow),
                 new PropertyMetadata(InnerContentClipMode.CompositionGeometricClip, OnDependencyPropertyChanged));
 
         /// <summary>

From b6cf5c1d8d22ff17cc8a0df189dfe5f826639b45 Mon Sep 17 00:00:00 2001
From: Christopher Blackman <cblackman@microsoft.com>
Date: Tue, 5 Apr 2022 20:43:21 -0400
Subject: [PATCH 12/14] Update AttachedCardShadow.cs

Remove extra OnPropertyChanged call
---
 Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs | 2 --
 1 file changed, 2 deletions(-)

diff --git a/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs b/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs
index 633a452a62e..3d99db27d19 100644
--- a/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs
+++ b/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs
@@ -114,8 +114,6 @@ protected override void OnPropertyChanged(AttachedShadowElementContext context,
             {
                 base.OnPropertyChanged(context, property, oldValue, newValue);
             }
-
-            base.OnPropertyChanged(context, property, oldValue, newValue);
         }
 
         /// <inheritdoc/>

From 555d6e9f1534c2be00a70f2ef517a6b98d145826 Mon Sep 17 00:00:00 2001
From: Christopher Blackman <cblackman@microsoft.com>
Date: Mon, 9 May 2022 19:05:28 -0400
Subject: [PATCH 13/14] Add comments to AttachedCardShadow

---
 .../Shadows/AttachedCardShadow.cs             | 69 +++++++++++--------
 1 file changed, 42 insertions(+), 27 deletions(-)

diff --git a/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs b/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs
index 3d99db27d19..c436975df70 100644
--- a/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs
+++ b/Microsoft.Toolkit.Uwp.UI.Media/Shadows/AttachedCardShadow.cs
@@ -210,20 +210,20 @@ private void UpdateVisualOpacityMask(AttachedShadowElementContext context)
                 return;
             }
 
-            // Create a rounded rectangle Visual with a thick outline and no fill, then use a VisualSurface of it as an opacity mask for the shadow.
-            // This will have the effect of clipping the inner content of the shadow, so that the casting element is not covered by the shadow,
-            // while the shadow is still rendered outside of the element. Similar to what takes place in GetVisualClip,
-            // except here we use a brush to mask content instead of a pure geometric clip.
-            var shapeVisual = context.GetResource(OpacityMaskShapeVisualResourceKey) ??
+            // Create ShapeVisual, and CompositionSpriteShape with geometry, these will provide the visuals for the opacity mask.
+            ShapeVisual shapeVisual = context.GetResource(OpacityMaskShapeVisualResourceKey) ??
                 context.AddResource(OpacityMaskShapeVisualResourceKey, context.Compositor.CreateShapeVisual());
 
-            CompositionRoundedRectangleGeometry geom = context.GetResource(OpacityMaskGeometryResourceKey) ??
+            CompositionRoundedRectangleGeometry geometry = context.GetResource(OpacityMaskGeometryResourceKey) ??
                 context.AddResource(OpacityMaskGeometryResourceKey, context.Compositor.CreateRoundedRectangleGeometry());
             CompositionSpriteShape shape = context.GetResource(OpacityMaskSpriteShapeResourceKey) ??
-                context.AddResource(OpacityMaskSpriteShapeResourceKey, context.Compositor.CreateSpriteShape(geom));
+                context.AddResource(OpacityMaskSpriteShapeResourceKey, context.Compositor.CreateSpriteShape(geometry));
 
-            geom.Offset = new Vector2(MaxBlurRadius / 2);
-            geom.CornerRadius = new Vector2((MaxBlurRadius / 2) + (float)CornerRadius);
+            // Set the attributes of the geometry, and add the CompositionSpriteShape to the ShapeVisual.
+            // The geometry will have a thick outline and no fill, meaning that when used as a mask,
+            // the shadow will only be rendered on the outer area covered by the outline, clipping out its inner portion.
+            geometry.Offset = new Vector2(MaxBlurRadius / 2);
+            geometry.CornerRadius = new Vector2((MaxBlurRadius / 2) + (float)CornerRadius);
             shape.StrokeThickness = MaxBlurRadius;
             shape.StrokeBrush = shape.StrokeBrush ?? context.Compositor.CreateColorBrush(Colors.Black);
 
@@ -232,42 +232,57 @@ private void UpdateVisualOpacityMask(AttachedShadowElementContext context)
                 shapeVisual.Shapes.Add(shape);
             }
 
-            var visualSurface = context.GetResource(OpacityMaskShapeVisualSurfaceResourceKey) ??
+            // Create CompositionVisualSurface using the ShapeVisual as the source visual.
+            CompositionVisualSurface visualSurface = context.GetResource(OpacityMaskShapeVisualSurfaceResourceKey) ??
                 context.AddResource(OpacityMaskShapeVisualSurfaceResourceKey, context.Compositor.CreateVisualSurface());
             visualSurface.SourceVisual = shapeVisual;
 
-            geom.Size = new Vector2((float)context.Element.ActualWidth, (float)context.Element.ActualHeight) + new Vector2(MaxBlurRadius);
+            geometry.Size = new Vector2((float)context.Element.ActualWidth, (float)context.Element.ActualHeight) + new Vector2(MaxBlurRadius);
             shapeVisual.Size = visualSurface.SourceSize = new Vector2((float)context.Element.ActualWidth, (float)context.Element.ActualHeight) + new Vector2(MaxBlurRadius * 2);
 
-            var surfaceBrush = context.GetResource(OpacityMaskShapeVisualSurfaceBrushResourceKey) ??
+            // Create a CompositionSurfaceBrush using the CompositionVisualSurface as the source, this essentially converts the ShapeVisual into a brush.
+            // This brush can then be used as a mask.
+            CompositionSurfaceBrush opacityMask = context.GetResource(OpacityMaskShapeVisualSurfaceBrushResourceKey) ??
                 context.AddResource(OpacityMaskShapeVisualSurfaceBrushResourceKey, context.Compositor.CreateSurfaceBrush());
-            surfaceBrush.Surface = visualSurface;
+            opacityMask.Surface = visualSurface;
         }
 
         /// <inheritdoc/>
         protected override void SetElementChildVisual(AttachedShadowElementContext context)
         {
-            if (context.TryGetResource(OpacityMaskShapeVisualSurfaceBrushResourceKey, out var opacityMask))
+            if (context.TryGetResource(OpacityMaskShapeVisualSurfaceBrushResourceKey, out CompositionSurfaceBrush opacityMask))
             {
-                var visualSurface = context.GetResource(OpacityMaskVisualSurfaceResourceKey) ??
+                // If the resource for OpacityMaskShapeVisualSurfaceBrushResourceKey exists it means this.InnerContentClipMode == CompositionVisualSurface,
+                // which means we need to take some steps to set up an opacity mask.
+
+                // Create a CompositionVisualSurface, and use the SpriteVisual containing the shadow as the source.
+                CompositionVisualSurface shadowVisualSurface = context.GetResource(OpacityMaskVisualSurfaceResourceKey) ??
                     context.AddResource(OpacityMaskVisualSurfaceResourceKey, context.Compositor.CreateVisualSurface());
-                visualSurface.SourceVisual = context.SpriteVisual;
+                shadowVisualSurface.SourceVisual = context.SpriteVisual;
                 context.SpriteVisual.RelativeSizeAdjustment = Vector2.Zero;
                 context.SpriteVisual.Size = new Vector2((float)context.Element.ActualWidth, (float)context.Element.ActualHeight);
-                visualSurface.SourceOffset = new Vector2(-MaxBlurRadius);
-                visualSurface.SourceSize = new Vector2((float)context.Element.ActualWidth, (float)context.Element.ActualHeight) + new Vector2(MaxBlurRadius * 2);
 
-                var surfaceBrush = context.GetResource(OpacityMaskSurfaceBrushResourceKey) ??
+                // Adjust the offset and size of the CompositionVisualSurface to accommodate the thick outline of the shape created in UpdateVisualOpacityMask().
+                shadowVisualSurface.SourceOffset = new Vector2(-MaxBlurRadius);
+                shadowVisualSurface.SourceSize = new Vector2((float)context.Element.ActualWidth, (float)context.Element.ActualHeight) + new Vector2(MaxBlurRadius * 2);
+
+                // Create a CompositionSurfaceBrush from the CompositionVisualSurface. This allows us to render the shadow in a brush.
+                CompositionSurfaceBrush shadowSurfaceBrush = context.GetResource(OpacityMaskSurfaceBrushResourceKey) ??
                     context.AddResource(OpacityMaskSurfaceBrushResourceKey, context.Compositor.CreateSurfaceBrush());
-                surfaceBrush.Surface = visualSurface;
-                surfaceBrush.Stretch = CompositionStretch.None;
+                shadowSurfaceBrush.Surface = shadowVisualSurface;
+                shadowSurfaceBrush.Stretch = CompositionStretch.None;
 
+                // Create a CompositionMaskBrush, using the CompositionSurfaceBrush of the shadow as the source,
+                // and the CompositionSurfaceBrush created in UpdateVisualOpacityMask() as the mask.
+                // This creates a brush that renders the shadow with its inner portion clipped out.
                 CompositionMaskBrush maskBrush = context.GetResource(OpacityMaskBrushResourceKey) ??
                     context.AddResource(OpacityMaskBrushResourceKey, context.Compositor.CreateMaskBrush());
-                maskBrush.Source = surfaceBrush;
+                maskBrush.Source = shadowSurfaceBrush;
                 maskBrush.Mask = opacityMask;
 
-                var visual = context.GetResource(OpacityMaskVisualResourceKey) ??
+                // Create a SpriteVisual and set its brush to the CompositionMaskBrush created in the previous step,
+                // then set it as the child of the element in the context.
+                SpriteVisual visual = context.GetResource(OpacityMaskVisualResourceKey) ??
                     context.AddResource(OpacityMaskVisualResourceKey, context.Compositor.CreateSpriteVisual());
                 visual.RelativeSizeAdjustment = Vector2.One;
                 visual.Offset = new Vector3(-MaxBlurRadius, -MaxBlurRadius, 0);
@@ -288,21 +303,21 @@ protected override void SetElementChildVisual(AttachedShadowElementContext conte
         /// <inheritdoc />
         protected internal override void OnSizeChanged(AttachedShadowElementContext context, Size newSize, Size previousSize)
         {
-            var sizeAsVec2 = newSize.ToVector2();
+            Vector2 sizeAsVec2 = newSize.ToVector2();
 
-            var geometry = context.GetResource(RoundedRectangleGeometryResourceKey);
+            CompositionRoundedRectangleGeometry geometry = context.GetResource(RoundedRectangleGeometryResourceKey);
             if (geometry != null)
             {
                 geometry.Size = sizeAsVec2;
             }
 
-            var visualSurface = context.GetResource(VisualSurfaceResourceKey);
+            CompositionVisualSurface visualSurface = context.GetResource(VisualSurfaceResourceKey);
             if (geometry != null)
             {
                 visualSurface.SourceSize = sizeAsVec2;
             }
 
-            var shapeVisual = context.GetResource(ShapeVisualResourceKey);
+            ShapeVisual shapeVisual = context.GetResource(ShapeVisualResourceKey);
             if (geometry != null)
             {
                 shapeVisual.Size = sizeAsVec2;

From 65e350b8caa7fe035f5affd55be8586afc09ca09 Mon Sep 17 00:00:00 2001
From: Christopher Blackman <cblackman@microsoft.com>
Date: Mon, 9 May 2022 19:08:25 -0400
Subject: [PATCH 14/14] Use "is not null" instead of "!= null" in
 AttachedShadowElementContext

---
 .../Shadows/AttachedShadowElementContext.cs               | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/Microsoft.Toolkit.Uwp.UI/Shadows/AttachedShadowElementContext.cs b/Microsoft.Toolkit.Uwp.UI/Shadows/AttachedShadowElementContext.cs
index 3c8e5d51e87..f5b448fcac3 100644
--- a/Microsoft.Toolkit.Uwp.UI/Shadows/AttachedShadowElementContext.cs
+++ b/Microsoft.Toolkit.Uwp.UI/Shadows/AttachedShadowElementContext.cs
@@ -200,7 +200,7 @@ public T AddResource<T>(string key, T resource)
         /// <returns>True if the resource exists, false otherwise</returns>
         public bool TryGetResource<T>(string key, out T resource)
         {
-            if (_resources != null && _resources.TryGetValue(key, out var objResource) && objResource is T tResource)
+            if (_resources is not null && _resources.TryGetValue(key, out var objResource) && objResource is T tResource)
             {
                 resource = tResource;
                 return true;
@@ -234,7 +234,7 @@ public T GetResource<T>(string key)
         /// <returns>The resource that was removed, if any</returns>
         public T RemoveResource<T>(string key)
         {
-            if (_resources != null && _resources.TryGetValue(key, out var objResource))
+            if (_resources is not null && _resources.TryGetValue(key, out var objResource))
             {
                 _resources.Remove(key);
                 if (objResource is T resource)
@@ -255,7 +255,7 @@ public T RemoveResource<T>(string key)
         public T RemoveAndDisposeResource<T>(string key)
             where T : IDisposable
         {
-            if (_resources != null && _resources.TryGetValue(key, out var objResource))
+            if (_resources is not null && _resources.TryGetValue(key, out var objResource))
             {
                 _resources.Remove(key);
                 if (objResource is T resource)
@@ -309,7 +309,7 @@ internal T RemoveAndDisposeResource<T>(TypedResourceKey<T> key)
         /// </summary>
         public void ClearAndDisposeResources()
         {
-            if (_resources != null)
+            if (_resources is not null)
             {
                 foreach (var kvp in _resources)
                 {