Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/devritter/blazortoolkit

useful components and utilities for Blazor developers
https://github.com/devritter/blazortoolkit

blazor productivity utility

Last synced: 7 days ago
JSON representation

useful components and utilities for Blazor developers

Awesome Lists containing this project

README

        

# BlazorToolkit

Useful components and utilities for Blazor developers

## BzComponentBase

Your new component base class with:

* `Logger` property
* `InvokeAsyncStateHasChanged()` method
* `OnDispose()` method to override

and more to come!

### Registration:

**Per component:**

```
@inherits BlazingDev.BlazorToolkit.Components.BzComponentBase
```

**Globally:**

Locate `_Imports.razor` and add the following line to set the base component for all `*.razor` files in the same
directory and subdirectories:

```
@inherits BlazingDev.BlazorToolkit.Components.BzComponentBase
```

## BzTimerComponent

A blazor component that wraps a Timer instance. \
Automatically handles:

* Creating the `Timer`
* Calling `InvokeAsync()`
* Calling `StateHasChanged()` when using the `OnElapsed` `EventCallback`
* `OnElapsedAction` when you want to manually decide if any re-rendering is needed
* `try-catch` of the elapsed handlers
* disposing the timer when the component is unmounted

And you can use `ShowControls` for testing purposes which let you override the `Enabled` and `Interval` setting!

```xml

```

## BzCssClassBuilder

A utility class to help creating CSS classes lists.

* static `Create` methods to not use spaces (sometimes handy in razor files)
* `Add(className)`, `Add(listOfClassNames)`, `AddIf(condition, className)`
* `Remove(className)`, `RemoveIf(condition, className)`
* automatically trimes classNames
* ignores duplicates and no-content classNames
* use `Build()` or `ToString()` to get your final string

### Usage Example:

```csharp
@{
var cssClasses = BzCssClassBuilder.Create("my-button")
.Add("button-primary")
.AddIf(isOutline, "button-outline")
.Add(SomeSettings.AdditionalButtonClasses) // e.g. theme-specific
.Build()
}
...
```

## BzCssStyleBuilder

A utility class for building CSS styles conditionally and fluently.

### Usage:

```csharp
var style = new BzCssStyleBuilder()
.Add("color", "red")
.Add("font-size", UserFontSize, "em")
.AddIf(isBold, "font-weight", "bold")
.AddIf(concreteWidth, "width", CalculateWidthFunction, "px")
.Add(Style) // from component parameter
.Build();
```