Skip to content

Commit

Permalink
add cascading value support
Browse files Browse the repository at this point in the history
  • Loading branch information
msynk committed Dec 21, 2024
1 parent 0a07552 commit d7acaf6
Show file tree
Hide file tree
Showing 7 changed files with 109 additions and 11 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
namespace Bit.BlazorUI;

public class BitCascadingValue
{
public string? Name { get; set; }
public object? Value { get; set; }

public BitCascadingValue() { }

public BitCascadingValue(object? value, string? name = null)
{
Name = name;
Value = value;
}

public static implicit operator BitCascadingValue(int value) => new(value);
public static implicit operator BitCascadingValue(int? value) => new(value);
public static implicit operator BitCascadingValue(bool value) => new(value);
public static implicit operator BitCascadingValue(bool? value) => new(value);
public static implicit operator BitCascadingValue(string value) => new(value);
public static implicit operator BitCascadingValue(BitDir? value) => new(value);
public static implicit operator BitCascadingValue(RouteData value) => new(value);
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
using System.Diagnostics.CodeAnalysis;

namespace Bit.BlazorUI;

public class BitCascadingValueProvider : ComponentBase
{
[DynamicallyAccessedMembers(DynamicallyAccessedMemberTypes.All)]
private Type _cascadingValueType = typeof(CascadingValue<>);

[Parameter] public RenderFragment? ChildContent { get; set; }
[Parameter] public IEnumerable<BitCascadingValue> Values { get; set; } = [];

[DynamicDependency(DynamicallyAccessedMemberTypes.All, typeof(BitCascadingValue))]
protected override void BuildRenderTree(RenderTreeBuilder builder)
{
var seq = 0;
RenderFragment? rf = ChildContent;

foreach (var value in Values)
{
if (value.Value is null) continue;

var r = rf;
var s = seq;
var v = value;

rf = b => { CreateCascadingValue(b, s, v.Name, v.Value, r); };

seq += string.IsNullOrEmpty(v.Name) ? 3 : 4;
}

builder.AddContent(seq, rf);
}


private void CreateCascadingValue(RenderTreeBuilder builder,
int seq,
string? name,
object value,
RenderFragment? childContent)
{
#pragma warning disable IL2055 // Either the type on which the MakeGenericType is called can't be statically determined, or the type parameters to be used for generic arguments can't be statically determined.
builder.OpenComponent(seq, _cascadingValueType.MakeGenericType(value.GetType()));
#pragma warning restore IL2055 // Either the type on which the MakeGenericType is called can't be statically determined, or the type parameters to be used for generic arguments can't be statically determined.
if (string.IsNullOrEmpty(name) is false)
{
builder.AddComponentParameter(++seq, "Name", name);
}
builder.AddComponentParameter(++seq, "Value", value);
builder.AddComponentParameter(++seq, "ChildContent", childContent);
builder.CloseComponent();
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -9,11 +9,13 @@
dir="@Dir?.ToString().ToLower()">
<div style="@Styles?.Top" class="bit-ply-top @Classes?.Top" />
<div style="@Styles?.Center"
class="bit-ply-center @Classes?.Center"
class="bit-ply-center @Classes?.Center"
dir="@Dir?.ToString().ToLower()">
<div style="@Styles?.Left" class="bit-ply-left @Classes?.Left"></div>
<div style="@Styles?.Main" class="bit-ply-main @Classes?.Main">
@ChildContent
<BitCascadingValueProvider Values="Values">
@ChildContent
</BitCascadingValueProvider>
</div>
<div style="@Styles?.Right" class="bit-ply-right @Classes?.Right"></div>
</div>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,11 @@

public partial class BitProLayout : BitComponentBase
{
/// <summary>
/// The cascading values to be provided for the children of the layout.
/// </summary>
[Parameter] public IEnumerable<BitCascadingValue> Values { get; set; } = [];

/// <summary>
/// The content of the layout.
/// </summary>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
@import '../../../Bit.BlazorUI/Styles/functions.scss';
@import '../../Styles/extra-variables.scss';
@import '../../../Bit.BlazorUI/Styles/functions.scss';

.bit-ply {
width: 100%;
Expand All @@ -11,21 +12,21 @@
.bit-ply-top {
width: 100%;
z-index: 999999;
height: var(--bit-env-inset-top);
height: $bit-env-inset-top;
background-color: $clr-bg-pri;
}

.bit-ply-bottom {
width: 100%;
z-index: 999999;
height: var(--bit-env-inset-bottom);
height: $bit-env-inset-bottom;
background-color: $clr-bg-pri;
}

.bit-ply-center {
width: 100%;
display: flex;
height: calc(100% - var(--bit-env-inset-top) - var(--bit-env-inset-bottom));
height: calc(100% - $bit-env-inset-top - $bit-env-inset-bottom);
}

.bit-ply-main {
Expand All @@ -35,19 +36,19 @@
position: relative;
scroll-behavior: smooth;
overscroll-behavior: none;
width: calc(100% - var(--bit-env-inset-left) - var(--bit-env-inset-right));
width: calc(100% - $bit-env-inset-left - $bit-env-inset-right);
}

.bit-ply-left {
height: 100%;
z-index: 999999;
width: var(--bit-env-inset-left);
width: $bit-env-inset-left;
background-color: $clr-bg-pri;
}

.bit-ply-right {
height: 100%;
z-index: 999999;
width: var(--bit-env-inset-right);
width: $bit-env-inset-right;
background-color: $clr-bg-pri;
}
14 changes: 14 additions & 0 deletions src/BlazorUI/Bit.BlazorUI.Extras/Styles/extra-variables.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
$bit-env-inset-top: var(--bit-env-inset-top);
$bit-env-inset-left: var(--bit-env-inset-left);
$bit-env-inset-right: var(--bit-env-inset-right);
$bit-env-inset-bottom: var(--bit-env-inset-bottom);
//--
$bit-env-width-vw: var(--bit-env-width-vw);
$bit-env-height-vh: var(--bit-env-height-vh);
$bit-env-width-percent: var(--bit-env-width-per);
$bit-env-height-percent: var(--bit-env-height-per);
$bit-env-width-available: var(--bit-env-width-avl);
$bit-env-height-available: var(--bit-env-height-avl);
//--
$bit-env-inset-inline-start: var(--bit-env-inset-inline-start);
$bit-env-inset-inline-end: var(--bit-env-inset-inline-end);
4 changes: 2 additions & 2 deletions src/BlazorUI/Bit.BlazorUI.Extras/Styles/general.scss
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,8 @@
--bit-env-height-vh: calc(100vh - var(--bit-env-inset-top) - var(--bit-env-inset-bottom));
--bit-env-width-per: calc(100% - var(--bit-env-inset-left) - var(--bit-env-inset-right));
--bit-env-height-per: calc(100% - var(--bit-env-inset-top) - var(--bit-env-inset-bottom));
--bit-env-width: calc(var(--win-width) - var(--bit-env-inset-left) - var(--bit-env-inset-right));
--bit-env-height: calc(var(--win-height) - var(--bit-env-inset-top) - var(--bit-env-inset-bottom));
--bit-env-width-avl: calc(var(--win-width) - var(--bit-env-inset-left) - var(--bit-env-inset-right));
--bit-env-height-avl: calc(var(--win-height) - var(--bit-env-inset-top) - var(--bit-env-inset-bottom));
//--
--bit-env-inset-inline-start: var(--bit-env-inset-left);
--bit-env-inset-inline-end: var(--bit-env-inset-right);
Expand Down

0 comments on commit d7acaf6

Please sign in to comment.