Code/UI/Components/PinButton.razor
@using Sandbox.UI
@inherits Button
@implements IGraphStyle
@namespace Nodebox.UI

<root class="@(Flow == Flow.Output ? "output" : "input") @(Shape.ToString().ToLower())">
    <div id="arrow" @ref=ArrowPanel/>
</root>

@code
{
    protected Panel ArrowPanel { get; set; }

    public Color Color { get; set; }
    public PinShape Shape { get; set; }
    public Flow Flow { get; set; }
    public PinIndex Index { get; set; }
    
    public PinRef PinRef {
        get => new(Node, Flow, Index);
        set {
            Node = value.Node;
            Flow = value.Flow;
            Index = value.Index;
        }
    }
    
    private WeakReference<Node> WeakNode { get; set; } = new(null);
    public Node Node {
        get {
            WeakNode.TryGetTarget(out var target);
            return target;
        }
        set {
            WeakNode.SetTarget(value);
        }
    }

    protected override void OnAfterTreeRender(bool firstTime) {
        var colorStr = Color.ToString(true, false);
        Style.Set("background-color", colorStr);
        if (Shape == PinShape.Arrow) {
            Style.Set("background-color", "transparent");
        }
        @* ArrowPanel.Style.Set("background-color", colorStr); *@
        ArrowPanel.Style.Set("background-image-tint", colorStr);
    }

    protected override int BuildHash() => System.HashCode.Combine( Color, Shape, Flow );
}