**Basic**: private List basicItems = [ new() { Text = "Item A", Key = "A" }, new() { Text = "Item B", Key = "B", IsEnabled = false }, new() { Text = "Item C", Key = "C" } ]; **Split**: private List basicItems = [ new() { Text = "Item A", Key = "A" }, new() { Text = "Item B", Key = "B", IsEnabled = false }, new() { Text = "Item C", Key = "C" } ]; **Variant**: private List basicItems = [ new() { Text = "Item A", Key = "A" }, new() { Text = "Item B", Key = "B", IsEnabled = false }, new() { Text = "Item C", Key = "C" } ]; **Sticky**: private List basicItems = [ new() { Text = "Item A", Key = "A" }, new() { Text = "Item B", Key = "B", IsEnabled = false }, new() { Text = "Item C", Key = "C" } ]; **Icons**: private List basicItemsIcon = [ new() { Text = "Item A", Key = "A", IconName = BitIconName.Emoji }, new() { Text = "Item B", Key = "B", IconName = BitIconName.Emoji, IsEnabled = false }, new() { Text = "Item C", Key = "C", IconName = BitIconName.Emoji2 } ]; **Style & Class**: private List basicItems = new() { new() { Text = "Item A", Key = "A" }, new() { Text = "Item B", Key = "B", IsEnabled = false }, new() { Text = "Item C", Key = "C" } }; private static List itemStyleClassItems = [ new() { Text = "Item A (Default)", Key = "A", IconName = BitIconName.Emoji, Style = "color: brown" }, new() { Text = "Item C (Styled)", Key = "B", IconName = BitIconName.Emoji, Style = "color: tomato; border-color: brown; background-color: peachpuff;" }, new() { Text = "Item B (Classed)", Key = "C", IconName = BitIconName.Emoji2, Class = "custom-item" } ]; **Background**: private List basicItems = [ new() { Text = "Item A", Key = "A" }, new() { Text = "Item B", Key = "B", IsEnabled = false }, new() { Text = "Item C", Key = "C" } ]; **Toggle**:

OnToggleChange: @itemToggledValue

private bool itemIsToggled; private bool itemToggledValue; private List basicItems = [ new() { Text = "Item A", Key = "A" }, new() { Text = "Item B", Key = "B", IsEnabled = false }, new() { Text = "Item C", Key = "C" } ]; **NoIcon**: private List basicItemsIcon = [ new() { Text = "Item A", Key = "A", IconName = BitIconName.Emoji }, new() { Text = "Item B", Key = "B", IconName = BitIconName.Emoji, IsEnabled = false }, new() { Text = "Item C", Key = "C", IconName = BitIconName.Emoji2 } ]; **Templates**:

Custom Header!

@item.Text (@item.Key)

private List basicItems = [ new() { Text = "Item A", Key = "A" }, new() { Text = "Item B", Key = "B", IsEnabled = false }, new() { Text = "Item C", Key = "C" } ]; private List itemTemplateItems = [ new() { Text = "Add", Key = "add-key", IconName = BitIconName.Add }, new() { Text = "Edit", Key = "edit-key", IconName = BitIconName.Edit }, new() { Text = "Delete", Key = "delete-key", IconName = BitIconName.Delete } ]; private List itemTemplateItems2 = [ new() { Text = "Add", Key = "add-key", IconName = BitIconName.Add, Template = (item => @

@item.Text (@item.Key)

) }, new () { Text = "Edit", Key = "edit-key", IconName = BitIconName.Edit, Template = (item => @

@item.Text (@item.Key)

) }, new() { Text = "Delete", Key = "delete-key", IconName = BitIconName.Delete, Template = (item => @

@item.Text (@item.Key)

) } ]; **Events**:

Changed item: @eventsChangedItem

Clicked item: @eventsClickedItem

