Added Array support for Select and Tabs' methods.

BlazorMaterialWeb.Demo/Pages/Progress.razor

@@ -3,9 +3,9 @@
 <ComponentDemoPage Name="Progress indicators"
  DesignUrl="https://m3.material.io/components/progress-indicators/overview"
  ComponentUrl="https://material-web.dev/components/progress/"
- ComponentSourcePath="elevation"
- BlazorComponentSourcePath="Elevation"
- BlazorDemoSourceName="Elevation">
+ ComponentSourcePath="progress"
+ BlazorComponentSourcePath="MdProgress.razor"
+ BlazorDemoSourceName="Progress">
  <Description>
  Progress indicators show the status of a process in real time
  </Description>

BlazorMaterialWeb.Demo/Pages/Tabs.razor

@@ -98,6 +98,10 @@
  <MdButton @onclick="Select3rdTabs">
  Programmatically select the 3rd tabs
  </MdButton>
+
+ <MdButton @onclick="GetAndSelectTab">
+ Programmatically get the 2nd tab then select it
+ </MdButton>
  </Stack>
  </Tweaks>
 </ComponentDemoPage>
@@ -138,4 +142,15 @@
  }
  }
 
+ async Task GetAndSelectTab()
+ {
+ foreach (var t in tabRefs.Values)
+ {
+ var tabs = await t.GetTabsAsync();
+
+ var secondTab = await tabs.GetItemAsync(1);
+ await t.SetActiveTabAsync(secondTab);
+ }
+ }
+
 }

BlazorMaterialWeb/Common/IJSArrayReference.cs

@@ -0,0 +1,30 @@
+namespace BlazorMaterialWeb.Common;
+
+public interface IJSArrayReference<T>
+{
+ IJSObjectReference JSObjectReference { get; }
+
+ Task<T> GetItemAsync(long index);
+ Task<long> GetLengthAsync();
+}
+
+class JSArrayReference<T> : IJSArrayReference<T>
+{
+ readonly IJSObjectReference jsRef;
+ readonly IJSRuntime js;
+
+ public JSArrayReference(IJSObjectReference jsRef, IJSRuntime js)
+ {
+ this.jsRef = jsRef;
+ this.js = js;
+ }
+
+ public IJSObjectReference JSObjectReference => jsRef;
+
+ public async Task<long> GetLengthAsync() =>
+ await js.GetObjectPropertyAsync<long>(jsRef, "length");
+
+ public async Task<T> GetItemAsync(long index) =>
+ await js.GetArrayElementAsync<T>(jsRef, index);
+
+}

BlazorMaterialWeb/Extensions/JsExtensions.cs

@@ -6,10 +6,16 @@ internal static class JsExtensions
 
  public static async Task<T> GetElementPropertyAsync<T>(this IJSRuntime js, ElementReference el, string propertyName) =>
  await js.InvokeAsync<T>(Prefix("getElementProperty"), el, propertyName);
-
+
+ public static async Task<T> GetObjectPropertyAsync<T>(this IJSRuntime js, IJSObjectReference obj, string propertyName) =>
+ await js.InvokeAsync<T>(Prefix("getElementProperty"), obj, propertyName);
+
  public static async Task SetElementPropertyAsync(this IJSRuntime js, ElementReference el, string propertyName, object? value) =>
  await js.InvokeVoidAsync(Prefix("setElementProperty"), el, propertyName, value);
 
+ public static async Task SetObjectPropertyAsync(this IJSRuntime js, IJSObjectReference obj, string propertyName, object? value) =>
+ await js.InvokeVoidAsync(Prefix("setElementProperty"), obj, propertyName, value);
+
  public static async Task InvokeElementMethodAsync(this IJSRuntime js, ElementReference el, string methodName, params object?[] parameters) =>
  await js.InvokeVoidAsync(
  Prefix("invokeElementMethodAsync"),

BlazorMaterialWeb/Select/MdSelect.razor.cs

@@ -114,11 +114,17 @@ async Task OnChangeAsync(MdSelectChangeEventArgs e)
  await OnChange.InvokeAsync(e);
  }
 
- public async Task<IJSObjectReference> GetOptionsAsync() =>
- await Js.GetElementPropertyAsync<IJSObjectReference>(el, "options");
+ public async Task<IJSArrayReference<IJSObjectReference>> GetOptionsAsync()
+ {
+ var options = await Js.GetElementPropertyAsync<IJSObjectReference>(el, "options");
+ return new JSArrayReference<IJSObjectReference>(options, Js);
+ }
 
- public async Task<IJSObjectReference> GetSelectedOptionsAsync() =>
- await Js.GetElementPropertyAsync<IJSObjectReference>(el, "selectedOptions");
+ public async Task<IJSArrayReference<IJSObjectReference>> GetSelectedOptionsAsync()
+ {
+ var options = await Js.GetElementPropertyAsync<IJSObjectReference>(el, "selectedOptions");
+ return new JSArrayReference<IJSObjectReference>(options, Js);
+ }
 
  public async Task ResetAsync() =>
  await InvokeElAsync("reset");

BlazorMaterialWeb/Tabs/MdTabs.razor.cs

@@ -1,4 +1,6 @@
-namespace BlazorMaterialWeb;
+using BlazorMaterialWeb.Common;
+
+namespace BlazorMaterialWeb;
 
 /// <summary>
 /// Tabs organize content across different screens and views.
@@ -17,22 +19,26 @@ partial class MdTabs
  [Parameter]
  public EventCallback<MdTabChangeEventArgs> OnTabChanged { get; set; }
 
- public async Task<IJSObjectReference> GetTabsAsync() =>
- await GetPropertyAsync<IJSObjectReference>("tabs");
+ public async Task<IJSArrayReference<IJSObjectReference>> GetTabsAsync()
+ {
+ var tabs = await GetPropertyAsync<IJSObjectReference>("tabs");
+
+ return new JSArrayReference<IJSObjectReference>(tabs, Js);
+ }
 
  public async Task<int> GetActiveTabIndexAsync() =>
  await GetPropertyAsync<int>("activeTabIndex");
 
  public async Task SetActiveTabIndexAsync(int index) =>
  await SetPropertyAsync("activeTabIndex", index);
 
- public async Task<ElementReference> GetActiveTabAsync() =>
- await GetPropertyAsync<ElementReference>("activeTab");
+ public async Task<IJSObjectReference> GetActiveTabAsync() =>
+ await GetPropertyAsync<IJSObjectReference>("activeTab");
 
- public async Task SetActiveTabAsync(ElementReference tab) => 
+ public async Task SetActiveTabAsync(IJSObjectReference tab) => 
  await SetPropertyAsync("activeTab", tab);
 
- public async Task ScrollToTabAsync(ElementReference tab) =>
+ public async Task ScrollToTabAsync(IJSObjectReference tab) =>
  await InvokeMethodAsync("scrollToTab", tab);
 
 }

pack.ps1

@@ -4,7 +4,7 @@ foreach($file in $files) {
  rm $file.FullName
 }
 
-$version="--property:Version=1.0.3"
+$version="--property:Version=1.1.1"
 
 dotnet pack .\BlazorMaterialWeb\BlazorMaterialWeb.csproj -c Release "--property:PackageOutputPath=.\bin\nuget" "$version"
 dotnet pack .\BlazorMaterialWeb.Bundled\BlazorMaterialWeb.Bundled.csproj -c Release "--property:PackageOutputPath=.\bin\nuget" "$version"