LgMonthBox

LgMonthBox<TValue> permet de sélectionner un mois (et son année). Il fait partie de la famille des champs date (LgDateBox) dont il hérite tout le comportement : le calendrier s'ouvre directement au niveau mois. Le type lié peut être une date (DateOnly, DateTime, DateTimeOffset ou nullable) ou un int / int? — la valeur est alors le numéro du mois (1-12), sans année.

<LgMonthBox Label="#BillingMonth" @bind-Value="_model.BillingMonth" />

• Espace de noms : Lagoon.UI.Components
• Hérite de : LgDateBox<TValue> → LgInputRenderBase<TValue> → LgInputBase<TValue> → LgAriaComponentBase → LgComponentBase
• Package NuGet : Lagoon.UI

Le suffixe du champ est réservé : le composant y place automatiquement l'icône calendrier (Suffix / SuffixType sont écrasés à l'initialisation).

Utilisation

Démonstration

Essayez ce composant dans le showcase Lagoon.

Sélection simple

BillingPage.razor

<LgMonthBox Label="#BillingMonth" @bind-Value="_model.BillingMonth" />

BillingPage.razor.cs

public partial class BillingPage : LgPage
{
    private readonly BillingVm _model = new();

    private sealed class BillingVm
    {
        public DateTime? BillingMonth { get; set; }
    }
}

Bornes de sélection

Min et Max désactivent les mois hors bornes dans le calendrier.

PeriodPage.razor

<LgMonthBox Label="#Period"
            Min="_minDate"
            Max="_maxDate"
            @bind-Value="_model.Period" />

PeriodPage.razor.cs

public partial class PeriodPage : LgPage
{
    // Exercice comptable courant : borne la sélection de mois.
    private readonly DateTime _minDate = new(2026, 1, 1);
    private readonly DateTime _maxDate = new(2026, 12, 31);

    private readonly PeriodVm _model = new();

    private sealed class PeriodVm
    {
        public DateOnly? Period { get; set; }
    }
}

Mois seul (sans année)

Lié à un int?, le composant ne porte que le numéro du mois (1-12) : la navigation par année est désactivée dans le calendrier et l'affichage ne montre que le mois.

AnniversaryPage.razor

<LgMonthBox Label="#AnniversaryMonth" @bind-Value="_model.AnniversaryMonth" />

AnniversaryPage.razor.cs

public partial class AnniversaryPage : LgPage
{
    private readonly AnniversaryVm _model = new();

    private sealed class AnniversaryVm
    {
        // int? : seule l'information « quel mois » est stockée, sans année.
        public int? AnniversaryMonth { get; set; }
    }
}

Réagir au changement de valeur

OnChangingAsync (hérité de LgDateBox) est appelé avant l'affectation et permet d'annuler le changement (args.Cancel) ; OnChange est appelé après.

ClosingPage.razor

<LgMonthBox Label="#ClosingMonth"
            OnChangingAsync="OnClosingMonthChangingAsync"
            @bind-Value="_model.ClosingMonth" />

ClosingPage.razor.cs

public partial class ClosingPage : LgPage
{
    private readonly ClosingVm _model = new();

    // Appelé avant le changement : refuse un mois de clôture déjà validé.
    private Task OnClosingMonthChangingAsync(ChangingEventArgs<DateTime?> args)
    {
        if (args.NewValue < DateTime.Today.AddMonths(-1))
        {
            args.Cancel = true;
            ShowWarning("#ClosingMonthLocked");
        }
        return Task.CompletedTask;
    }

    private sealed class ClosingVm
    {
        public DateTime? ClosingMonth { get; set; }
    }
}

Propriétés

Toutes les propriétés [Parameter] du composant, y compris celles héritées.