private string? eventsClickedItem; private string? eventsChangedItem; private List basicItems = [ new() { Text = "Item A", Key = "A" }, new() { Text = "Item B", Key = "B", IsEnabled = false }, new() { Text = "Item C", Key = "C" } ]; private List basicItemsOnClick = [ new() { Text = "Item A", Key = "A", IconName = BitIconName.Emoji }, new() { Text = "Item B", Key = "B", IconName = BitIconName.Emoji, IsEnabled = false }, new() { Text = "Item C", Key = "C", IconName = BitIconName.Emoji2 } ]; protected override void OnInitialized() { Action onClick = item => { eventsClickedItem = $"{item.Text}"; StateHasChanged(); }; basicItemsOnClick.ForEach(i => i.OnClick = onClick); } **Binding**: private BitMenuButtonItem twoWaySelectedItem = default!; private bool oneWayIsOpen; private bool twoWayIsOpen; private static List basicItems = [ new() { Text = "Item A", Key = "A" }, new() { Text = "Item B", Key = "B", IsEnabled = false }, new() { Text = "Item C", Key = "C" } ]; private static IEnumerable> choiceGroupItems = basicItems.Select(i => new BitChoiceGroupItem() { Id = i.Key, Text = i.Text, IsEnabled = i.IsEnabled, Value = i }); private List isSelectedItems = [ new() { Text = "Item A", Key = "A", IconName = BitIconName.Emoji }, new() { Text = "Item B", Key = "B", IconName = BitIconName.Emoji }, new() { Text = "Item C", Key = "C", IconName = BitIconName.Emoji2, IsSelected = true } ]; protected override void OnInitialized() { twoWaySelectedItem = basicItems[2]; } **External Icons**: private static List externalIconItems = [ new() { Text = "Add", Icon = "fa-solid fa-plus" }, new() { Text = "Edit", Icon = BitIconInfo.Css("fa-solid fa-pen") }, new() { Text = "Delete", Icon = BitIconInfo.Fa("solid trash") } ]; **Color**: private List basicItems = [ new() { Text = "Item A", Key = "A" }, new() { Text = "Item B", Key = "B", IsEnabled = false }, new() { Text = "Item C", Key = "C" } ]; **Size**: private List basicItems = [ new() { Text = "Item A", Key = "A" }, new() { Text = "Item B", Key = "B", IsEnabled = false }, new() { Text = "Item C", Key = "C" } ]; **RTL**: private static List rtlItemsIcon = [ new() { Text = "گزینه الف", Key = "A", IconName = BitIconName.Emoji }, new() { Text = "گزینه ب", Key = "B", IconName = BitIconName.Emoji }, new() { Text = "گزینه ج", Key = "C", IconName = BitIconName.Emoji2 } ];

