Add parameters to MBMenuSurface and MBAutocompletePagedField (#1277)

* Add position parameter to MBAutoCompletePagedField

* Release notes

* Add notify opened parameter to MBMenuSurface

* Release notes

Material.Blazor/Components/AutocompletePagedField/MBAutocompletePagedField.razor

@@ -28,7 +28,8 @@
 
     <div class="mdc-menu-surface--anchor">
         <div @ref="@MenuReference"
-             class="mdc-menu mdc-menu-surface mdc-menu-surface--fixed"
+             class="mdc-menu-surface @ActiveConditionalClasses @(@class)"
+             style="@style"
              @onfocusin="OnMenuFocusIn"
              @onfocusout="OnMenuFocusOut"
              tabindex="-1">

Material.Blazor/Components/AutocompletePagedField/MBAutocompletePagedField.razor.cs

@@ -50,6 +50,12 @@ public partial class MBAutocompletePagedField<TItem> : SingleSelectComponent<TIt
     [Parameter] public MBTextAlignStyle? TextAlignStyle { get; set; }
 
 
+    /// <summary>
+    /// Menu surface positioning, defaults to <see cref="MBMenuSurfacePositioning.Fixed"/>.
+    /// </summary>
+    [Parameter] public MBMenuSurfacePositioning MenuSurfacePositioning { get; set; } = MBMenuSurfacePositioning.Fixed;
+
+
     /// <summary>
     /// Field label.
     /// </summary>
@@ -144,6 +150,9 @@ protected override async Task OnInitializedAsync()
     {
         await base.OnInitializedAsync();
 
+        _ = ConditionalCssClasses
+            .AddIf(MBMenuSurface.GetMenuSurfacePositioningClass(MenuSurfacePositioning), () => MenuSurfacePositioning != MBMenuSurfacePositioning.Regular);
+
         AllowAllRenders();
     }
 

Material.Blazor/Components/MenuSurface/MBMenuSurface.razor.cs

@@ -23,6 +23,12 @@ public partial class MBMenuSurface : ComponentFoundation
     [Parameter] public MBMenuSurfacePositioning MenuSurfacePositioning { get; set; } = MBMenuSurfacePositioning.Regular;
 
 
+    /// <summary>
+    /// Called when the menu is opened.
+    /// </summary>
+    [Parameter] public Action OnMenuOpened { get; set; }
+
+
     /// <summary>
     /// Called when the menu is closed.
     /// </summary>
@@ -65,18 +71,24 @@ protected override void Dispose(bool disposing)
     }
 
 
+    /// <summary>
+    /// For Material Theme to notify of menu closure via JS Interop.
+    /// </summary>
+    [JSInvokable()]
+    public void NotifyOpened()
+    {
+        OnMenuOpened?.Invoke();
+    }
+
+
     /// <summary>
     /// For Material Theme to notify of menu closure via JS Interop.
     /// </summary>
     [JSInvokable()]
     public void NotifyClosed()
     {
         IsOpen = false;
-
-        if (OnMenuClosed != null)
-        {
-            _ = InvokeAsync(OnMenuClosed);
-        }
+        OnMenuClosed?.Invoke();
     }
 
 
@@ -114,7 +126,7 @@ internal override async Task InstantiateMcwComponent()
     /// </summary>
     /// <param name="surfacePositioning"></param>
     /// <returns></returns>
-    private static string GetMenuSurfacePositioningClass(MBMenuSurfacePositioning surfacePositioning) =>
+    internal static string GetMenuSurfacePositioningClass(MBMenuSurfacePositioning surfacePositioning) =>
         surfacePositioning switch
         {
             MBMenuSurfacePositioning.FullWidth => "mdc-menu-surface--fullwidth",

Material.Blazor/Components/MenuSurface/MBMenuSurface.ts

@@ -6,6 +6,12 @@ export function init(elem, dotNetObject) {
     }
     elem._menu = MDCMenuSurface.attachTo(elem);
 
+    const openedCallback = () => {
+        dotNetObject.invokeMethodAsync('NotifyOpened');
+    };
+
+    elem._menu.listen('MDCMenuSurface:opened', openedCallback);
+
     const closedCallback = () => {
         dotNetObject.invokeMethodAsync('NotifyClosed');
     };

Material.Blazor/Components/Slider/MBSlider.razor.cs

@@ -44,7 +44,7 @@ public partial class MBSlider : InputComponent<decimal>
 
 
     /// <summary>
-    /// For continuous input sets the debounce/throttle delay.
+    /// For continuous input sets the debounce/throttle delay in milliseconds.
     /// </summary>
     [Parameter] public uint ContinuousInputDelay { get; set; } = 300;
 

Material.Blazor/wwwroot/material.blazor.js

@@ -13755,6 +13755,10 @@ function MBMenuSurface_init(elem, dotNetObject) {
     return;
   }
   elem._menu = MDCMenuSurface.attachTo(elem);
+  var openedCallback = function openedCallback() {
+    dotNetObject.invokeMethodAsync('NotifyOpened');
+  };
+  elem._menu.listen('MDCMenuSurface:opened', openedCallback);
   var closedCallback = function closedCallback() {
     dotNetObject.invokeMethodAsync('NotifyClosed');
   };

ReleaseNotes.md

@@ -4,6 +4,26 @@ title: ReleaseNotes
 ---
 # Release Notes
 
+#### [5.2.3](https://github.com/Material-Blazor/Material.Blazor/tree/5.2.3)
+
+Released 2024-03-16
+
+**Updates**
+- Add `MenuSurfacePositioning` parameter to `MBAutocompletePagedField`.
+- Add `OnMenuOpened` parameter to `MBMenuSurface`.
+
+**New components**
+
+**New features**
+
+**Breaking Changes**
+
+**Deprecated Components**
+
+**Known issues**
+
+<br />
+
 #### [5.2.2](https://github.com/Material-Blazor/Material.Blazor/tree/5.2.2)
 
 Released 2024-03-13