Nom	Type	Défaut	Déclaré dans	Description
AssumeNearbyYear	int	20	LgDateBox	Nombre d'années dans le futur pendant lesquelles une année saisie sur deux chiffres est rattachée au siècle courant. Une valeur inférieure à 1 désactive ce comportement.
DefaultDateTimeKind	DateTimeKind	Unspecified	LgDateBox	DateTimeKind utilisé pour créer un nouveau DateTime.
DefaultTime	TimeOnly?	null	LgDateBox	Heure utilisée pour créer un nouveau DateTime ou DateTimeOffset (minuit si null).
DefaultTimeOffset	TimeSpan?	null	LgDateBox	Décalage horaire utilisé pour créer un nouveau DateTimeOffset (décalage du fuseau local si null).
DisplayFormat	string	null	LgDateBox	Format d'affichage. Si null, le format de date court de la culture courante est utilisé, sans la partie jour (et sans l'année pour un int).
KeyboardDisabled	bool	false	LgDateBox	Interdit la modification au clavier : la valeur ne peut être choisie que dans le calendrier.
Max	DateTime?	null	LgDateBox	Mois le plus tardif sélectionnable ; les mois ultérieurs sont désactivés.
Min	DateTime?	null	LgDateBox	Mois le plus ancien sélectionnable ; les mois antérieurs sont désactivés.
OnChangeDisabled	bool	false	LgDateBox	Désactive l'événement onchange DOM au profit de oninput (utilisé pour éviter des erreurs quand le contrôle est retiré du rendu).
OnChangingAsync	Func<ChangingEventArgs<TValue>, Task>	null	LgDateBox	Callback appelé avant le changement de valeur ; le changement peut y être annulé.
OnFocus	EventCallback<FocusEventArgs>	—	LgDateBox	Callback appelé à la prise de focus.
Placeholder	string	null	LgDateBox	Texte indicatif affiché quand le champ est vide.
WeekStart	DayOfWeek	Monday	LgDateBox	Premier jour de la semaine dans le calendrier.
Prefix	string	null	LgInputRenderBase	Préfixe affiché dans le champ.
PrefixType	InputLabelType	Text	LgInputRenderBase	Nature du préfixe.
Suffix	string	(icône calendrier)	LgInputRenderBase	Suffixe affiché dans le champ. Réservé : le composant y place l'icône calendrier.
SuffixType	InputLabelType	IconName	LgInputRenderBase	Nature du suffixe. Réservé par le composant.
AdditionalAttributes	IReadOnlyDictionary<string, object>	null	LgInputBase	Attributs HTML additionnels appliqués à l'élément rendu.
AutoFocus	bool	false	LgInputBase	Donne le focus au champ lors du premier rendu.
ConfirmationMessage	string	null	LgInputBase	Message de confirmation affiché avant d'appliquer un changement de valeur.
Container	IInputContainer<TValue>	null	LgInputBase	Usage interne : rattache une cellule de GridView au champ.
CssClass	string	null	LgInputBase	Classes CSS additionnelles.
Disabled	bool	false	LgInputBase	Désactive le champ.
DisplayName	string	null	LgInputBase	Nom du champ utilisé dans les messages d'erreur de saisie.
HideValidationMessage	bool	false	LgInputBase	Masque le message de validation sous le champ.
Label	string	null	LgInputBase	Libellé du champ.
LabelContent	RenderFragment	null	LgInputBase	Contenu personnalisé de la zone de libellé.
OnChange	EventCallback<ChangeEventArgs>	—	LgInputBase	Callback appelé après le changement de valeur.
OnReset	EventCallback<ChangeEventArgs>	—	LgInputBase	Callback appelé quand le champ est réinitialisé par le bouton d'effacement.
PolicyEdit	string	null	LgInputBase	Policy requise pour modifier le champ.
PolicyVisible	string	null	LgInputBase	Policy requise pour afficher le champ.
ReadOnly	bool	false	LgInputBase	Affiche le champ en lecture seule.
Required	bool?	null	LgInputBase	Champ obligatoire. Si null, déduit de l'attribut [Required] de la propriété liée.
ResetButton	bool?	null	LgInputBase	Affiche le bouton d'effacement. Si null, la configuration de comportement de l'application s'applique.
ResetText	string	null	LgInputBase	Texte du bouton d'effacement.
ResetTextAriaLabel	string	null	LgInputBase	Libellé accessible (aria-label) du bouton d'effacement.
Tooltip	string	null	LgInputBase	Bulle d'aide.
TooltipIsHtml	bool	false	LgInputBase	Indique si le contenu du Tooltip est au format HTML (sinon texte brut).
Value	TValue	—	LgInputBase	Valeur liée (@bind-Value) : date (DateOnly, DateTime, DateTimeOffset ou nullable) ou int / int? (numéro du mois).
ValueChanged	EventCallback<TValue>	—	LgInputBase	Callback de mise à jour de la valeur liée.
ValueExpression	Expression<Func<TValue>>	—	LgInputBase	Expression identifiant la propriété liée.
AriaLabel	string	null	LgAriaComponentBase	Valeur de l'attribut aria-label.
AriaLabelledBy	string	null	LgAriaComponentBase	Valeur de l'attribut aria-labelledby.

Paramètres en cascade

LgMonthBox consomme aussi des paramètres fournis automatiquement par des composants ancêtres (vous n'avez pas à les définir) : ParentAuthorizeView (LgAuthorizeView) et le contexte d'édition d'un LgEditForm parent.

Événements

Événement	Type	Description
OnChangingAsync	Func<ChangingEventArgs<TValue>, Task>	Avant le changement de valeur ; args.Cancel = true annule le changement.
OnChange	EventCallback<ChangeEventArgs>	Après le changement de valeur.
OnFocus	EventCallback<FocusEventArgs>	À la prise de focus du champ.
OnReset	EventCallback<ChangeEventArgs>	À la réinitialisation par le bouton d'effacement.

Énumérations associées

L'énumération InputLabelType (préfixe / suffixe) est documentée sur LgDateBox, le composant de base de la famille date.

Bonnes pratiques / accessibilité

• Liée à une date, la valeur porte le premier jour du mois ; liée à un int?, elle ne porte que le numéro du mois — choisissez le type selon que l'année compte ou non.
• Ne définissez pas Suffix / SuffixType : ils sont écrasés par l'icône calendrier à l'initialisation du composant.

Référence complète

Tous les paramètres (hérités compris) : Référence API — LgMonthBox.

Composants liés

• LgDateBox — sélection d'un jour (composant de base).
• LgWeekBox — sélection d'une semaine.
• LgYearBox — sélection d'une année.
• LgGridMonthColumn — colonne mois d'un LgGridView.