**Basic**: public class Operation { public string? Id { get; set; } public string? Name { get; set; } public string? Image { get; set; } public bool Disabled { get; set; } } private List basicCustoms = [ new() { Name = "Custom A", Id = "A" }, new() { Name = "Custom B", Id = "B", Disabled = true }, new() { Name = "Custom C", Id = "C" } ]; private BitMenuButtonNameSelectors nameSelectors = new() { Text = { Name = nameof(Operation.Name) }, Key = { Name = nameof(Operation.Id) }, IconName = { Name = nameof(Operation.Image) }, IsEnabled = { Selector = m => m.Disabled is false } }; **Split**: public class Operation { public string? Id { get; set; } public string? Name { get; set; } public string? Image { get; set; } public bool Disabled { get; set; } } private List basicCustoms = [ new() { Name = "Custom A", Id = "A" }, new() { Name = "Custom B", Id = "B", Disabled = true }, new() { Name = "Custom C", Id = "C" } ]; private BitMenuButtonNameSelectors nameSelectors = new() { Text = { Name = nameof(Operation.Name) }, Key = { Name = nameof(Operation.Id) }, IconName = { Name = nameof(Operation.Image) }, IsEnabled = { Selector = m => m.Disabled is false } }; **Variant**: public class Operation { public string? Id { get; set; } public string? Name { get; set; } public string? Image { get; set; } public bool Disabled { get; set; } } private List basicCustoms = [ new() { Name = "Custom A", Id = "A" }, new() { Name = "Custom B", Id = "B", Disabled = true }, new() { Name = "Custom C", Id = "C" } ]; private BitMenuButtonNameSelectors nameSelectors = new() { Text = { Name = nameof(Operation.Name) }, Key = { Name = nameof(Operation.Id) }, IconName = { Name = nameof(Operation.Image) }, IsEnabled = { Selector = m => m.Disabled is false } }; **Sticky**: public class Operation { public string? Id { get; set; } public string? Name { get; set; } public string? Image { get; set; } public bool Disabled { get; set; } } private List basicCustoms = [ new() { Name = "Custom A", Id = "A" }, new() { Name = "Custom B", Id = "B", Disabled = true }, new() { Name = "Custom C", Id = "C" } ]; private BitMenuButtonNameSelectors nameSelectors = new() { Text = { Name = nameof(Operation.Name) }, Key = { Name = nameof(Operation.Id) }, IconName = { Name = nameof(Operation.Image) }, IsEnabled = { Selector = m => m.Disabled is false } }; **Icons**: public class Operation { public string? Id { get; set; } public string? Name { get; set; } public string? Image { get; set; } public bool Disabled { get; set; } } private static List basicIconCustoms = [ new() { Name = "Custom A", Id = "A", Image = BitIconName.Emoji }, new() { Name = "Custom B", Id = "B", Image = BitIconName.Emoji, Disabled = true }, new() { Name = "Custom C", Id = "C", Image = BitIconName.Emoji2 } ]; private BitMenuButtonNameSelectors nameSelectors = new() { Text = { Name = nameof(Operation.Name) }, Key = { Name = nameof(Operation.Id) }, IconName = { Name = nameof(Operation.Image) }, IsEnabled = { Selector = m => m.Disabled is false } }; **Style & Class**: public class Operation { public string? Id { get; set; } public string? Name { get; set; } public string? Image { get; set; } public bool Disabled { get; set; } } private static List itemStyleClassCustoms = [ new() { Name = "Custom A (Default)", Id = "A", Image = BitIconName.Emoji, Style = "color: brown" }, new() { Name = "Custom B (Styled)", Id = "B", Image = BitIconName.Emoji, Style = "color: tomato; border-color: brown; background-color: peachpuff;" }, new() { Name = "Custom C (Classed)", Id = "C", Image = BitIconName.Emoji2, Class = "custom-item" }, ]; private BitMenuButtonNameSelectors nameSelectors = new() { Text = { Name = nameof(Operation.Name) }, Key = { Name = nameof(Operation.Id) }, IconName = { Name = nameof(Operation.Image) }, IsEnabled = { Selector = m => m.Disabled is false } }; **Background**: private List basicCustoms = [ new() { Name = "Custom A", Id = "A" }, new() { Name = "Custom B", Id = "B", Disabled = true }, new() { Name = "Custom C", Id = "C" } ]; private BitMenuButtonNameSelectors nameSelectors = new() { Text = { Name = nameof(Operation.Name) }, Key = { Name = nameof(Operation.Id) }, IconName = { Name = nameof(Operation.Image) }, IsEnabled = { Selector = m => m.Disabled is false } }; **Toggle**:

OnToggleChange: @customToggledValue

