vNext

.github/workflows/GithubActionsWIP.yml

@@ -229,7 +229,7 @@ jobs:
 # The current version of Material.Blazor is viewable on GH-pages in addition to material-blazor.com
 ############################################################################################################
   deployghpages-mbcurrent:
-    name: Deploy to GitHub pages (Material-Blazor/Material.Blazor.Current)
+    name: Deploy to GH pages (MB.Current)
     needs: [test, build-documentation, build-website, deployment-allowed-mb]
     runs-on: ubuntu-latest
 
@@ -405,7 +405,7 @@ jobs:
 # Build documentation
 ############################################################################################################
   build-documentation-MD3:
-    name: Build documentation
+    name: Build documentation MD3
     runs-on: windows-latest
     needs: [build-allowed]
 
@@ -540,7 +540,7 @@ jobs:
 # The current version of Material.Blazor is viewable on GH-pages in addition to material-blazor.com
 ############################################################################################################
   deployghpages-mbcurrent-MD3:
-    name: Deploy to GitHub pages (Material-Blazor/Material.Blazor.MD3.Current)
+    name: Deploy to GH pages (MB.MD3.Current)
     needs: [test, build-website-MD3, build-documentation-MD3, deployment-allowed-mb]
     runs-on: ubuntu-latest
 

.gitignore

@@ -1,10 +1,14 @@
 ## Ignore temporary files and build results specific to M.B
 
 #Generated CSS and JS files
