diff --git a/LICENSE b/LICENSE index 0ab084ff9e..8a3da518c0 100644 --- a/LICENSE +++ b/LICENSE @@ -1,6 +1,6 @@ MIT License -Copyright (c) 2025 bit platform +Copyright (c) 2026 bit platform Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal diff --git a/src/Besql/Bit.Besql/wwwroot/bit-besql.js b/src/Besql/Bit.Besql/wwwroot/bit-besql.js index 90d8a097c1..8517272e5c 100644 --- a/src/Besql/Bit.Besql/wwwroot/bit-besql.js +++ b/src/Besql/Bit.Besql/wwwroot/bit-besql.js @@ -1,5 +1,5 @@ var BitBesql = window.BitBesql || {}; -BitBesql.version = window['bit-besql version'] = '10.4.0'; +BitBesql.version = window['bit-besql version'] = '10.4.1'; BitBesql.persist = async function besqlPersist(fileName) { diff --git a/src/Bit.Build.props b/src/Bit.Build.props index 4daed0a33b..a0afbd7a9d 100644 --- a/src/Bit.Build.props +++ b/src/Bit.Build.props @@ -8,7 +8,7 @@ bit platform $(MSBuildProjectName) $(MSBuildProjectName) - Copyright © bit platform 2025 + Copyright © bit platform 2026 https://github.com/bitfoundation/bitplatform @@ -27,7 +27,7 @@ https://github.com/bitfoundation/bitplatform - 10.4.0 + 10.4.1 $(ReleaseVersion) https://github.com/bitfoundation/bitplatform/releases/tag/v-$(ReleaseVersion) $([System.String]::Copy($(ReleaseVersion)).Replace('-pre-', '.')) diff --git a/src/BlazorES2019/Bit.BlazorES2019/buildTransitive/Bit.BlazorES2019.targets b/src/BlazorES2019/Bit.BlazorES2019/buildTransitive/Bit.BlazorES2019.targets index d905ed458d..4259c5ce12 100644 --- a/src/BlazorES2019/Bit.BlazorES2019/buildTransitive/Bit.BlazorES2019.targets +++ b/src/BlazorES2019/Bit.BlazorES2019/buildTransitive/Bit.BlazorES2019.targets @@ -1,13 +1,13 @@ - - + + PreserveNewest PreserveNewest wwwroot\_framework\%(Filename)%(Extension) - - + + PreserveNewest PreserveNewest wwwroot\_framework\%(Filename)%(Extension) diff --git a/src/BlazorUI/Bit.BlazorUI.Assets/package-lock.json b/src/BlazorUI/Bit.BlazorUI.Assets/package-lock.json index 00c0c4b2ca..5ade51c860 100644 --- a/src/BlazorUI/Bit.BlazorUI.Assets/package-lock.json +++ b/src/BlazorUI/Bit.BlazorUI.Assets/package-lock.json @@ -5,7 +5,7 @@ "packages": { "": { "devDependencies": { - "sass": "1.97.2" + "sass": "1.97.3" } }, "node_modules/@parcel/watcher": { @@ -448,9 +448,9 @@ } }, "node_modules/sass": { - "version": "1.97.2", - "resolved": "https://registry.npmjs.org/sass/-/sass-1.97.2.tgz", - "integrity": "sha512-y5LWb0IlbO4e97Zr7c3mlpabcbBtS+ieiZ9iwDooShpFKWXf62zz5pEPdwrLYm+Bxn1fnbwFGzHuCLSA9tBmrw==", + "version": "1.97.3", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.97.3.tgz", + "integrity": "sha512-fDz1zJpd5GycprAbu4Q2PV/RprsRtKC/0z82z0JLgdytmcq0+ujJbJ/09bPGDxCLkKY3Np5cRAOcWiVkLXJURg==", "dev": true, "license": "MIT", "dependencies": { diff --git a/src/BlazorUI/Bit.BlazorUI.Assets/package.json b/src/BlazorUI/Bit.BlazorUI.Assets/package.json index ef67b492ed..e14395e62d 100644 --- a/src/BlazorUI/Bit.BlazorUI.Assets/package.json +++ b/src/BlazorUI/Bit.BlazorUI.Assets/package.json @@ -1,5 +1,5 @@ { "devDependencies": { - "sass": "1.97.2" + "sass": "1.97.3" } } diff --git a/src/BlazorUI/Bit.BlazorUI.Extras/package-lock.json b/src/BlazorUI/Bit.BlazorUI.Extras/package-lock.json index b07b260012..2053d773b0 100644 --- a/src/BlazorUI/Bit.BlazorUI.Extras/package-lock.json +++ b/src/BlazorUI/Bit.BlazorUI.Extras/package-lock.json @@ -6,7 +6,7 @@ "": { "devDependencies": { "esbuild": "0.27.2", - "sass": "1.97.2", + "sass": "1.97.3", "typescript": "5.9.3" } }, @@ -934,9 +934,9 @@ } }, "node_modules/sass": { - "version": "1.97.2", - "resolved": "https://registry.npmjs.org/sass/-/sass-1.97.2.tgz", - "integrity": "sha512-y5LWb0IlbO4e97Zr7c3mlpabcbBtS+ieiZ9iwDooShpFKWXf62zz5pEPdwrLYm+Bxn1fnbwFGzHuCLSA9tBmrw==", + "version": "1.97.3", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.97.3.tgz", + "integrity": "sha512-fDz1zJpd5GycprAbu4Q2PV/RprsRtKC/0z82z0JLgdytmcq0+ujJbJ/09bPGDxCLkKY3Np5cRAOcWiVkLXJURg==", "dev": true, "license": "MIT", "dependencies": { diff --git a/src/BlazorUI/Bit.BlazorUI.Extras/package.json b/src/BlazorUI/Bit.BlazorUI.Extras/package.json index db1f70777d..272e232e53 100644 --- a/src/BlazorUI/Bit.BlazorUI.Extras/package.json +++ b/src/BlazorUI/Bit.BlazorUI.Extras/package.json @@ -1,7 +1,7 @@ { "devDependencies": { "esbuild": "0.27.2", - "sass": "1.97.2", + "sass": "1.97.3", "typescript": "5.9.3" } } diff --git a/src/BlazorUI/Bit.BlazorUI.Icons/package-lock.json b/src/BlazorUI/Bit.BlazorUI.Icons/package-lock.json index b769e3d5d1..c5ac7a013c 100644 --- a/src/BlazorUI/Bit.BlazorUI.Icons/package-lock.json +++ b/src/BlazorUI/Bit.BlazorUI.Icons/package-lock.json @@ -5,7 +5,7 @@ "packages": { "": { "devDependencies": { - "sass": "1.97.2" + "sass": "1.97.3" } }, "node_modules/@parcel/watcher": { @@ -448,9 +448,9 @@ } }, "node_modules/sass": { - "version": "1.97.2", - "resolved": "https://registry.npmjs.org/sass/-/sass-1.97.2.tgz", - "integrity": "sha512-y5LWb0IlbO4e97Zr7c3mlpabcbBtS+ieiZ9iwDooShpFKWXf62zz5pEPdwrLYm+Bxn1fnbwFGzHuCLSA9tBmrw==", + "version": "1.97.3", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.97.3.tgz", + "integrity": "sha512-fDz1zJpd5GycprAbu4Q2PV/RprsRtKC/0z82z0JLgdytmcq0+ujJbJ/09bPGDxCLkKY3Np5cRAOcWiVkLXJURg==", "dev": true, "license": "MIT", "dependencies": { diff --git a/src/BlazorUI/Bit.BlazorUI.Icons/package.json b/src/BlazorUI/Bit.BlazorUI.Icons/package.json index ef67b492ed..e14395e62d 100644 --- a/src/BlazorUI/Bit.BlazorUI.Icons/package.json +++ b/src/BlazorUI/Bit.BlazorUI.Icons/package.json @@ -1,5 +1,5 @@ { "devDependencies": { - "sass": "1.97.2" + "sass": "1.97.3" } } diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.razor b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.razor index 462a288113..40ea7514bf 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.razor +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.razor @@ -4,6 +4,7 @@ @{ var hasPrimary = (PrimaryTemplate ?? ChildContent) is not null; var hasSecondary = SecondaryText.HasValue() || SecondaryTemplate is not null; + var icon = BitIconInfo.From(Icon, IconName); } @if (Href.HasNoValue()) @@ -22,9 +23,9 @@ aria-describedby="@AriaDescription"> @if (IsLoading is false) { - @if (IconName.HasValue()) + @if (icon is not null) { - + } else if (IconUrl.HasValue()) { @@ -94,9 +95,9 @@ else aria-label="@AriaLabel" aria-hidden="@AriaHidden" aria-describedby="@AriaDescription"> - @if (IconName.HasValue()) + @if (icon is not null) { - + } else if (IconUrl.HasValue()) { diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.razor.cs index ce31283e52..6cb034961f 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.razor.cs +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.razor.cs @@ -116,6 +116,21 @@ public partial class BitButton : BitComponentBase [CallOnSet(nameof(OnSetHrefAndRel))] public string? Href { get; set; } + /// + /// Gets or sets the icon to display using custom CSS classes for external icon libraries. + /// Takes precedence over when both are set. + /// + /// + /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons. + /// For built-in Fluent UI icons, use instead. + /// + /// + /// FontAwesome: Icon="BitIconInfo.Fa("solid house")" + /// Material: Icon="BitIconInfo.Material("home")" + /// Custom CSS: Icon="BitIconInfo.Css("my-icon-class")" + /// + [Parameter] public BitIconInfo? Icon { get; set; } + /// /// The name of the icon to render inside the button. /// diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.razor b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.razor index 790fc14f3f..fd067b0edd 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.razor +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.razor @@ -34,10 +34,10 @@ } else { - var iconName = GetItemIconName(item); - @if (iconName.HasValue()) + var icon = GetItemIcon(item); + @if (icon is not null) { - + } var text = GetItemText(item); diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.razor.cs index bf5c8bbf84..d1dd16fcba 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.razor.cs +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroup.razor.cs @@ -419,29 +419,29 @@ private async Task HandleOnItemClick(TItem item) return GetTitle(item); } - private string? GetItemIconName(TItem item) + private BitIconInfo? GetItemIcon(TItem item) { if (Toggle) { if (IsItemToggled(item)) { + var onIcon = GetOnIcon(item); + if (onIcon is not null) return onIcon; + var onIconName = GetOnIconName(item); - if (onIconName.HasValue()) - { - return onIconName; - } + if (onIconName.HasValue()) return new BitIconInfo(onIconName!); } else { + var offIcon = GetOffIcon(item); + if (offIcon is not null) return offIcon; + var offIconName = GetOffIconName(item); - if (offIconName.HasValue()) - { - return offIconName; - } + if (offIconName.HasValue()) return new BitIconInfo(offIconName!); } } - return GetIconName(item); + return BitIconInfo.From(GetIcon(item), GetIconName(item)); } private async Task UpdateItemToggle(TItem? item, bool isToggled = true) @@ -564,6 +564,30 @@ private void SetItemKey(TItem item, string value) return item.GetValueFromProperty(NameSelectors.Class.Name); } + private BitIconInfo? GetIcon(TItem? item) + { + if (item is null) return null; + + if (item is BitButtonGroupItem buttonGroupItem) + { + return buttonGroupItem.Icon; + } + + if (item is BitButtonGroupOption buttonGroupOption) + { + return buttonGroupOption.Icon; + } + + if (NameSelectors is null) return null; + + if (NameSelectors.Icon.Selector is not null) + { + return NameSelectors.Icon.Selector!(item); + } + + return item.GetValueFromProperty(NameSelectors.Icon.Name); + } + private string? GetIconName(TItem? item) { if (item is null) return null; @@ -588,6 +612,30 @@ private void SetItemKey(TItem item, string value) return item.GetValueFromProperty(NameSelectors.IconName.Name); } + private BitIconInfo? GetOnIcon(TItem? item) + { + if (item is null) return null; + + if (item is BitButtonGroupItem buttonGroupItem) + { + return buttonGroupItem.OnIcon; + } + + if (item is BitButtonGroupOption buttonGroupOption) + { + return buttonGroupOption.OnIcon; + } + + if (NameSelectors is null) return null; + + if (NameSelectors.OnIcon.Selector is not null) + { + return NameSelectors.OnIcon.Selector!(item); + } + + return item.GetValueFromProperty(NameSelectors.OnIcon.Name); + } + private string? GetOnIconName(TItem? item) { if (item is null) return null; @@ -612,6 +660,30 @@ private void SetItemKey(TItem item, string value) return item.GetValueFromProperty(NameSelectors.OnIconName.Name); } + private BitIconInfo? GetOffIcon(TItem? item) + { + if (item is null) return null; + + if (item is BitButtonGroupItem buttonGroupItem) + { + return buttonGroupItem.OffIcon; + } + + if (item is BitButtonGroupOption buttonGroupOption) + { + return buttonGroupOption.OffIcon; + } + + if (NameSelectors is null) return null; + + if (NameSelectors.OffIcon.Selector is not null) + { + return NameSelectors.OffIcon.Selector!(item); + } + + return item.GetValueFromProperty(NameSelectors.OffIcon.Name); + } + private string? GetOffIconName(TItem? item) { if (item is null) return null; diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroupItem.cs b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroupItem.cs index 5f4f9fa1ef..3830f30e0d 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroupItem.cs +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroupItem.cs @@ -8,6 +8,21 @@ public class BitButtonGroupItem /// public string? Class { get; set; } + /// + /// Gets or sets the icon to display using custom CSS classes for external icon libraries. + /// Takes precedence over when both are set. + /// + /// + /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons. + /// For built-in Fluent UI icons, use instead. + /// + /// + /// FontAwesome: Icon = BitIconInfo.Fa("solid house") + /// Material: Icon = BitIconInfo.Material("home") + /// Custom CSS: Icon = BitIconInfo.Css("my-icon-class") + /// + public BitIconInfo? Icon { get; set; } + /// /// Name of an icon to render next to the item text. /// @@ -23,6 +38,21 @@ public class BitButtonGroupItem /// public string? Key { get; set; } + /// + /// Gets or sets the icon to display when the item is not checked using custom CSS classes for external icon libraries. + /// Takes precedence over when both are set. + /// + /// + /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons. + /// For built-in Fluent UI icons, use instead. + /// + /// + /// FontAwesome: OffIcon = BitIconInfo.Fa("solid house") + /// Material: OffIcon = BitIconInfo.Material("home") + /// Custom CSS: OffIcon = BitIconInfo.Css("my-icon-class") + /// + public BitIconInfo? OffIcon { get; set; } + /// /// The icon of the item when it is not checked in toggle mode. /// @@ -38,6 +68,21 @@ public class BitButtonGroupItem /// [Parameter] public string? OffTitle { get; set; } + /// + /// Gets or sets the icon to display when the item is checked using custom CSS classes for external icon libraries. + /// Takes precedence over when both are set. + /// + /// + /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons. + /// For built-in Fluent UI icons, use instead. + /// + /// + /// FontAwesome: OnIcon = BitIconInfo.Fa("solid house") + /// Material: OnIcon = BitIconInfo.Material("home") + /// Custom CSS: OnIcon = BitIconInfo.Css("my-icon-class") + /// + public BitIconInfo? OnIcon { get; set; } + /// /// The icon of the item when it is checked in toggle mode. /// diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroupNameSelectors.cs b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroupNameSelectors.cs index 428f90de0a..e6b858ce1a 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroupNameSelectors.cs +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroupNameSelectors.cs @@ -7,6 +7,11 @@ public class BitButtonGroupNameSelectors /// public BitNameSelectorPair Class { get; set; } = new(nameof(BitButtonGroupItem.Class)); + /// + /// Icon field name and selector of the custom input class. + /// + public BitNameSelectorPair Icon { get; set; } = new(nameof(BitButtonGroupItem.Icon)); + /// /// IconName field name and selector of the custom input class. /// @@ -22,6 +27,11 @@ public class BitButtonGroupNameSelectors /// public BitNameSelectorPair Key { get; set; } = new(nameof(BitButtonGroupItem.Key)); + /// + /// OffIcon field name and selector of the custom input class. + /// + public BitNameSelectorPair OffIcon { get; set; } = new(nameof(BitButtonGroupItem.OffIcon)); + /// /// OffIconName field name and selector of the custom input class. /// @@ -37,6 +47,11 @@ public class BitButtonGroupNameSelectors /// public BitNameSelectorPair OffTitle { get; set; } = new(nameof(BitButtonGroupItem.OffTitle)); + /// + /// OnIcon field name and selector of the custom input class. + /// + public BitNameSelectorPair OnIcon { get; set; } = new(nameof(BitButtonGroupItem.OnIcon)); + /// /// OnIconName field name and selector of the custom input class. /// diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroupOption.cs b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroupOption.cs index a0d19afb44..80dc75ea53 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroupOption.cs +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ButtonGroup/BitButtonGroupOption.cs @@ -13,6 +13,21 @@ public partial class BitButtonGroupOption : ComponentBase, IDisposable /// [Parameter] public string? Class { get; set; } + /// + /// Gets or sets the icon to display using custom CSS classes for external icon libraries. + /// Takes precedence over when both are set. + /// + /// + /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons. + /// For built-in Fluent UI icons, use instead. + /// + /// + /// FontAwesome: Icon="BitIconInfo.Fa("solid house")" + /// Material: Icon="BitIconInfo.Material("home")" + /// Custom CSS: Icon="BitIconInfo.Css("my-icon-class")" + /// + [Parameter] public BitIconInfo? Icon { get; set; } + /// /// Name of an icon to render next to the option text /// @@ -28,6 +43,21 @@ public partial class BitButtonGroupOption : ComponentBase, IDisposable /// [Parameter] public string? Key { get; set; } + /// + /// Gets or sets the icon to display when the option is not checked using custom CSS classes for external icon libraries. + /// Takes precedence over when both are set. + /// + /// + /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons. + /// For built-in Fluent UI icons, use instead. + /// + /// + /// FontAwesome: OffIcon="BitIconInfo.Fa("solid house")" + /// Material: OffIcon="BitIconInfo.Material("home")" + /// Custom CSS: OffIcon="BitIconInfo.Css("my-icon-class")" + /// + [Parameter] public BitIconInfo? OffIcon { get; set; } + /// /// The icon of the option when it is not checked in toggle mode. /// @@ -43,6 +73,21 @@ public partial class BitButtonGroupOption : ComponentBase, IDisposable /// [Parameter] public string? OffTitle { get; set; } + /// + /// Gets or sets the icon to display when the option is checked using custom CSS classes for external icon libraries. + /// Takes precedence over when both are set. + /// + /// + /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons. + /// For built-in Fluent UI icons, use instead. + /// + /// + /// FontAwesome: OnIcon="BitIconInfo.Fa("solid house")" + /// Material: OnIcon="BitIconInfo.Material("home")" + /// Custom CSS: OnIcon="BitIconInfo.Css("my-icon-class")" + /// + [Parameter] public BitIconInfo? OnIcon { get; set; } + /// /// The icon of the option when it is checked in toggle mode. /// diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.razor b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.razor index 71e7934230..2501a04127 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.razor +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.razor @@ -35,10 +35,10 @@ } else { - var iconName = GetIconName(_selectedItem); - @if (iconName.HasValue()) + var icon = GetIcon(_selectedItem); + @if (icon is not null) { - + } @GetText(_selectedItem) @@ -47,15 +47,16 @@ } else { + var headerIcon = BitIconInfo.From(Icon, IconName); @if (HeaderTemplate is not null) { @HeaderTemplate } else { - @if (IconName.HasValue()) + @if (headerIcon is not null) { - + } @if (Text.HasValue()) @@ -67,7 +68,8 @@ @if (Split is false) { - + var chevronIcon = BitIconInfo.From(ChevronDownIcon, ChevronDownIconName ?? "ChevronRight bit-ico-r90"); + } @@ -80,7 +82,10 @@ tabindex="@(IsEnabled ? 0 : -1)" style="@Styles?.ChevronDownButton" class="bit-mnb-chb @Classes?.ChevronDownButton"> - + @{ + var chevronIcon = BitIconInfo.From(ChevronDownIcon, ChevronDownIconName ?? "ChevronRight bit-ico-r90"); + } + } @@ -117,10 +122,10 @@ } else { - var iconName = GetIconName(item); - @if (iconName.HasValue()) + var itemIcon = GetIcon(item); + @if (itemIcon is not null) { - + } @GetText(item) diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.razor.cs index 9bddc01e76..2fa2ffbaa2 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.razor.cs +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButton.razor.cs @@ -41,10 +41,15 @@ public partial class BitMenuButton : BitComponentBase where TItem : class /// [Parameter] public BitButtonType? ButtonType { get; set; } + /// + /// The icon for the chevron down part of the menu button. + /// + [Parameter] public BitIconInfo? ChevronDownIcon { get; set; } + /// /// The icon name of the chevron down part of the menu button. /// - [Parameter] public string? ChevronDownIcon { get; set; } + [Parameter] public string? ChevronDownIconName { get; set; } /// /// The content of the menu button, that are BitMenuButtonOption components. @@ -72,6 +77,16 @@ public partial class BitMenuButton : BitComponentBase where TItem : class /// [Parameter] public RenderFragment? HeaderTemplate { get; set; } + /// + /// Gets or sets the icon to display using custom CSS classes for external icon libraries. + /// Takes precedence over when both are set. + /// + /// + /// Use this property to render icons from external libraries like FontAwesome, or Bootstrap Icons. + /// For built-in Fluent UI icons, use instead. + /// + [Parameter] public BitIconInfo? Icon { get; set; } + /// /// The icon to show inside the header of menu button. /// @@ -329,28 +344,43 @@ protected override void OnAfterRender(bool firstRender) return item.GetValueFromProperty(NameSelectors.Class.Name); } - private string? GetIconName(TItem? item) + private BitIconInfo? GetIcon(TItem? item) { if (item is null) return null; if (item is BitMenuButtonItem menuButtonItem) { - return menuButtonItem.IconName; + return BitIconInfo.From(menuButtonItem.Icon, menuButtonItem.IconName); } if (item is BitMenuButtonOption menuButtonOption) { - return menuButtonOption.IconName; + return BitIconInfo.From(menuButtonOption.Icon, menuButtonOption.IconName); } if (NameSelectors is null) return null; + BitIconInfo? icon = null; + if (NameSelectors.Icon.Selector is not null) + { + icon = NameSelectors.Icon.Selector!(item); + } + else + { + icon = item.GetValueFromProperty(NameSelectors.Icon.Name); + } + + string? iconName = null; if (NameSelectors.IconName.Selector is not null) { - return NameSelectors.IconName.Selector!(item); + iconName = NameSelectors.IconName.Selector!(item); + } + else + { + iconName = item.GetValueFromProperty(NameSelectors.IconName.Name); } - return item.GetValueFromProperty(NameSelectors.IconName.Name); + return BitIconInfo.From(icon, iconName); } private bool GetIsEnabled(TItem? item) diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButtonItem.cs b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButtonItem.cs index 840badc8d0..db554990d7 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButtonItem.cs +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButtonItem.cs @@ -7,6 +7,21 @@ public class BitMenuButtonItem /// public string? Class { get; set; } + /// + /// Gets or sets the icon to display using custom CSS classes for external icon libraries. + /// Takes precedence over when both are set. + /// + /// + /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons. + /// For built-in Fluent UI icons, use instead. + /// + /// + /// FontAwesome: Icon = BitIconInfo.Fa("solid house") + /// Material: Icon = BitIconInfo.Material("home") + /// Custom CSS: Icon = BitIconInfo.Css("my-icon-class") + /// + public BitIconInfo? Icon { get; set; } + /// /// Name of an icon to render next to the item text. /// diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButtonNameSelectors.cs b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButtonNameSelectors.cs index 40f90f9c1e..f763e388d2 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButtonNameSelectors.cs +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButtonNameSelectors.cs @@ -7,6 +7,11 @@ public class BitMenuButtonNameSelectors /// public BitNameSelectorPair Class { get; set; } = new(nameof(BitMenuButtonItem.Class)); + /// + /// Icon field name and selector of the custom input class. + /// + public BitNameSelectorPair Icon { get; set; } = new(nameof(BitMenuButtonItem.Icon)); + /// /// IconName field name and selector of the custom input class. /// diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButtonOption.cs b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButtonOption.cs index 146d64f95a..34f07f5795 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButtonOption.cs +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/MenuButton/BitMenuButtonOption.cs @@ -12,6 +12,21 @@ public class BitMenuButtonOption : ComponentBase, IDisposable /// [Parameter] public string? Class { get; set; } + /// + /// Gets or sets the icon to display using custom CSS classes for external icon libraries. + /// Takes precedence over when both are set. + /// + /// + /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons. + /// For built-in Fluent UI icons, use instead. + /// + /// + /// FontAwesome: Icon="BitIconInfo.Fa("solid house")" + /// Material: Icon="BitIconInfo.Material("home")" + /// Custom CSS: Icon="BitIconInfo.Css("my-icon-class")" + /// + [Parameter] public BitIconInfo? Icon { get; set; } + /// /// Name of an icon to render next to the option text. /// diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.razor b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.razor index 36e21ebf3b..dcc3f6b788 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.razor +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.razor @@ -18,11 +18,11 @@ } else { - var iconName = GetIconName(); + var icon = GetIcon(); var text = GetText(); - if (iconName.HasValue()) + if (icon is not null) { - + } if (IconOnly is false && text.HasValue()) diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.razor.cs index 1d81e8d8f9..066142b429 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.razor.cs +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/ToggleButton/BitToggleButton.razor.cs @@ -51,6 +51,21 @@ public partial class BitToggleButton : BitComponentBase [Parameter, ResetClassBuilder] public bool FixedColor { get; set; } + /// + /// Gets or sets the icon to display using custom CSS classes for external icon libraries. + /// Takes precedence over when both are set. + /// + /// + /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons. + /// For built-in Fluent UI icons, use instead. + /// + /// + /// FontAwesome: Icon="BitIconInfo.Fa("solid house")" + /// Material: Icon="BitIconInfo.Material("home")" + /// Custom CSS: Icon="BitIconInfo.Css("my-icon-class")" + /// + [Parameter] public BitIconInfo? Icon { get; set; } + /// /// The icon name that renders inside the toggle button. /// @@ -78,6 +93,21 @@ public partial class BitToggleButton : BitComponentBase /// [Parameter] public EventCallback OnClick { get; set; } + /// + /// Gets or sets the icon to display when the toggle button is not checked using custom CSS classes for external icon libraries. + /// Takes precedence over when both are set. + /// + /// + /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons. + /// For built-in Fluent UI icons, use instead. + /// + /// + /// FontAwesome: OffIcon="BitIconInfo.Fa("solid house")" + /// Material: OffIcon="BitIconInfo.Material("home")" + /// Custom CSS: OffIcon="BitIconInfo.Css("my-icon-class")" + /// + [Parameter] public BitIconInfo? OffIcon { get; set; } + /// /// The icon of the toggle button when it is not checked. /// @@ -93,6 +123,21 @@ public partial class BitToggleButton : BitComponentBase /// [Parameter] public string? OffTitle { get; set; } + /// + /// Gets or sets the icon to display when the toggle button is checked using custom CSS classes for external icon libraries. + /// Takes precedence over when both are set. + /// + /// + /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons. + /// For built-in Fluent UI icons, use instead. + /// + /// + /// FontAwesome: OnIcon="BitIconInfo.Fa("solid house")" + /// Material: OnIcon="BitIconInfo.Material("home")" + /// Custom CSS: OnIcon="BitIconInfo.Css("my-icon-class")" + /// + [Parameter] public BitIconInfo? OnIcon { get; set; } + /// /// The icon of the toggle button when it is checked. /// @@ -223,13 +268,22 @@ private async Task HandleOnClick(MouseEventArgs e) - private string? GetIconName() + private BitIconInfo? GetIcon() { - if (IsChecked && OnIconName.HasValue()) return OnIconName; + if (IsChecked) + { + var icon = BitIconInfo.From(OnIcon, OnIconName); - if (IsChecked is false && OffIconName.HasValue()) return OffIconName; + if (icon is not null) return icon; + } + else + { + var icon = BitIconInfo.From(OffIcon, OffIconName); + + if (icon is not null) return icon; + } - return IconName; + return BitIconInfo.From(Icon, IconName); } private string? GetText() diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/FileInput/BitFileInput.razor b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/FileInput/BitFileInput.razor new file mode 100644 index 0000000000..827f25fe96 --- /dev/null +++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/FileInput/BitFileInput.razor @@ -0,0 +1,82 @@ +@namespace Bit.BlazorUI +@inherits BitComponentBase + +
+ + @if (LabelTemplate is not null) + { + @LabelTemplate + } + else if (HideLabel is false) + { + + } + + + + @if (Files is not null && HideFileList is false) + { +
+ @for (var i = 0; i < Files.Count; i++) + { + var index = i; + var file = Files[index]; + file.Index = index; + + if (HideFileList is false) + { + if (FileViewTemplate is not null) + { + @FileViewTemplate(file) + } + else + { +
+
+
+
+ @file.Name +
+
+
+ + @FileSizeHumanizer.Humanize(file.Size) + +
+ @if (file.IsValid is false) + { +
+ @file.Message +
+ } +
+ @if (ShowRemoveButton) + { +