private bool customIsToggled; private bool customToggledValue; private List basicCustoms = [ new() { Name = "Custom A", Id = "A" }, new() { Name = "Custom B", Id = "B", Disabled = true }, new() { Name = "Custom C", Id = "C" } ]; private BitMenuButtonNameSelectors nameSelectors = new() { Text = { Name = nameof(Operation.Name) }, Key = { Name = nameof(Operation.Id) }, IconName = { Name = nameof(Operation.Image) }, IsEnabled = { Selector = m => m.Disabled is false } }; **NoIcon**: private List basicIconCustoms = [ new() { Name = "Custom A", Id = "A", Image = BitIconName.Emoji }, new() { Name = "Custom B", Id = "B", Image = BitIconName.Emoji, Disabled = true }, new() { Name = "Custom C", Id = "C", Image = BitIconName.Emoji2 } ]; private BitMenuButtonNameSelectors nameSelectors = new() { Text = { Name = nameof(Operation.Name) }, Key = { Name = nameof(Operation.Id) }, IconName = { Name = nameof(Operation.Image) }, IsEnabled = { Selector = m => m.Disabled is false } }; **Templates**:

Custom Header!

@item.Name (@item.Id)

public class Operation { public string? Id { get; set; } public string? Name { get; set; } public string? Image { get; set; } public bool Disabled { get; set; } public RenderFragment? Fragment { get; set; } } private List basicCustoms = [ new() { Name = "Custom A", Id = "A" }, new() { Name = "Custom B", Id = "B", Disabled = true }, new() { Name = "Custom C", Id = "C" } ]; private List itemTemplateCustoms = [ new() { Name = "Add", Id = "add-key", Image = BitIconName.Add }, new() { Name = "Edit", Id = "edit-key", Image = BitIconName.Edit }, new() { Name = "Delete", Id = "delete-key", Image = BitIconName.Delete } ]; private List itemTemplateCustoms2 = [ new() { Name = "Add", Id = "add-key", Image = BitIconName.Add, Fragment = (item => @

@item.Name (@item.Id)

) }, new() { Name = "Edit", Id = "edit-key", Image = BitIconName.Edit, Fragment = (item => @

@item.Name (@item.Id)

) }, new() { Name = "Delete", Id = "delete-key", Image = BitIconName.Delete, Fragment = (item => @

@item.Name (@item.Id)

) } ]; private BitMenuButtonNameSelectors nameSelectors = new() { Text = { Name = nameof(Operation.Name) }, Key = { Name = nameof(Operation.Id) }, IconName = { Name = nameof(Operation.Image) }, IsEnabled = { Selector = m => m.Disabled is false }, Template = { Name = nameof(Operation.Fragment) } }; **Events**:

Changed custom item: @eventsChangedCustom

Clicked custom item: @eventsClickedCustom