-**/Material.Blazor/wwwroot/*.*
-**/Material.Blazor.Website/wwwroot/css/*.*
-**/Material.Blazor.MD3/wwwroot/*.*
-**/Material.Blazor.Website.MD3/wwwroot/css/*.*
+**/Material.Blazor/wwwroot/*.css
+**/Material.Blazor/wwwroot/*.js
+**/Material.Blazor.Website/wwwroot/*.css
+**/Material.Blazor.Website/wwwroot/*.js
+**/Material.Blazor.MD3/wwwroot/*.css
+**/Material.Blazor.MD3/wwwroot/*.js
+**/Material.Blazor.Website.MD3/wwwroot/css/*.css
+**/Material.Blazor.Website.MD3/wwwroot/css/*.js
 
 # DocFx tool
 !**/DocFx/*.*

LocalBuild.cmd

@@ -1,6 +1,6 @@
 @echo off
 set argVersion=%1
-if "%1" == "" set argVersion=5.0.0-rc3
+if "%1" == "" set argVersion=5.0.3
 set argDestination=%2
 if "%2" == "" set argDestination="c:\solutions\local nuget packages"
 

Material.Blazor.MD3/Articles/CoreComponents.md

@@ -24,4 +24,5 @@ Material Web implements web components which implement the components defined in
 | [MBSelect](xref:C.MBSelect) | [select](https://material-web.dev/components/select/) |
 | [MBSlider](xref:C.MBSlider) | [slider](https://material-web.dev/components/slider/) |
 | [MBSwitch](xref:C.MBSwitch) | [switch](https://material-web.dev/components/switch/) |
+| [MBTabs](xref:C.MBTabs) | [tabs](https://material-web.dev/components/tabs/) |
 | [MBTextField](xref:C.MBTextField) | [text-field](https://material-web.dev/components/text-field/) |

Material.Blazor.MD3/Components/Dialog/MBDialog.cs

@@ -25,45 +25,33 @@ public class MBDialog : ComponentFoundation
         /// </summary>
         [Parameter] public MBDialogButton[] ButtonItems { get; set; }
 
-        /// <summary>
-        /// A unique ID for the dialog
-        /// Can be accomplished with careful naming or something like 
-        ///     "dialog-id-" + Guid.NewGuid().ToString().ToLower();
-        /// </summary>
-        [Parameter, EditorRequired] public string DialogId { get; set; }
-
         /// <summary>
         /// The action returned by the dialog when the escape key is pressed. Defaults to "close". Setting
         /// this to "" will disable the escape key action.
         /// </summary>
         [Parameter] public string EscapeKeyAction { get; set; } = "close";
 
         /// <summary>
-        /// Render fragment for the dialog header.
+        /// The dialog title.
         /// </summary>
-        [Parameter] public RenderFragment Header { get; set; }
+        [Parameter] public string Headline { get; set; }
 
         /// <summary>
-        /// The action returned by the dialog when the scrim is clicked. Defaults to "close". Setting
-        /// this to "" will disable scrim click action.
+        /// The icon attributes.
         /// </summary>
-        [Parameter] public string ScrimClickAction { get; set; } = "close";
+        [Parameter] public MBIconDescriptor IconDescriptor { get; set; }
 
         /// <summary>
-        /// The dialog title.
+        /// The action returned by the dialog when the scrim is clicked. Defaults to "close". Setting
+        /// this to "" will disable scrim click action.
         /// </summary>
-        [Parameter] public string Title { get; set; }
+        [Parameter] public string ScrimClickAction { get; set; } = "close";
 
 
 
         private TaskCompletionSource<string> CloseReasonTaskCompletionSource { get; set; }
-        private bool HasBody => Body != null || false;
-        private bool HasButtons => ButtonItems != null || false;
-        private bool HasHeader => Header != null;
-        private bool HasTitle => !string.IsNullOrWhiteSpace(Title);
-        private string IdBody { get; } = Utilities.GenerateUniqueElementName();
-        private string IdHeader { get; } = Utilities.GenerateUniqueElementName();
-        private string IdTitle { get; } = Utilities.GenerateUniqueElementName();
+        private string DialogId { get; set; } = "dialog-id-" + Guid.NewGuid().ToString().ToLower();
+        private string FormId { get; set; } = "form-id-" + Guid.NewGuid().ToString().ToLower();
         private bool IsOpen { get; set; }
         private TaskCompletionSource OpenedTaskCompletionSource { get; set; } = new();
         internal Task Opened => OpenedTaskCompletionSource.Task;
@@ -86,52 +74,44 @@ protected override void BuildRenderTree(RenderTreeBuilder builder)
                     builder.AddMultipleAttributes(rendSeq++, attributesToSplat);
                 }
 
-                if (HasHeader || HasTitle)
+                if (IconDescriptor is not null)
+                {
+                    MBIcon.BuildRenderTreeWorker(
+                        builder,
+                        ref rendSeq,
+                        CascadingDefaults,
+                        attributesToSplat,
+                        "",
+                        "",
+                        "",
+                        IconDescriptor,
+                        "icon");
+                }
+
+                if (!string.IsNullOrWhiteSpace(Headline))
                 {
                     builder.OpenElement(rendSeq++, "div");
                     {
-                        builder.AddAttribute(rendSeq++, "slot", "header");
-
-                        if (HasHeader)
-                        {
-                            builder.OpenElement(rendSeq++, "div");
-                            {
-                                builder.AddContent(rendSeq++, Header);
-                            }
-                            builder.CloseElement();
-                        }
-                        else
-                        {
-                            builder.OpenElement(rendSeq++, "div");
-                            {
-                                builder.AddContent(rendSeq++, Title);
-                            }
-                            builder.CloseElement();
-                        }
+                        builder.AddAttribute(rendSeq++, "slot", "headline");
+                        builder.AddContent(rendSeq++, Headline);
                     }
                     builder.CloseElement();
                 }
-            }
-            builder.CloseElement();
-        }
 
-        #endregion
-
-        #region HideAsync
+                if (Body is not null)
+                {
+                    builder.OpenElement(rendSeq++, "form");
+                    {
+                        builder.AddAttribute(rendSeq++, "id", FormId);
+                        builder.AddAttribute(rendSeq++, "slot", "content");
+                        builder.AddAttribute(rendSeq++, "method", "dialog");
 
-        /// <summary>
-        /// Hides the dialog by allowing Material Theme to close it gracefully.
-        /// </summary>
-        public async Task HideAsync()
-        {
-            if (IsOpen)
-            {
-                await InvokeJsVoidAsync("MaterialBlazor.MBDialog.dialogHide", DialogId);
-            }
-            else
-            {
-                throw new InvalidOperationException("Cannot hide MBDialog that is not already open");
+                        builder.AddContent(rendSeq++, Body);
+                    }
+                    builder.CloseElement();
+                }
             }
+            builder.CloseElement();
         }
 
         #endregion

Material.Blazor.MD3/Components/Dialog/MBDialog.ts

@@ -1,13 +1,5 @@
-export function dialogShow(dialogID: string) {
-    const dialogElement: any | null = document.getElementById(dialogID);
-    if (dialogElement != null) {
-        dialogElement.open();
-    }
-}
+import { MdDialog } from '@material/web/dialog/dialog';
 
-export function dialogHide(dialogID: string) {
-    const dialogElement: any | null = document.getElementById(dialogID);
-    if (dialogElement != null) {
-        dialogElement.close();
-    }
+export function dialogShow(dialogID: string) {
+    (document.getElementById(dialogID) as MdDialog)?.show();
 }