LgPasteButton

LgPasteButton is a button that retrieves text from the browser's clipboard when clicked. It derives from LgButton and supports data binding (Value / ValueChanged) as well as validation within an EditForm.

<LgPasteButton @bind-Value="Model.Reference" />

• Namespace: Lagoon.UI.Components
• Inherits from: LgButton → LgAriaComponentBase → LgComponentBase
• NuGet package: Lagoon.UI

Default values

The constructor predefines the icon (IconNames.All.Clipboard), the tooltip (#lgPasteButtonTooltip), and the click action (paste). When the browser does not allow direct access to the clipboard, a paste modal is automatically opened.

Usage

Demonstration

Try this component in the Lagoon showcase.

Data binding

Use @bind-Value to directly assign the pasted text to your model. The component preserves all properties from LgButton for appearance, policies, and shortcuts.

ReferencePastePage.razor

<LgPasteButton @bind-Value="Model.Reference"
               Text="#PasteReference"
               Kind="ButtonKind.Secondary" />

ReferencePastePage.razor.cs

public partial class ReferencePastePage : LgPage
{
    // Field updated by the clipboard when the button is clicked.
    private ReferenceVm Model { get; } = new();

    private sealed class ReferenceVm
    {
        public string Reference { get; set; }
    }
}

With paste interception

OnPaste is triggered before the Value assignment. Modify ClipboardTextEventArg.Value to clean, convert, or replace the pasted value.

ReferencePasteNormalizePage.razor

<LgPasteButton Value="@Model.Reference"
               ValueChanged="OnReferenceChangedAsync"
               OnPaste="NormalizePasteAsync" />

ReferencePasteNormalizePage.razor.cs

public partial class ReferencePasteNormalizePage : LgPage
{
    // Business reference fed either by direct paste or by the ValueChanged callback.
    private ReferenceVm Model { get; } = new();

    // Cleans the text before assignment to store a consistent reference in the model.
    private Task NormalizePasteAsync(ClipboardTextEventArg arg)
    {
        arg.Value = arg.Value?.Trim().ToUpperInvariant();
        return Task.CompletedTask;
    }

    // Updates the model after normalization, as `@bind-Value` would.
    private Task OnReferenceChangedAsync(string value)
    {
        Model.Reference = value;
        return Task.CompletedTask;
    }

    private sealed class ReferenceVm
    {
        public string Reference { get; set; }
    }
}

Validation in a form

In a LgEditForm, provide ValueExpression with the binding to notify the EditContext after the paste and trigger field validation messages.

ReferenceFormPage.razor

<LgEditForm Model="Model">
    <LgPasteButton @bind-Value="Model.Reference"
                   ValueExpression="@(() => Model.Reference)"
                   Text="#PasteReference" />
</LgEditForm>

ReferenceFormPage.razor.cs

public partial class ReferenceFormPage : LgPage
{
    // Model validated by the form: the paste notifies this field via ValueExpression.
    private ReferenceVm Model { get; } = new();

    private sealed class ReferenceVm
    {
        public string Reference { get; set; }
    }
}

Fallback paste modal

If the browser refuses direct access to the clipboard, LgPasteButton automatically opens a paste modal. No additional parameter is required: simply keep OnPaste and ValueChanged to process the final value in the same way.

ReferencePasteFallbackPage.razor

<LgPasteButton @bind-Value="Model.Reference"
               OnPaste="NormalizePasteAsync"
               Tooltip="#PasteReferenceTooltip" />

ReferencePasteFallbackPage.razor.cs

public partial class ReferencePasteFallbackPage : LgPage
{
    // Final value fed by both direct access and the fallback modal.
    private ReferenceVm Model { get; } = new();

    // Applies the same business rule regardless of the paste method used by the browser.
    private Task NormalizePasteAsync(ClipboardTextEventArg arg)
    {
        arg.Value = arg.Value?.Trim();
        return Task.CompletedTask;
    }

    private sealed class ReferenceVm
    {
        public string Reference { get; set; }
    }
}

Properties

Own properties

Name	Type	Default	Declared in	Description
Value	string	null	LgPasteButton	Value retrieved from the clipboard after the click.
ValueChanged	EventCallback<string>	—	LgPasteButton	Callback for updating the bound value (@bind-Value).
ValueExpression	Expression<Func<string>>	null	LgPasteButton	Expression identifying the bound value (EditContext validation).
OnPaste	EventCallback<ClipboardTextEventArg>	—	LgPasteButton	Callback triggered during paste; allows reading or modifying the pasted value.

Inherited properties

LgPasteButton inherits all properties from LgButton (Kind, ButtonSize, Disabled, CssClass, Tooltip, PolicyVisible, etc.).

Cascading parameter

The component consumes the EditContext (CascadingParameter) provided by a parent EditForm: it is used, together with ValueExpression, to trigger field validation after a paste.

Events

Event	Type	Description
OnPaste	EventCallback<ClipboardTextEventArg>	Triggered at the time of paste, before the Value assignment.
ValueChanged	EventCallback<string>	Triggered when the bound value changes.

Parameters inherited from LgButton

Parameter	Type	Description
Text	string	Button label.
IconName	string	Button icon.
ChildContent	RenderFragment	Custom button content.
OnClick	EventCallback<ActionEventArgs>	Triggered on click.
IsSubmit	bool	The button is of type "submit".
ConfirmationMessage	string	Confirmation message before the action (incompatible with CommandName).
CommandName / CommandArgument	string / object	Command sent to the command handler and its argument.
Link / Uri / Target	LgPageLink / string / string	Navigation: typed link, URI to open, target window.
ShortcutKey	string	Character (with CTRL) triggering the click.
PreventDoubleClick	bool	Disables the button during action execution.
PreventDefault / StopPropagation	bool	Event propagation control.
AutoFocus	bool	Gives focus to the component on first render.
PolicyEdit / PolicyVisible	string	Edit/visibility policies.
Tooltip / TooltipIsHtml	string / bool	Tooltip and its format.
AriaLabel / AriaLabelledBy	string	ARIA accessibility.
AdditionalAttributes	IReadOnlyDictionary<string, object>	Additional HTML attributes.

Cascading: ButtonSizeCascading (size inherited from an ancestor) and ParentAuthorizeView (policies of an ancestor).

Associated enumerations

These buttons inherit the enumerations from LgButton: ButtonKind, ButtonSize, TooltipPosition.

Related components

• LgCopyButton — copy to clipboard button.
• LgButton — base button.