public class Operation { public string? Id { get; set; } public string? Name { get; set; } public string? Image { get; set; } public bool Disabled { get; set; } } private List basicCustoms = [ new() { Name = "Custom A", Id = "A" }, new() { Name = "Custom B", Id = "B", Disabled = true }, new() { Name = "Custom C", Id = "C" } ]; private List basicCustomsOnClick = [ new() { Name = "Custom A", Id = "A", Image = BitIconName.Emoji }, new() { Name = "Custom B", Id = "B", Image = BitIconName.Emoji }, new() { Name = "Custom C", Id = "C", Image = BitIconName.Emoji2 } ]; private BitMenuButtonNameSelectors nameSelectors = new() { Text = { Name = nameof(Operation.Name) }, Key = { Name = nameof(Operation.Id) }, IconName = { Name = nameof(Operation.Image) }, IsEnabled = { Selector = m => m.Disabled is false } }; **Binding**: private Operation twoWaySelectedCustom = default!; private bool oneWayIsOpen; private bool twoWayIsOpen; public class Operation { public string? Id { get; set; } public string? Name { get; set; } public string? Image { get; set; } public bool Disabled { get; set; } } private List basicCustoms = [ new() { Name = "Custom A", Id = "A" }, new() { Name = "Custom B", Id = "B", Disabled = true }, new() { Name = "Custom C", Id = "C" } ]; private static List isSelectedCustoms = [ new() { Name = "Custom A", Id = "A", Image = BitIconName.Emoji }, new() { Name = "Custom B", Id = "B", Image = BitIconName.Emoji }, new() { Name = "Custom C", Id = "C", Image = BitIconName.Emoji2, IsSelected = true } ]; private BitMenuButtonNameSelectors nameSelectors = new() { Text = { Name = nameof(Operation.Name) }, Key = { Name = nameof(Operation.Id) }, IconName = { Name = nameof(Operation.Image) }, IsEnabled = { Selector = m => m.Disabled is false } }; **External Icons**: public class Operation { public string? Id { get; set; } public string? Name { get; set; } public string? Image { get; set; } public BitIconInfo? IconInfo { get; set; } public bool Disabled { get; set; } } private static List externalIconCustoms = [ new() { Name = "Add", IconInfo = "fa-solid fa-plus" }, new() { Name = "Edit", IconInfo = BitIconInfo.Css("fa-solid fa-pen") }, new() { Name = "Delete", IconInfo = BitIconInfo.Fa("solid trash") } ]; private BitMenuButtonNameSelectors nameSelectors2 = new() { Text = { Name = nameof(Operation.Name) }, Key = { Name = nameof(Operation.Id) }, Icon = { Selector = i => i.IconInfo }, IsEnabled = { Selector = m => m.Disabled is false } }; **Color**: public class Operation { public string? Id { get; set; } public string? Name { get; set; } public string? Image { get; set; } public bool Disabled { get; set; } } private List basicCustoms = [ new() { Name = "Custom A", Id = "A" }, new() { Name = "Custom B", Id = "B", Disabled = true }, new() { Name = "Custom C", Id = "C" } ]; private BitMenuButtonNameSelectors nameSelectors = new() { Text = { Name = nameof(Operation.Name) }, Key = { Name = nameof(Operation.Id) }, IconName = { Name = nameof(Operation.Image) }, IsEnabled = { Selector = m => m.Disabled is false } }; **Size**: public class Operation { public string? Id { get; set; } public string? Name { get; set; } public string? Image { get; set; } public bool Disabled { get; set; } } private List basicCustoms = [ new() { Name = "Custom A", Id = "A" }, new() { Name = "Custom B", Id = "B", Disabled = true }, new() { Name = "Custom C", Id = "C" } ]; private BitMenuButtonNameSelectors nameSelectors = new() { Text = { Name = nameof(Operation.Name) }, Key = { Name = nameof(Operation.Id) }, IconName = { Name = nameof(Operation.Image) }, IsEnabled = { Selector = m => m.Disabled is false } }; **RTL**: public class Operation { public string? Id { get; set; } public string? Name { get; set; } public string? Image { get; set; } public bool Disabled { get; set; } } private static List rtlCustoms = [ new() { Name = "گزینه الف", Id = "A", Image = BitIconName.Emoji }, new() { Name = "گزینه ب", Id = "B", Image = BitIconName.Emoji }, new() { Name = "گزینه ج", Id = "C", Image = BitIconName.Emoji2 } ]; private BitMenuButtonNameSelectors nameSelectors = new() { Text = { Name = nameof(Operation.Name) }, Key = { Name = nameof(Operation.Id) }, IconName = { Name = nameof(Operation.Image) }, IsEnabled = { Selector = m => m.Disabled is false } };

**Basic**: **Split**: **Variant**: **Sticky**: **Icons**: **Style & Class**: **Background**: **Toggle**:

OnToggleChange: @optionToggledValue

**NoIcon**: **Templates**:

Custom Header!

@item.Text (@item.Key)

**Events**:

Changed option: @exampleChangedOption

Clicked option: @exampleClickedOption

private string? exampleChangedOption; private string? exampleClickedOption; **Binding**: private BitMenuButtonOption twoWaySelectedOption = default!; private bool oneWayIsOpen; private bool twoWayIsOpen; **External Icons**: **Color**: **Size**: **RTL**: