Add InfoBarPanel to InfoBar control

active/InformationBar/InformationBar.md

@@ -1,7 +1,6 @@
 # Background
 > This spec corresponds to [issue 913](https://github.com/microsoft/microsoft-ui-xaml/issues/913) on the WinUI repo.
 
-
 Users should be informed about essential status changes that occur on an app level.
 These status changes affect the app as a whole and can be either critical or informational.
 Critical status changes like lost internet connectivity are directly impactful to app functionality while
@@ -398,6 +397,73 @@ Please view the guidance for
 for more information about text localization in your notification.
 
 
+# InfoBarPanel class
+
+A layout panel that positions its children horizontally if there’s available space,
+otherwise positions them vertically. This panel is intended to only be used as part
+of the ControlTemplate of the InfoBar control.
+
+## InfoBar padding properties
+
+The `HorizontalOrientationPadding` property gets/sets the distance between the edges
+of the panel and its children, when the panel is laying out items horizontally.
+The `VerticalOrientationPadding` property does likewise when the panel is laying out
+items vertically.
+
+[API note: these padding properties are analogous to ex the 
+[StackPanel.Padding](https://docs.microsoft.com/uwp/api/Windows.UI.Xaml.Controls.StackPanel.Padding)
+property.]
+
+## InfoBar margin attached properties
+
+The `HorizontalOrientationMargin` attached property can be set on child elements
+of an InfoBarPanel, and gets/sets an extra margin on the element.
+Similarly 
+`VerticalOrientationMargin` for vertical layout.
+
+These attached margin properties are applied on an element in addition to the
+element's [Margin](https://docs.microsoft.com/uwp/api/Windows.UI.Xaml.FrameworkElement.Margin)
+property. For example if a child element's Margin is 2 and its
+InfoBarPanel.HorizontalOrientationMargin property is 3, it will have an effective margin
+of 5 (when the panel is in its horizontal layout).
+
+The leading and trailing margins are ignored  however.
+For example, in horizontal layout, the HorizontalOrientationMargin.Left
+is ignored on the first child, and the 
+HorizontalOrientationMargin.Right is ignored on the last child.
+This applies to the first/last child that are not collapsed (that take up layout space).
+For example, if the first child is collapsed, it's the
+HorizontalOrientationMargin.Left of the _second_ child that is ignored.
+
+## InfoBarPanel example
+
+This example shows an InfoBarPanel with 5px of padding above and below
+its children when laying out horizontally, no padding otherwise. 
+
+The children have spacing between each other that varies based on the child
+and orientation. The second child (the green rectangle) won't have it its margin
+applied if the first child (the red rectangle) is collapsed.
+
+```xml
+<Border BorderBrush="Black" BorderThickness="1" Margin="100" HorizontalAlignment="Left">
+    <primitives:InfoBarPanel HorizontalOrientationPadding='0,5,0,5' >
+
+        <Rectangle Width="100" Height="100" Fill="Red" />
+
+        <Rectangle Width="100" Height="100" Fill="Green"
+            primitives:InfoBarPanel.HorizontalOrientationMargin='16,0,0,0'
+            primitives:InfoBarPanel.VerticalOrientationMargin='0,20,0,0'/>
+
+        <Rectangle Width="100" Height="100" Fill="Blue"
+            primitives:InfoBarPanel.HorizontalOrientationMargin='32,0,0,0'
+            primitives:InfoBarPanel.VerticalOrientationMargin='0,20,0,0' />
+
+    </primitives:InfoBarPanel>
+</Border>
+```
+
+![InfoBarPanel example](images/InfoBarPanel-example.jpg)
+
 # API Notes
 
 ### Notable Properties  
@@ -418,6 +484,8 @@ for more information about text localization in your notification.
 
 # API Details
 
+## Microsoft.UI.Xaml.Controls
+
 ```c++
 enum InfoBarCloseReason
 {
@@ -497,6 +565,34 @@ unsealed runtimeclass InfoBar : Windows.UI.Xaml.Controls.ContentControl
 }
 ```
 
+## Microsoft.UI.Xaml.Controls.Primitives
+
+```cs
+[webhosthidden]
+unsealed runtimeclass InfoBarPanel : Windows.UI.Xaml.Controls.Panel
+{
+    InfoBarPanel();
+
+    // HorizontalOrientationPadding property
+    Windows.UI.Xaml.Thickness HorizontalOrientationPadding;
+    static Windows.UI.Xaml.DependencyProperty HorizontalOrientationPaddingProperty{ get; };
+
+    // VerticalOrientationPadding property
+    Windows.UI.Xaml.Thickness VerticalOrientationPadding;
+    static Windows.UI.Xaml.DependencyProperty VerticalOrientationPaddingProperty{ get; };
+
+    // HorizontalOrientationMargin attached property
+    static void SetHorizontalOrientationMargin(Windows.UI.Xaml.DependencyObject object, Windows.UI.Xaml.Thickness value);
+    static Windows.UI.Xaml.Thickness GetHorizontalOrientationMargin(Windows.UI.Xaml.DependencyObject object);
+    static Windows.UI.Xaml.DependencyProperty HorizontalOrientationMarginProperty{ get; };
+
+    // VerticalOrientationMargin attached property
+    static void SetVerticalOrientationMargin(Windows.UI.Xaml.DependencyObject object, Windows.UI.Xaml.Thickness value);
+    static Windows.UI.Xaml.Thickness GetVerticalOrientationMargin(Windows.UI.Xaml.DependencyObject object);
+    static Windows.UI.Xaml.DependencyProperty VerticalOrientationMarginProperty{ get; };
+}
+```
+
 ## Theme Resources
 
 ### Notable Theme Resources