
LinkButton
Provider A html tag as Button
Set IsDisabled
for disable the link button
Demo
Attributes
@page "/linkbuttons"
<h3>LinkButton</h3>
<h4>Provider A html tag as Button</h4>
<DemoBlock Title="LinkButton" Introduction="Set <code>Text</code> for displayed text" Name="Text">
<LinkButton Text="LinkButton" />
</DemoBlock>
<DemoBlock Title="Navigation Url" Introduction="Set <code>Url</code> for navigation Url" Name="Url">
<LinkButton Text="LinkButton" Url="@WebsiteOption.CurrentValue.ServerUrl" />
</DemoBlock>
<DemoBlock Title="Tooltip" Introduction="Set <code>Title</code> for tooltip" Name="Title">
<p>show <code>Tooltip</code> when hover on this button</p>
<LinkButton Text="LinkButton" TooltipText="this is Tooltip title" />
</DemoBlock>
<DemoBlock Title="Image" Introduction="Set <code>ImageUrl</code> for image" Name="Image">
<LinkButton ImageUrl="_content/BootstrapBlazor.Shared/images/Argo-C.png" />
</DemoBlock>
<DemoBlock Title="Icon" Introduction="Set <code>Icon</code> for display as icon button" Name="Icon">
<LinkButton Icon="fa-solid fa-font-awesome" />
</DemoBlock>
<DemoBlock Title="Template" Introduction="Set <code>ChildContent</code> for customer template" Name="ChildContent">
<LinkButton>
<i class="fa-solid fa-font-awesome"></i>
<span>LinkButton</span>
</LinkButton>
</DemoBlock>
<DemoBlock Title="OnClick" Introduction="Set <code>OnClick</code> handler onclick event" Name="OnClick">
<LinkButton Text="LinkButton" OnClick="@OnClick" />
<BlockLogger @ref="Trace" class="mt-3" />
</DemoBlock>
<DemoBlock Title="Disabled" Introduction="Set <code>IsDisabled</code> for disable the link button" Name="IsDisabled">
<div class="row g-3">
<div class="col-6 col-sm-4 col-md-3 col-lg-auto">
<LinkButton IsDisabled="true" Color="Color.Primary">Disabled</LinkButton>
</div>
</div>
</DemoBlock>
<DemoBlock Title="Color" Introduction="Set <code>Color</code> change the color of text" Name="Color">
<div class="row g-3">
<div class="col-6 col-sm-4 col-md-3 col-lg-auto">
<LinkButton Color="Color.Danger">Button</LinkButton>
</div>
</div>
</DemoBlock>
<DemoBlock Title="Vertical" Introduction="Set <code>IsVertical</code> for vertical layout the icon and text" Name="IsVertical">
<div class="row g-3">
<div class="col-6 col-sm-4 col-md-3 col-lg-auto">
<LinkButton IsVertical="true" Icon="fa-solid fa-pen" Text="TestButton" />
</div>
<div class="col-6 col-sm-4 col-md-3 col-lg-auto">
<LinkButton IsVertical="true" Icon="fa-solid fa-pen" Text="TestButton" IsDisabled="true" />
</div>
</div>
</DemoBlock>
<AttributeTable Items="GetAttributes()"></AttributeTable>
// Copyright (c) Argo Zhang (argo@163.com). All rights reserved.
// Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
// Website: https://www.blazor.zone or https://argozhang.github.io/
using Microsoft.Extensions.Options;
namespace BootstrapBlazor.Shared.Samples;
/// <summary>
///
/// </summary>
public sealed partial class LinkButtons
{
[Inject]
[NotNull]
private IOptionsMonitor<WebsiteOptions>? WebsiteOption { get; set; }
[Inject]
[NotNull]
private IStringLocalizer<LinkButtons>? Localizer { get; set; }
[NotNull]
private BlockLogger? Trace { get; set; }
private void OnClick()
{
Trace.Log($"{DateTimeOffset.Now}: Clicked!");
}
/// <summary>
///
/// </summary>
/// <returns></returns>
private IEnumerable<AttributeItem> GetAttributes() => new AttributeItem[]
{
new AttributeItem(){
Name = nameof(LinkButton.Text),
Description = Localizer[nameof(LinkButton.Text)],
Type = "string",
ValueList = " — ",
DefaultValue = " — "
},
new AttributeItem(){
Name = nameof(LinkButton.Url),
Description = Localizer[nameof(LinkButton.Url)],
Type = "string",
ValueList = " — ",
DefaultValue = "#"
},
new AttributeItem(){
Name = nameof(LinkButton.TooltipText),
Description = Localizer[nameof(LinkButton.TooltipText)],
Type = "string",
ValueList = " — ",
DefaultValue = " — "
},
new AttributeItem(){
Name = nameof(LinkButton.ImageUrl),
Description = Localizer[nameof(LinkButton.ImageUrl)],
Type = "string",
ValueList = " — ",
DefaultValue = " — "
},
new AttributeItem(){
Name = nameof(LinkButton.Icon),
Description = Localizer[nameof(LinkButton.Icon)],
Type = "string",
ValueList = " — ",
DefaultValue = " — "
},
new AttributeItem(){
Name = nameof(LinkButton.TooltipPlacement),
Description = Localizer[nameof(LinkButton.TooltipPlacement)],
Type = "Placement",
ValueList = "Top/Left/Right/Bottom",
DefaultValue = "Top"
},
new AttributeItem(){
Name = nameof(LinkButton.ChildContent),
Description = Localizer[nameof(LinkButton.ChildContent)],
Type = "RenderFragment",
ValueList = " — ",
DefaultValue = " — "
},
new AttributeItem() {
Name = nameof(LinkButton.OnClick),
Description = Localizer[nameof(LinkButton.OnClick)],
Type = "EventCallback<MouseEventArgs>",
ValueList = "—",
DefaultValue = " — "
}
};
}