@@ -72,4 +72,65 @@
+
+
+ An illustrative example of integrating this component into a straightforward mobile application.
+
+
+
+
+
+
+
+
+
+ BlazorUI
+
+
+
+
+
+
+
+ @foreach (var (idx, i) in advancedItems)
+ {
+
@(idx.ToString().PadLeft(2, '0')). Item @i
+ }
+
+
+
+
+
+
+ Empower customization by overriding default styles and classes, allowing tailored design modifications to suit specific UI requirements.
+
+
+
+
+ @foreach (var (idx, i) in styleItems)
+ {
+
@(idx.ToString().PadLeft(2, '0')). Item @i
+ }
+
+
+
+
+ @foreach (var (idx, i) in classItems)
+ {
+
@(idx.ToString().PadLeft(2, '0')). Item @i
+ }
+
+
+
\ No newline at end of file
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/PullToRefresh/BitPullToRefreshDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/PullToRefresh/BitPullToRefreshDemo.razor.cs
index 75e72ebc52..76641be9a9 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/PullToRefresh/BitPullToRefreshDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/PullToRefresh/BitPullToRefreshDemo.razor.cs
@@ -19,6 +19,15 @@ public partial class BitPullToRefreshDemo
Description = "The anchor element that the pull to refresh component adheres to.",
},
new()
+ {
+ Name = "Classes",
+ Type = "BitPullToRefreshClassStyles?",
+ DefaultValue = "null",
+ Description = "Custom CSS classes for different parts of the BitPullToRefresh.",
+ LinkType = LinkType.Link,
+ Href = "#class-styles",
+ },
+ new()
{
Name = "Factor",
Type = "decimal",
@@ -84,6 +93,15 @@ public partial class BitPullToRefreshDemo
Description = "The CSS selector of the element that is the scroller in the anchor to control the behavior of the pull to refresh.",
},
new()
+ {
+ Name = "Styles",
+ Type = "BitPullToRefreshClassStyles?",
+ DefaultValue = "null",
+ Description = "Custom CSS styles for different parts of the BitPullToRefresh.",
+ LinkType = LinkType.Link,
+ Href = "#class-styles",
+ },
+ new()
{
Name = "Threshold",
Type = "int",
@@ -96,7 +114,7 @@ public partial class BitPullToRefreshDemo
Type = "int",
DefaultValue = "80",
Description = "The pulling height in pixel that triggers the refresh.",
- },
+ }
];
private readonly List
componentSubClasses =
@@ -127,6 +145,56 @@ public partial class BitPullToRefreshDemo
},
]
},
+ new()
+ {
+ Id = "class-styles",
+ Title = "BitPullToRefreshClassStyles",
+ Parameters =
+ [
+ new()
+ {
+ Name = "Root",
+ Type = "string?",
+ DefaultValue = "null",
+ Description = "Custom CSS classes/styles for the root element of the PullToRefresh."
+ },
+ new()
+ {
+ Name = "Loading",
+ Type = "string?",
+ DefaultValue = "null",
+ Description = "Custom CSS classes/styles for the loading element."
+ },
+ new()
+ {
+ Name = "SpinnerWrapper",
+ Type = "string?",
+ DefaultValue = "null",
+ Description = "Custom CSS classes/styles for the spinner wrapper element."
+ },
+ new()
+ {
+ Name = "SpinnerWrapperRefreshing",
+ Type = "string?",
+ DefaultValue = "null",
+ Description = "Custom CSS classes/styles for the spinner wrapper element in refreshing mode."
+ },
+ new()
+ {
+ Name = "Spinner",
+ Type = "string?",
+ DefaultValue = "null",
+ Description = "Custom CSS classes/styles for the spinner element."
+ },
+ new()
+ {
+ Name = "SpinnerRefreshing",
+ Type = "string?",
+ DefaultValue = "null",
+ Description = "Custom CSS classes/styles for the spinner element in refreshing mode."
+ },
+ ]
+ }
];
@@ -154,6 +222,7 @@ private async Task HandleOnRefresh1()
multiItems1 = GenerateRandomNumbers(1, 51);
_ = Task.Delay(1000).ContinueWith(_ => InvokeAsync(StateHasChanged));
}
+
private (int, int)[] multiItems2 = GenerateRandomNumbers(51, 101);
private async Task HandleOnRefresh2()
{
@@ -162,152 +231,34 @@ private async Task HandleOnRefresh2()
_ = Task.Delay(1000).ContinueWith(_ => InvokeAsync(StateHasChanged));
}
-
- private static (int, int)[] GenerateRandomNumbers(int min, int max)
+ private (int, int)[] advancedItems = GenerateRandomNumbers(1, 51);
+ private async Task HandleOnRefreshAdvanced()
{
- var random = new Random();
- return Enumerable.Range(min, max - min).Select(i => (i, random.Next(min, max))).ToArray();
+ await Task.Delay(2000);
+ advancedItems = GenerateRandomNumbers(1, 51);
+ _ = Task.Delay(1000).ContinueWith(_ => InvokeAsync(StateHasChanged));
}
-
- private readonly string example1RazorCode = @"
-
-
-
- @foreach (var (idx, i) in basicItems)
- {
-
@(idx.ToString().PadLeft(2, '0')). Item @i
- }
-
- @foreach (var (idx, i) in customItems)
- {
-
@(idx.ToString().PadLeft(2, '0')). Item @i
- }
-
-
-
-
- @foreach (var (idx, i) in multiItems1)
- {
-
@(idx.ToString().PadLeft(2, '0')). Item @i
- }
-
-
-
-
-
-
- @foreach (var (idx, i) in multiItems2)
- {
-
@(idx.ToString().PadLeft(2, '0')). Item @i
- }
-
-
-
+ @foreach (var (idx, i) in basicItems)
+ {
+
@(idx.ToString().PadLeft(2, '0')). Item @i
+ }
+
+ @foreach (var (idx, i) in customItems)
+ {
+
@(idx.ToString().PadLeft(2, '0')). Item @i
+ }
+
+
+
+
+ @foreach (var (idx, i) in multiItems1)
+ {
+
@(idx.ToString().PadLeft(2, '0')). Item @i
+ }
+
+
+
+
+
+
+ @foreach (var (idx, i) in multiItems2)
+ {
+
@(idx.ToString().PadLeft(2, '0')). Item @i
+ }
+
+
+
+
+
+
+
+
+
+
+ BlazorUI
+
+
+
+
+
+
+
+ @foreach (var (idx, i) in advancedItems)
+ {
+
@(idx.ToString().PadLeft(2, '0')). Item @i
+ }
+
+
+
+
+
+ @foreach (var (idx, i) in styleItems)
+ {
+
@(idx.ToString().PadLeft(2, '0')). Item @i
+ }
+
+
+
+
+ @foreach (var (idx, i) in classItems)
+ {
+
@(idx.ToString().PadLeft(2, '0')). Item @i
+ }
+
+