diff --git a/.github/workflows/admin-sample.cd.yml b/.github/workflows/admin-sample.cd.yml index 0e20c83b5a..20c90a0b1e 100644 --- a/.github/workflows/admin-sample.cd.yml +++ b/.github/workflows/admin-sample.cd.yml @@ -69,6 +69,56 @@ jobs: path: ${{env.DOTNET_ROOT}}/server include-hidden-files: true # Required for wwwroot/.well-known folder + deploy_blazor_wasm_standalone: + name: build blazor wasm standalone + runs-on: ubuntu-24.04 + + steps: + + - name: Checkout source code + uses: actions/checkout@v4 + + - name: Setup .NET + uses: actions/setup-dotnet@v4 + with: + global-json-file: src/global.json + + - name: Create project from Boilerplate + run: | + cd src/Templates/Boilerplate && dotnet build -c Release + dotnet pack -c Release -o . -p:ReleaseVersion=0.0.0 -p:PackageVersion=0.0.0 + dotnet new install Bit.Boilerplate.0.0.0.nupkg + cd ../../../ && dotnet new bit-bp --name AdminPanel --database PostgreSQL --sample Admin --appInsights --sentry --serverUrl ${{ env.SERVER_ADDRESS }} --filesStorage AzureBlobStorage --notification --captcha reCaptcha --signalR --framework net9.0 + + - name: Update core appsettings.json + uses: devops-actions/variable-substitution@v1.2 + with: + files: 'AdminPanel/src/Shared/appsettings.json, AdminPanel/src/Client/AdminPanel.Client.Core/appsettings.json, AdminPanel/src/Client/AdminPanel.Client.Web/appsettings.json, AdminPanel/src/Client/AdminPanel.Client.Web/appsettings.Production.json' + env: + ServerAddress: ${{ env.SERVER_ADDRESS }} + Logging.Sentry.Dsn: ${{ secrets.ADMINPANEL_SENTRY_DSN }} + GoogleRecaptchaSiteKey: ${{ secrets.GOOGLE_RECAPTCHA_SITE_KEY }} + AdsPushVapid.PublicKey: ${{ secrets.ADMINPANEL_PUBLIC_VAPIDKEY }} + ApplicationInsights.ConnectionString: ${{ secrets.APPLICATION_INSIGHTS_CONNECTION_STRING }} + + - uses: actions/setup-node@v4 + with: + node-version: 22 + + - name: Install wasm + run: cd src && dotnet workload install wasm-tools + + - name: Generate CSS/JS files + run: dotnet build AdminPanel/src/Client/AdminPanel.Client.Core/AdminPanel.Client.Core.csproj -t:BeforeBuildTasks -p:Version="${{ vars.APPLICATION_DISPLAY_VERSION}}" --no-restore -c Release + + - name: Publish + run: dotnet publish AdminPanel/src/Client/AdminPanel.Client.Web/AdminPanel.Client.Web.csproj -c Release -p:PwaEnabled=true -o ${{env.DOTNET_ROOT}}/client -p:Version="${{ vars.APPLICATION_DISPLAY_VERSION}}" + + - name: Upload to asw + run: | + npm install -g @azure/static-web-apps-cli + swa deploy --deployment-token ${{ secrets.ADMINPANEL_ASW_TOKEN }} --env production --app-location ${{env.DOTNET_ROOT}}/client/wwwroot + deploy_api_blazor: name: deploy api + blazor needs: build_api_blazor diff --git a/.github/workflows/bit.full.ci.yml b/.github/workflows/bit.full.ci.yml index c08e74098e..003f326ba4 100644 --- a/.github/workflows/bit.full.ci.yml +++ b/.github/workflows/bit.full.ci.yml @@ -58,6 +58,7 @@ jobs: - name: Simple tests (no --advancedTests) id: simple-test + continue-on-error: true run: | dotnet new bit-bp --name SimpleTest --database Sqlite --framework net8.0 cd SimpleTest/src/Server/SimpleTest.Server.Api/ @@ -79,6 +80,7 @@ jobs: - name: Test Sqlite database option id: sqlite-test + continue-on-error: true run: | dotnet new bit-bp --name TestSqlite --database Sqlite --advancedTests --framework net9.0 cd TestSqlite/src/Server/TestSqlite.Server.Api/ @@ -101,6 +103,7 @@ jobs: - name: Test SqlServer database option id: sqlserver-test + continue-on-error: true run: | dotnet new bit-bp --name TestSqlServer --database SqlServer --advancedTests --framework net8.0 cd TestSqlServer/src/Server/TestSqlServer.Server.Api/ @@ -121,6 +124,7 @@ jobs: - name: Test Multilingual disabled option id: multilingual-disabled-test + continue-on-error: true run: | dotnet new bit-bp --name MultilingualDisabled --database Sqlite --advancedTests --framework net8.0 cd MultilingualDisabled/src/Server/MultilingualDisabled.Server.Api/ @@ -139,6 +143,7 @@ jobs: retention-days: 14 - name: Test PostgreSQL, MySql, Other database options + continue-on-error: true run: | dotnet new bit-bp --name TestPostgreSQL --database PostgreSQL --framework net8.0 --signalR cd TestPostgreSQL/src/Server/TestPostgreSQL.Server.Api/ @@ -153,6 +158,7 @@ jobs: dotnet build - name: Test file storage options + continue-on-error: true run: | dotnet new bit-bp --name TestLocal --filesStorage Local --framework net8.0 --appInsights cd TestLocal/src/Server/TestLocal.Server.Api/ @@ -163,6 +169,7 @@ jobs: dotnet build - name: Test backend setup options + continue-on-error: true run: | dotnet new bit-bp --name TestStandalone --api Standalone --framework net8.0 cd TestStandalone/src/Server/TestStandalone.Server.Api/ @@ -176,11 +183,13 @@ jobs: dotnet build - name: Test sample configuration 1 + continue-on-error: true run: | dotnet new bit-bp --name TestProject --database SqlServer --filesStorage AzureBlobStorage --api Integrated --captcha reCaptcha --pipeline Azure --sample Admin --offlineDb --windows --appInsights --sentry --signalR --notification --framework net9.0 dotnet build TestProject/TestProject.sln -p:MultilingualEnabled=true -p:PwaEnabled=true -p:Environment=Staging - name: Test sample configuration 2 + continue-on-error: true run: | dotnet new bit-bp --name TestProject2 --database Other --filesStorage Other --api Standalone --captcha None --pipeline None --sample None --offlineDb false --windows false --appInsights false --sentry false --signalR false --notification false --framework net8.0 dotnet build TestProject2/TestProject2.sln -p:MultilingualEnabled=false -p:PwaEnabled=false -p:Environment=Development diff --git a/.github/workflows/todo-sample.cd.yml b/.github/workflows/todo-sample.cd.yml index 387e890cd5..b668a00726 100644 --- a/.github/workflows/todo-sample.cd.yml +++ b/.github/workflows/todo-sample.cd.yml @@ -121,6 +121,53 @@ jobs: CLOUDFLARE_ZONE: ${{ secrets.BITPLATFORM_DEV_CLOUDFLARE_ZONE }} CLOUDFLARE_TOKEN: ${{ secrets.CLOUDFLARE_TOKEN }} + deploy_blazor_wasm_standalone: + name: build blazor wasm standalone + runs-on: ubuntu-24.04 + + steps: + + - name: Checkout source code + uses: actions/checkout@v4 + + - name: Setup .NET + uses: actions/setup-dotnet@v4 + with: + global-json-file: src/global.json + + - name: Create project from Boilerplate + run: | + cd src/Templates/Boilerplate && dotnet build -c Release + dotnet pack -c Release -o . -p:ReleaseVersion=0.0.0 -p:PackageVersion=0.0.0 + dotnet new install Bit.Boilerplate.0.0.0.nupkg + cd ../../../ && dotnet new bit-bp --name TodoSample --database PostgreSQL --sample Todo --serverUrl ${{ env.SERVER_ADDRESS }} --filesStorage AzureBlobStorage --notification --captcha reCaptcha --framework net9.0 + + - name: Update core appsettings.json + uses: devops-actions/variable-substitution@v1.2 + with: + files: 'TodoSample/src/Shared/appsettings.json, TodoSample/src/Client/TodoSample.Client.Core/appsettings.json, TodoSample/src/Client/TodoSample.Client.Web/appsettings.json, TodoSample/src/Client/TodoSample.Client.Web/appsettings.Production.json' + env: + ServerAddress: ${{ env.SERVER_ADDRESS }} + GoogleRecaptchaSiteKey: ${{ secrets.GOOGLE_RECAPTCHA_SITE_KEY }} + + - uses: actions/setup-node@v4 + with: + node-version: 22 + + - name: Install wasm + run: cd src && dotnet workload install wasm-tools + + - name: Generate CSS/JS files + run: dotnet build TodoSample/src/Client/TodoSample.Client.Core/TodoSample.Client.Core.csproj -t:BeforeBuildTasks -p:Version="${{ vars.APPLICATION_DISPLAY_VERSION}}" --no-restore -c Release + + - name: Publish + run: dotnet publish TodoSample/src/Client/TodoSample.Client.Web/TodoSample.Client.Web.csproj -c Release -p:PwaEnabled=true -o ${{env.DOTNET_ROOT}}/client -p:Version="${{ vars.APPLICATION_DISPLAY_VERSION}}" -p:RunAOTCompilation=true -p:MultilingualEnabled=false + + - name: Upload to asw + run: | + npm install -g @azure/static-web-apps-cli + swa deploy --deployment-token ${{ secrets.TODO_ASW_TOKEN }} --env production --app-location ${{env.DOTNET_ROOT}}/client/wwwroot + build_blazor_hybrid_windows: name: build blazor hybrid (windows) runs-on: windows-2022 diff --git a/README.md b/README.md index d189ce9e8f..e6111238e8 100644 --- a/README.md +++ b/README.md @@ -5,7 +5,7 @@ ![License](https://img.shields.io/github/license/bitfoundation/bitplatform.svg) ![CI Status](https://github.com/bitfoundation/bitplatform/actions/workflows/bit.ci.yml/badge.svg) ![NuGet version](https://img.shields.io/nuget/v/bit.blazorui.svg?logo=nuget) -[![Nuget downloads](https://img.shields.io/badge/packages_download-5.5M-blue.svg?logo=nuget)](https://www.nuget.org/profiles/bit-foundation) +[![Nuget downloads](https://img.shields.io/badge/packages_download-5.6M-blue.svg?logo=nuget)](https://www.nuget.org/profiles/bit-foundation) [![Average time to resolve an issue](http://isitmaintained.com/badge/resolution/bitfoundation/bitplatform.svg)](http://isitmaintained.com/project/bitfoundation/bitplatform "Average time to resolve an issue") [![Percentage of issues still open](http://isitmaintained.com/badge/open/bitfoundation/bitplatform.svg)](http://isitmaintained.com/project/bitfoundation/bitplatform "Percentage of issues still open") @@ -47,7 +47,9 @@ The following apps are our open-source projects powered by the bit platform show 1. [bitplatform.dev](https://bitplatform.dev): .NET 9 Pre-rendered SPA with Blazor WebAssembly 2. [blazorui.bitplatform.dev](https://blazorui.bitplatform.dev): .NET 9 Pre-rendered PWA with Blazor WebAssembly 3. [todo.bitplatform.dev](https://todo.bitplatform.dev): .NET 8 Pre-rendered PWA with Blazor WebAssembly -5. [adminpanel.bitplatform.dev](https://adminpanel.bitplatform.dev): .NET 9 PWA with Blazor WebAssembly Standalone (Hosted on Cloudflare Pages) +5. [adminpanel.bitplatform.dev](https://adminpanel.bitplatform.dev): .NET 9 PWA with Blazor WebAssembly +6. [adminpanel.bitplatform.cc](https://adminpanel.bitplatform.cc): .NET 9 PWA with Blazor WebAssembly Standalone (Free Azure static web app) +7. [todo.bitplatform.cc](https://todo.bitplatform.cc): AOT Compiled .NET 9 PWA with Blazor WebAssembly Standalone (Free Azure static web app) [Todo](https://todo.bitplatform.dev) & [Adminpanel](https://adminpanel.bitplatform.dev) web apps will launch their respective Android and iOS applications if you have already installed them, mirroring the behavior of apps like YouTube and Instagram. diff --git a/src/Besql/Bit.Besql/wwwroot/bit-besql.js b/src/Besql/Bit.Besql/wwwroot/bit-besql.js index aa548d55e5..a7229e8651 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'] = '9.1.1'; +BitBesql.version = window['bit-besql version'] = '9.1.2'; BitBesql.init = async function init(fileName) { const sqliteFilePath = `/${fileName}`; diff --git a/src/Bit.Build.props b/src/Bit.Build.props index c7c8af3021..29ac825be1 100644 --- a/src/Bit.Build.props +++ b/src/Bit.Build.props @@ -27,7 +27,7 @@ https://github.com/bitfoundation/bitplatform - 9.1.1 + 9.1.2 $(ReleaseVersion) https://github.com/bitfoundation/bitplatform/releases/tag/v-$(ReleaseVersion) $([System.String]::Copy($(ReleaseVersion)).Replace('-pre-', '.')) diff --git a/src/BlazorUI/Bit.BlazorUI.Tests/Bit.BlazorUI.Tests.csproj b/src/BlazorUI/Bit.BlazorUI.Tests/Bit.BlazorUI.Tests.csproj index a01542257f..cb16dd5cbb 100644 --- a/src/BlazorUI/Bit.BlazorUI.Tests/Bit.BlazorUI.Tests.csproj +++ b/src/BlazorUI/Bit.BlazorUI.Tests/Bit.BlazorUI.Tests.csproj @@ -13,7 +13,7 @@ - + diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitActionButton/BitActionButton.razor b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitActionButton/BitActionButton.razor index ff0059f783..30002ad6bf 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitActionButton/BitActionButton.razor +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitActionButton/BitActionButton.razor @@ -31,6 +31,7 @@ else { - [Parameter] public string? Href { get; set; } + [Parameter] + [CallOnSet(nameof(OnSetHrefAndRel))] + public string? Href { get; set; } /// /// The icon name of the icon to render inside the button. @@ -90,6 +93,13 @@ public partial class BitActionButton : BitComponentBase [Parameter, ResetClassBuilder] public bool ReversedIcon { get; set; } + /// + /// If Href provided, specifies the relationship between the current document and the linked document. + /// + [Parameter] + [CallOnSet(nameof(OnSetHrefAndRel))] + public BitLinkRel? Rel { get; set; } + /// /// The size of the button. /// @@ -172,4 +182,15 @@ protected virtual async Task HandleOnClick(MouseEventArgs e) await OnClick.InvokeAsync(e); } } + + private void OnSetHrefAndRel() + { + if (Rel.HasValue is false || Href.HasNoValue() || Href!.StartsWith('#')) + { + _rel = null; + return; + } + + _rel = BitLinkRelUtils.GetRels(Rel.Value); + } } diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroup.razor b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroup.razor index 036addc7c6..34a0df0ad6 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroup.razor +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroup.razor @@ -21,8 +21,9 @@ tabindex="@(isEnabled ? 0 : -1)" disabled="@(isEnabled is false)" aria-disabled="@(isEnabled is false)" + title="@GetItemTitle(item)" style="@GetStyle(item)" - class="bit-btg-itm @GetClass(item)"> + class="@GetItemClass(item)"> @if (template is not null) { @template(item) @@ -33,12 +34,17 @@ } else { - var iconName = GetIconName(item); + var iconName = GetItemIconName(item); @if (iconName.HasValue()) { } - @GetText(item) + + var text = GetItemText(item); + if (text.HasValue()) + { + @text + } } } diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroup.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroup.razor.cs index 9c3229eb85..73b9ff5894 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroup.razor.cs +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroup.razor.cs @@ -4,11 +4,11 @@ namespace Bit.BlazorUI; public partial class BitButtonGroup : BitComponentBase where TItem : class { + private TItem? _toggleItem; private List _items = []; private IEnumerable _oldItems = default!; - /// /// The EditContext, which is set if the button is inside an /// @@ -27,6 +27,11 @@ public partial class BitButtonGroup : BitComponentBase where TItem : clas [Parameter, ResetClassBuilder] public BitColor? Color { get; set; } + /// + /// Determines that only the icon should be rendered. + /// + [Parameter] public bool IconOnly { get; set; } + /// /// List of Item, each of which can be a button with different action in the ButtonGroup. /// @@ -58,6 +63,11 @@ public partial class BitButtonGroup : BitComponentBase where TItem : clas [Parameter, ResetClassBuilder] public BitSize? Size { get; set; } + /// + /// Display ButtonGroup with toggle mode enabled for each button. + /// + [Parameter] public bool Toggled { get; set; } + /// /// The visual variant of the button group. /// @@ -143,7 +153,7 @@ protected override void OnParametersSet() if (_oldItems is not null && Items.SequenceEqual(_oldItems)) return; _oldItems = Items; - _items = Items.ToList(); + _items = [.. Items]; } @@ -175,6 +185,118 @@ private async Task HandleOnItemClick(TItem item) item.GetValueFromProperty?>(NameSelectors.OnClick.Name)?.Invoke(item); } } + + if (Toggled) + { + if (_toggleItem == item) + { + _toggleItem = null; + } + else + { + _toggleItem = item; + } + } + } + + private string? GetItemClass(TItem? item) + { + List classes = ["bit-btg-itm"]; + + if (GetReversedIcon(item)) + { + classes.Add("bit-btg-rvi"); + } + + if (_toggleItem == item) + { + classes.Add("bit-btg-chk"); + } + + var classItem = GetClass(item); + if (classItem.HasValue()) + { + classes.Add(classItem!); + } + + return string.Join(' ', classes); + } + + private string? GetItemText(TItem? item) + { + if (IconOnly) return null; + + if (Toggled) + { + if (_toggleItem == item) + { + var onText = GetOnText(item); + if (onText.HasValue()) + { + return onText; + } + } + else + { + var offText = GetOffText(item); + if (offText.HasValue()) + { + return offText; + } + } + } + + return GetText(item); + } + + private string? GetItemTitle(TItem? item) + { + if (Toggled) + { + if (_toggleItem == item) + { + var onTitle = GetOnTitle(item); + if (onTitle.HasValue()) + { + return onTitle; + } + } + else + { + var offTitle = GetOffTitle(item); + if (offTitle.HasValue()) + { + return offTitle; + } + } + } + + return GetTitle(item); + } + + private string? GetItemIconName(TItem? item) + { + if (Toggled) + { + if (_toggleItem == item) + { + var onIconName = GetOnIconName(item); + if (onIconName.HasValue()) + { + return onIconName; + } + } + else + { + var offIconName = GetOffIconName(item); + if (offIconName.HasValue()) + { + return offIconName; + } + } + } + + return GetIconName(item); } private string? GetClass(TItem? item) @@ -225,6 +347,54 @@ private async Task HandleOnItemClick(TItem item) return item.GetValueFromProperty(NameSelectors.IconName.Name); } + private string? GetOnIconName(TItem? item) + { + if (item is null) return null; + + if (item is BitButtonGroupItem buttonGroupItem) + { + return buttonGroupItem.OnIconName; + } + + if (item is BitButtonGroupOption buttonGroupOption) + { + return buttonGroupOption.OnIconName; + } + + if (NameSelectors is null) return null; + + if (NameSelectors.OnIconName.Selector is not null) + { + return NameSelectors.OnIconName.Selector!(item); + } + + return item.GetValueFromProperty(NameSelectors.OnIconName.Name); + } + + private string? GetOffIconName(TItem? item) + { + if (item is null) return null; + + if (item is BitButtonGroupItem buttonGroupItem) + { + return buttonGroupItem.OffIconName; + } + + if (item is BitButtonGroupOption buttonGroupOption) + { + return buttonGroupOption.OffIconName; + } + + if (NameSelectors is null) return null; + + if (NameSelectors.OffIconName.Selector is not null) + { + return NameSelectors.OffIconName.Selector!(item); + } + + return item.GetValueFromProperty(NameSelectors.OffIconName.Name); + } + private bool GetIsEnabled(TItem? item) { if (item is null) return false; @@ -320,4 +490,148 @@ private bool GetIsEnabled(TItem? item) return item.GetValueFromProperty(NameSelectors.Text.Name); } + + private string? GetOnText(TItem? item) + { + if (item is null) return null; + + if (item is BitButtonGroupItem buttonGroupItem) + { + return buttonGroupItem.OnText; + } + + if (item is BitButtonGroupOption buttonGroupOption) + { + return buttonGroupOption.OnText; + } + + if (NameSelectors is null) return null; + + if (NameSelectors.OnText.Selector is not null) + { + return NameSelectors.OnText.Selector!(item); + } + + return item.GetValueFromProperty(NameSelectors.OnText.Name); + } + + private string? GetOffText(TItem? item) + { + if (item is null) return null; + + if (item is BitButtonGroupItem buttonGroupItem) + { + return buttonGroupItem.OffText; + } + + if (item is BitButtonGroupOption buttonGroupOption) + { + return buttonGroupOption.OffText; + } + + if (NameSelectors is null) return null; + + if (NameSelectors.OffText.Selector is not null) + { + return NameSelectors.OffText.Selector!(item); + } + + return item.GetValueFromProperty(NameSelectors.OffText.Name); + } + + private string? GetTitle(TItem? item) + { + if (item is null) return null; + + if (item is BitButtonGroupItem buttonGroupItem) + { + return buttonGroupItem.Title; + } + + if (item is BitButtonGroupOption buttonGroupOption) + { + return buttonGroupOption.Title; + } + + if (NameSelectors is null) return null; + + if (NameSelectors.Title.Selector is not null) + { + return NameSelectors.Title.Selector!(item); + } + + return item.GetValueFromProperty(NameSelectors.Title.Name); + } + + private string? GetOnTitle(TItem? item) + { + if (item is null) return null; + + if (item is BitButtonGroupItem buttonGroupItem) + { + return buttonGroupItem.OnTitle; + } + + if (item is BitButtonGroupOption buttonGroupOption) + { + return buttonGroupOption.OnTitle; + } + + if (NameSelectors is null) return null; + + if (NameSelectors.OnTitle.Selector is not null) + { + return NameSelectors.OnTitle.Selector!(item); + } + + return item.GetValueFromProperty(NameSelectors.OnTitle.Name); + } + + private string? GetOffTitle(TItem? item) + { + if (item is null) return null; + + if (item is BitButtonGroupItem buttonGroupItem) + { + return buttonGroupItem.OffTitle; + } + + if (item is BitButtonGroupOption buttonGroupOption) + { + return buttonGroupOption.OffTitle; + } + + if (NameSelectors is null) return null; + + if (NameSelectors.OffTitle.Selector is not null) + { + return NameSelectors.OffTitle.Selector!(item); + } + + return item.GetValueFromProperty(NameSelectors.OffTitle.Name); + } + + private bool GetReversedIcon(TItem? item) + { + if (item is null) return false; + + if (item is BitButtonGroupItem buttonGroupItem) + { + return buttonGroupItem.ReversedIcon; + } + + if (item is BitButtonGroupOption buttonGroupOption) + { + return buttonGroupOption.ReversedIcon; + } + + if (NameSelectors is null) return false; + + if (NameSelectors.ReversedIcon.Selector is not null) + { + return NameSelectors.ReversedIcon.Selector!(item); + } + + return item.GetValueFromProperty(NameSelectors.ReversedIcon.Name, false); + } } diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroup.scss b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroup.scss index a630e467f4..9a55b86981 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroup.scss +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroup.scss @@ -34,6 +34,7 @@ line-height: inherit; text-decoration: none; box-sizing: border-box; + justify-content: center; font-family: $tg-font-family; font-weight: $tg-font-weight; border-style: $shp-border-style; @@ -69,6 +70,10 @@ } } +.bit-btg-rvi { + flex-direction: row-reverse; +} + .bit-btg-btx { white-space: nowrap; text-overflow: ellipsis; @@ -131,12 +136,33 @@ } } +.bit-btg-chk { + color: var(--bit-btg-clr-txt); + border-color: var(--bit-btg-clr-dark); + background-color: var(--bit-btg-clr-dark); + + @media (hover: hover) { + &:hover { + border-color: var(--bit-btg-clr-dark-hover); + background-color: var(--bit-btg-clr-dark-hover); + } + } + + &:active { + border-color: var(--bit-btg-clr-dark-active); + background-color: var(--bit-btg-clr-dark-active); + } +} + .bit-btg-pri { --bit-btg-clr: #{$clr-pri}; --bit-btg-clr-txt: #{$clr-pri-text}; --bit-btg-clr-brd: #{$clr-pri-dark}; --bit-btg-clr-hover: #{$clr-pri-hover}; --bit-btg-clr-active: #{$clr-pri-active}; + --bit-btg-clr-dark: #{$clr-pri-dark}; + --bit-btg-clr-dark-hover: #{$clr-pri-dark-hover}; + --bit-btg-clr-dark-active: #{$clr-pri-dark-active}; } .bit-btg-sec { @@ -145,6 +171,9 @@ --bit-btg-clr-brd: #{$clr-sec-dark}; --bit-btg-clr-hover: #{$clr-sec-hover}; --bit-btg-clr-active: #{$clr-sec-active}; + --bit-btg-clr-dark: #{$clr-sec-dark}; + --bit-btg-clr-dark-hover: #{$clr-sec-dark-hover}; + --bit-btg-clr-dark-active: #{$clr-sec-dark-active}; } .bit-btg-ter { @@ -153,6 +182,9 @@ --bit-btg-clr-brd: #{$clr-ter-dark}; --bit-btg-clr-hover: #{$clr-ter-hover}; --bit-btg-clr-active: #{$clr-ter-active}; + --bit-btg-clr-dark: #{$clr-ter-dark}; + --bit-btg-clr-dark-hover: #{$clr-ter-dark-hover}; + --bit-btg-clr-dark-active: #{$clr-ter-dark-active}; } .bit-btg-inf { @@ -161,6 +193,9 @@ --bit-btg-clr-brd: #{$clr-inf-dark}; --bit-btg-clr-hover: #{$clr-inf-hover}; --bit-btg-clr-active: #{$clr-inf-active}; + --bit-btg-clr-dark: #{$clr-inf-dark}; + --bit-btg-clr-dark-hover: #{$clr-inf-dark-hover}; + --bit-btg-clr-dark-active: #{$clr-inf-dark-active}; } .bit-btg-suc { @@ -169,6 +204,9 @@ --bit-btg-clr-brd: #{$clr-suc-dark}; --bit-btg-clr-hover: #{$clr-suc-hover}; --bit-btg-clr-active: #{$clr-suc-active}; + --bit-btg-clr-dark: #{$clr-suc-dark}; + --bit-btg-clr-dark-hover: #{$clr-suc-dark-hover}; + --bit-btg-clr-dark-active: #{$clr-suc-dark-active}; } .bit-btg-wrn { @@ -177,6 +215,9 @@ --bit-btg-clr-brd: #{$clr-wrn-dark}; --bit-btg-clr-hover: #{$clr-wrn-hover}; --bit-btg-clr-active: #{$clr-wrn-active}; + --bit-btg-clr-dark: #{$clr-wrn-dark}; + --bit-btg-clr-dark-hover: #{$clr-wrn-dark-hover}; + --bit-btg-clr-dark-active: #{$clr-wrn-dark-active}; } .bit-btg-swr { @@ -185,6 +226,9 @@ --bit-btg-clr-brd: #{$clr-swr-dark}; --bit-btg-clr-hover: #{$clr-swr-hover}; --bit-btg-clr-active: #{$clr-swr-active}; + --bit-btg-clr-dark: #{$clr-swr-dark}; + --bit-btg-clr-dark-hover: #{$clr-swr-dark-hover}; + --bit-btg-clr-dark-active: #{$clr-swr-dark-active}; } .bit-btg-err { @@ -193,6 +237,9 @@ --bit-btg-clr-brd: #{$clr-err-dark}; --bit-btg-clr-hover: #{$clr-err-hover}; --bit-btg-clr-active: #{$clr-err-active}; + --bit-btg-clr-dark: #{$clr-err-dark}; + --bit-btg-clr-dark-hover: #{$clr-err-dark-hover}; + --bit-btg-clr-dark-active: #{$clr-err-dark-active}; } @@ -202,6 +249,9 @@ --bit-btg-clr-brd: #{$clr-bg-pri}; --bit-btg-clr-hover: #{$clr-bg-pri-hover}; --bit-btg-clr-active: #{$clr-bg-pri-active}; + --bit-btg-clr-dark: #{$clr-bg-pri}; + --bit-btg-clr-dark-hover: #{$clr-bg-pri-hover}; + --bit-btg-clr-dark-active: #{$clr-bg-pri-active}; } .bit-btg-sbg { @@ -210,6 +260,9 @@ --bit-btg-clr-brd: #{$clr-bg-sec}; --bit-btg-clr-hover: #{$clr-bg-sec-hover}; --bit-btg-clr-active: #{$clr-bg-sec-active}; + --bit-btg-clr-dark: #{$clr-bg-sec}; + --bit-btg-clr-dark-hover: #{$clr-bg-sec-hover}; + --bit-btg-clr-dark-active: #{$clr-bg-sec-active}; } .bit-btg-tbg { @@ -218,6 +271,9 @@ --bit-btg-clr-brd: #{$clr-bg-ter}; --bit-btg-clr-hover: #{$clr-bg-ter-hover}; --bit-btg-clr-active: #{$clr-bg-ter-active}; + --bit-btg-clr-dark: #{$clr-bg-ter}; + --bit-btg-clr-dark-hover: #{$clr-bg-ter-hover}; + --bit-btg-clr-dark-active: #{$clr-bg-ter-active}; } .bit-btg-pfg { @@ -226,6 +282,9 @@ --bit-btg-clr-brd: #{$clr-fg-pri}; --bit-btg-clr-hover: #{$clr-fg-pri-hover}; --bit-btg-clr-active: #{$clr-fg-pri-active}; + --bit-btg-clr-dark: #{$clr-fg-pri}; + --bit-btg-clr-dark-hover: #{$clr-fg-pri-hover}; + --bit-btg-clr-dark-active: #{$clr-fg-pri-active}; } .bit-btg-sfg { @@ -234,6 +293,9 @@ --bit-btg-clr-brd: #{$clr-fg-sec}; --bit-btg-clr-hover: #{$clr-fg-sec-hover}; --bit-btg-clr-active: #{$clr-fg-sec-active}; + --bit-btg-clr-dark: #{$clr-fg-sec}; + --bit-btg-clr-dark-hover: #{$clr-fg-sec-hover}; + --bit-btg-clr-dark-active: #{$clr-fg-sec-active}; } .bit-btg-tfg { @@ -242,6 +304,9 @@ --bit-btg-clr-brd: #{$clr-fg-ter}; --bit-btg-clr-hover: #{$clr-fg-ter-hover}; --bit-btg-clr-active: #{$clr-fg-ter-active}; + --bit-btg-clr-dark: #{$clr-fg-ter}; + --bit-btg-clr-dark-hover: #{$clr-fg-ter-hover}; + --bit-btg-clr-dark-active: #{$clr-fg-ter-active}; } .bit-btg-pbr { @@ -250,6 +315,9 @@ --bit-btg-clr-brd: #{$clr-brd-pri}; --bit-btg-clr-hover: #{$clr-brd-pri-hover}; --bit-btg-clr-active: #{$clr-brd-pri-active}; + --bit-btg-clr-dark: #{$clr-brd-pri}; + --bit-btg-clr-dark-hover: #{$clr-brd-pri-hover}; + --bit-btg-clr-dark-active: #{$clr-brd-pri-active}; } .bit-btg-sbr { @@ -258,6 +326,9 @@ --bit-btg-clr-brd: #{$clr-brd-sec}; --bit-btg-clr-hover: #{$clr-brd-sec-hover}; --bit-btg-clr-active: #{$clr-brd-sec-active}; + --bit-btg-clr-dark: #{$clr-brd-sec}; + --bit-btg-clr-dark-hover: #{$clr-brd-sec-hover}; + --bit-btg-clr-dark-active: #{$clr-brd-sec-active}; } .bit-btg-tbr { @@ -266,6 +337,9 @@ --bit-btg-clr-brd: #{$clr-brd-ter}; --bit-btg-clr-hover: #{$clr-brd-ter-hover}; --bit-btg-clr-active: #{$clr-brd-ter-active}; + --bit-btg-clr-dark: #{$clr-brd-ter}; + --bit-btg-clr-dark-hover: #{$clr-brd-ter-hover}; + --bit-btg-clr-dark-active: #{$clr-brd-ter-active}; } diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroupItem.cs b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroupItem.cs index afa3ee18bd..0311d50980 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroupItem.cs +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroupItem.cs @@ -23,11 +23,46 @@ public class BitButtonGroupItem /// public string? Key { get; set; } + /// + /// The icon of the item when it is not checked in toggle mode. + /// + [Parameter] public string? OffIconName { get; set; } + + /// + /// The text of the item when it is not checked in toggle mode. + /// + [Parameter] public string? OffText { get; set; } + + /// + /// The title of the item when it is not checked in toggle mode. + /// + [Parameter] public string? OffTitle { get; set; } + + /// + /// The icon of the item when it is checked in toggle mode. + /// + [Parameter] public string? OnIconName { get; set; } + + /// + /// The text of the item when it is checked in toggle mode. + /// + [Parameter] public string? OnText { get; set; } + + /// + /// The title of the item when it is checked in toggle mode. + /// + [Parameter] public string? OnTitle { get; set; } + /// /// Click event handler of the item. /// public Action? OnClick { get; set; } + /// + /// Reverses the positions of the icon and the main content of the item. + /// + [Parameter] public bool ReversedIcon { get; set; } + /// /// The custom value for the style attribute of the item. /// @@ -42,4 +77,9 @@ public class BitButtonGroupItem /// Text to render in the item. /// public string? Text { get; set; } + + /// + /// Title to render in the item. + /// + public string? Title { get; set; } } diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroupNameSelectors.cs b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroupNameSelectors.cs index fe1caf82d6..75cd27bc93 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroupNameSelectors.cs +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroupNameSelectors.cs @@ -22,11 +22,46 @@ public class BitButtonGroupNameSelectors /// public BitNameSelectorPair Key { get; set; } = new(nameof(BitButtonGroupItem.Key)); + /// + /// OffIconName field name and selector of the custom input class. + /// + public BitNameSelectorPair OffIconName { get; set; } = new(nameof(BitButtonGroupItem.OffIconName)); + + /// + /// OffText field name and selector of the custom input class. + /// + public BitNameSelectorPair OffText { get; set; } = new(nameof(BitButtonGroupItem.OffText)); + + /// + /// OffTitle field name and selector of the custom input class. + /// + public BitNameSelectorPair OffTitle { get; set; } = new(nameof(BitButtonGroupItem.OffTitle)); + + /// + /// OnIconName field name and selector of the custom input class. + /// + public BitNameSelectorPair OnIconName { get; set; } = new(nameof(BitButtonGroupItem.OnIconName)); + + /// + /// OnText field name and selector of the custom input class. + /// + public BitNameSelectorPair OnText { get; set; } = new(nameof(BitButtonGroupItem.OnText)); + + /// + /// OnTitle field name and selector of the custom input class. + /// + public BitNameSelectorPair OnTitle { get; set; } = new(nameof(BitButtonGroupItem.OnTitle)); + /// /// OnClick field name and selector of the custom input class. /// public BitNameSelectorPair?> OnClick { get; set; } = new(nameof(BitButtonGroupItem.OnClick)); + /// + /// ReversedIcon field name and selector of the custom input class. + /// + public BitNameSelectorPair ReversedIcon { get; set; } = new(nameof(BitButtonGroupItem.ReversedIcon)); + /// /// The CSS Style field name and selector of the custom input class. /// @@ -41,4 +76,9 @@ public class BitButtonGroupNameSelectors /// Text field name and selector of the custom input class. /// public BitNameSelectorPair Text { get; set; } = new(nameof(BitButtonGroupItem.Text)); + + /// + /// Title field name and selector of the custom input class. + /// + public BitNameSelectorPair Title { get; set; } = new(nameof(BitButtonGroupItem.Title)); } diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroupOption.cs b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroupOption.cs index ce48fed62f..2380942365 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroupOption.cs +++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/BitButtonGroup/BitButtonGroupOption.cs @@ -28,11 +28,46 @@ public partial class BitButtonGroupOption : ComponentBase, IDisposable /// [Parameter] public string? Key { get; set; } + /// + /// The icon of the option when it is not checked in toggle mode. + /// + [Parameter] public string? OffIconName { get; set; } + + /// + /// The text of the option when it is not checked in toggle mode. + /// + [Parameter] public string? OffText { get; set; } + + /// + /// The title of the option when it is not checked in toggle mode. + /// + [Parameter] public string? OffTitle { get; set; } + + /// + /// The icon of the option when it is checked in toggle mode. + /// + [Parameter] public string? OnIconName { get; set; } + + /// + /// The text of the option when it is checked in toggle mode. + /// + [Parameter] public string? OnText { get; set; } + + /// + /// The title of the option when it is checked in toggle mode. + /// + [Parameter] public string? OnTitle { get; set; } + /// /// Click event handler of the option. /// [Parameter] public EventCallback OnClick { get; set; } + /// + /// Reverses the positions of the icon and the main content of the option. + /// + [Parameter] public bool ReversedIcon { get; set; } + /// /// The custom value for the style attribute of the option. /// @@ -48,6 +83,11 @@ public partial class BitButtonGroupOption : ComponentBase, IDisposable /// [Parameter] public string? Text { get; set; } + /// + /// Title to render in the option + /// + [Parameter] public string? Title { get; set; } + protected override async Task OnInitializedAsync() diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/_BitNavChild.razor b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/_BitNavChild.razor index a8fed5cdd7..4c2cf940fd 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/_BitNavChild.razor +++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/_BitNavChild.razor @@ -118,7 +118,7 @@ { <_BitNavItemContainer Href="@href" Target="@target" - OnClick="HandleOnClick" + OnClick="() => HandleOnClick(renderLink)" RenderLink="renderLink" Disabled="@(isEnabled is false)" AriaLabel="@Nav.GetAriaLabel(Item)" diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/_BitNavChild.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/_BitNavChild.razor.cs index dbe148bf7d..cd2271d7ab 100644 --- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/_BitNavChild.razor.cs +++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/_BitNavChild.razor.cs @@ -18,7 +18,7 @@ public partial class _BitNavChild where TItem : class - private async Task HandleOnClick() + private async Task HandleOnClick(bool renderLink) { if (Nav is null) return; if (Nav.GetIsEnabled(Item) is false) return; @@ -34,6 +34,10 @@ private async Task HandleOnClick() if (Nav.SelectedItem != Item || Nav.Reselectable) { + if (renderLink) + { + await Task.Yield(); // wait for the link to navigate first + } await Nav.OnItemClick.InvokeAsync(Item); } } diff --git a/src/BlazorUI/Bit.BlazorUI/Scripts/general.ts b/src/BlazorUI/Bit.BlazorUI/Scripts/general.ts index 7f7c98e6b8..439d021720 100644 --- a/src/BlazorUI/Bit.BlazorUI/Scripts/general.ts +++ b/src/BlazorUI/Bit.BlazorUI/Scripts/general.ts @@ -1,4 +1,4 @@ -(BitBlazorUI as any).version = (window as any)['bit-blazorui version'] = '9.1.1'; +(BitBlazorUI as any).version = (window as any)['bit-blazorui version'] = '9.1.2'; interface DotNetObject { invokeMethod(methodIdentifier: string, ...args: any[]): T; diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj index 7bbbb07f4a..a0b7a01a85 100644 --- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj +++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj @@ -5,11 +5,11 @@ - + all runtime; build; native; contentfiles; analyzers; buildtransitive - + all runtime; build; native; contentfiles; analyzers; buildtransitive diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Components/App.razor b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Components/App.razor index 8d494028ae..97d974449b 100644 --- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Components/App.razor +++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Components/App.razor @@ -60,34 +60,31 @@ } - @if (HttpContext.Request.IsCrawlerClient() is false) + + @if (AppRenderMode.PwaEnabled) + { + + + + } + else { - - @if (AppRenderMode.PwaEnabled) - { - - - - } - else - { - - } - - - - + } + }); + } + + + + diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Extensions/HttpRequestExtensions.cs b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Extensions/HttpRequestExtensions.cs index 6b0aa99f04..345f142315 100644 --- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Extensions/HttpRequestExtensions.cs +++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Extensions/HttpRequestExtensions.cs @@ -18,23 +18,4 @@ public static Uri GetBaseUrl(this HttpRequest req) return uriBuilder.Uri; } - - public static bool IsCrawlerClient(this HttpRequest request) - { - if (request.Headers.TryGetValue(HeaderNames.UserAgent, out StringValues userAgentHeaderValue) is false) - return false; - - string? userAgent = userAgentHeaderValue.FirstOrDefault(); - - if (userAgent is null) - return false; - - if (userAgent.Contains("google", StringComparison.InvariantCultureIgnoreCase)) return true; - - if (userAgent.Contains("bing", StringComparison.InvariantCultureIgnoreCase)) return true; - - if (userAgent.Contains("lighthouse", StringComparison.InvariantCultureIgnoreCase)) return true; - - return false; - } } diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj index c4c0f14ffc..2ec56da0bd 100644 --- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj +++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj @@ -5,11 +5,11 @@ - + all runtime; build; native; contentfiles; analyzers; buildtransitive - + all runtime; build; native; contentfiles; analyzers; buildtransitive diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj index cbe900ae9b..8f446710aa 100644 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj @@ -16,11 +16,11 @@ - + all runtime; build; native; contentfiles; analyzers; buildtransitive - + all runtime; build; native; contentfiles; analyzers; buildtransitive diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitActionButtonDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitActionButtonDemo.razor index 74944fa146..8f134e5109 100644 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitActionButtonDemo.razor +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitActionButtonDemo.razor @@ -38,7 +38,23 @@ - + + +
Use BitActionButton as a hyperlink to external URLs, with a rel attribute.
+
+
+ + Open bitplatform.dev with a rel attribute (nofollow) + + + + Open bitplatform.dev with a rel attribute (nofollow & noreferrer) + +
+
+
+ +
Demonstrates BitActionButton with various predefined colors: Primary, Secondary, Tertiary, Info, Success, Warning, SevereWarning, and Error.

@@ -133,7 +149,7 @@
- +
Show BitActionButton in different sizes: Small, Medium, and Large.

@@ -145,7 +161,7 @@
- +
Customize the appearance of BitActionButton using styles and CSS classes.

@@ -167,7 +183,7 @@
- +
Add custom template within BitActionButton.

@@ -182,7 +198,7 @@
- +
Use BitActionButton within a form and validate its state.

@@ -214,7 +230,7 @@
- +
Use BitActionButton in right-to-left (RTL).

diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitActionButtonDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitActionButtonDemo.razor.cs index 21ac7dcb05..9c4b43558f 100644 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitActionButtonDemo.razor.cs +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitActionButtonDemo.razor.cs @@ -110,6 +110,15 @@ public partial class BitActionButtonDemo Description = "Reverses the positions of the icon and the content of the button.", }, new() + { + Name = "Rel", + Type = "BitLinkRel?", + DefaultValue = "null", + Description = "If Href provided, specifies the relationship between the current document and the linked document.", + LinkType = LinkType.Link, + Href = "#button-rel", + }, + new() { Name = "Size", Type = "BitSize?", @@ -334,5 +343,92 @@ public partial class BitActionButtonDemo } ] }, + new() + { + Id = "button-rel", + Name = "BitLinkRel", + Description = "", + Items = + [ + new() + { + Name = "Alternate", + Value = "1", + Description = "Provides a link to an alternate representation of the document. (i.e. print page, translated or mirror)" + }, + new() + { + Name = "Author", + Value = "2", + Description = "Provides a link to the author of the document." + }, + new() + { + Name = "Bookmark", + Value = "4", + Description = "Permanent URL used for bookmarking." + }, + new() + { + Name = "External", + Value = "8", + Description = "Indicates that the referenced document is not part of the same site as the current document." + }, + new() + { + Name = "Help", + Value = "16", + Description = "Provides a link to a help document." + }, + new() + { + Name = "License", + Value = "32", + Description = "Provides a link to licensing information for the document." + }, + new() + { + Name = "Next", + Value = "64", + Description = "Provides a link to the next document in the series." + }, + new() + { + Name = "NoFollow", + Value = "128", + Description = @"Links to an unendorsed document, like a paid link. (""NoFollow"" is used by Google, to specify that the Google search spider should not follow that link)" + }, + new() + { + Name = "NoOpener", + Value = "256", + Description = "Requires that any browsing context created by following the hyperlink must not have an opener browsing context." + }, + new() + { + Name = "NoReferrer", + Value = "512", + Description = "Makes the referrer unknown. No referrer header will be included when the user clicks the hyperlink." + }, + new() + { + Name = "Prev", + Value = "1024", + Description = "The previous document in a selection." + }, + new() + { + Name = "Search", + Value = "2048", + Description = "Links to a search tool for the document." + }, + new() + { + Name = "Tag", + Value = "4096", + Description = "A tag (keyword) for the current document." + } + ] + }, ]; } diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitActionButtonDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitActionButtonDemo.razor.samples.cs index 719f683bd4..6de91030ef 100644 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitActionButtonDemo.razor.samples.cs +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/BitActionButtonDemo.razor.samples.cs @@ -18,6 +18,15 @@ Go to bitplatform GitHub "; private readonly string example3RazorCode = @" + + Open bitplatform.dev with a rel attribute (nofollow) + + + + Open bitplatform.dev with a rel attribute (nofollow & noreferrer) +"; + + private readonly string example4RazorCode = @" Primary Primary @@ -69,12 +78,12 @@ Go to bitplatform GitHub TertiaryBorder TertiaryBorder"; - private readonly string example4RazorCode = @" + private readonly string example5RazorCode = @" Small Medium Large"; - private readonly string example5RazorCode = @" + private readonly string example6RazorCode = @" - - - - - - i.Name }, - IconName = { Selector = i => i.Icon } })"" />"; - private readonly string example7CsharpCode = @" -private BitButtonGroupNameSelectors nameSelector = new() { Text = { Selector = i => i.Name } }; - -public class Operation -{ - public string? Name { get; set; } - public string? Icon { get; set; } - public string? Class { get; set; } - public string? Style { get; set; } -} - -private List basicCustoms = new() -{ - new() { Name = ""Add"" }, new() { Name = ""Edit"" }, new() { Name = ""Delete"" } -}; - -private List styleClassCustoms = new() -{ - new() - { - Name = ""Styled"", - Style = ""color: tomato; border-color: brown; background-color: peachpuff;"", - Icon = BitIconName.Brush, - }, - new() - { - Name = ""Classed"", - Class = ""custom-item"", - Icon = BitIconName.FormatPainter, - } -};"; - - private readonly string example8RazorCode = @" - clickedCustom = item.Name"" /> -
Clicked item: @clickedCustom
- - i.Name }, - IconName = { Selector = i => i.Icon }, - OnClick = { Selector = i => i.Clicked } })"" /> -
Click count: @clickCounter
"; - private readonly string example8CsharpCode = @" -private BitButtonGroupNameSelectors nameSelector = new() { Text = { Selector = i => i.Name } }; - -public class Operation -{ - public string? Name { get; set; } - public string? Icon { get; set; } - public Action? Clicked { get; set; } -} - -private int clickCounter; - -private List basicCustoms = new() -{ - new() { Name = ""Add"" }, new() { Name = ""Edit"" }, new() { Name = ""Delete"" } -}; - -private List eventsCustoms = new() -{ - new() { Name = ""Increase"", Icon = BitIconName.Add }, - new() { Name = ""Reset"", Icon = BitIconName.Reset }, - new() { Name = ""Decrease"", Icon = BitIconName.Remove } -}; - -protected override void OnInitialized() -{ - eventsCustoms[0].Clicked = _ => { clickCounter++; StateHasChanged(); }; - eventsCustoms[1].Clicked = _ => { clickCounter = 0; StateHasChanged(); }; - eventsCustoms[2].Clicked = _ => { clickCounter--; StateHasChanged(); }; -}"; - - private readonly string example9RazorCode = @" - i.Name }, - IconName = { Selector = i => i.Icon } })"" /> - - i.Name }, - IconName = { Selector = i => i.Icon } })"" /> - - i.Name }, - IconName = { Selector = i => i.Icon } })"" />"; - private readonly string example9CsharpCode = @" -public class Operation -{ - public string? Name { get; set; } - public string? Icon { get; set; } -} - -private List rtlCustoms = new() -{ - new() { Name = ""اضافه کردن"", Icon = BitIconName.Add }, - new() { Name = ""ویرایش"", Icon = BitIconName.Edit }, - new() { Name = ""حذف"", Icon = BitIconName.Delete } -};"; } diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razor.samples.cs new file mode 100644 index 0000000000..76886dd07e --- /dev/null +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupCustomDemo.razor.samples.cs @@ -0,0 +1,463 @@ +namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Buttons.ButtonGroup; + +public partial class _BitButtonGroupCustomDemo +{ + private readonly string example1RazorCode = @" +"; + private readonly string example1CsharpCode = @" +private BitButtonGroupNameSelectors nameSelector = new() { Text = { Selector = i => i.Name } }; + +public class Operation +{ + public string? Name { get; set; } +} + +private List basicCustoms = +[ + new() { Name = ""Add"" }, new() { Name = ""Edit"" }, new() { Name = ""Delete"" } +];"; + + private readonly string example2RazorCode = @" + + + + + + + + + + +"; + private readonly string example2CsharpCode = @" +private BitButtonGroupNameSelectors nameSelector = new() { Text = { Selector = i => i.Name } }; + +public class Operation +{ + public string? Name { get; set; } + public bool IsEnabled { get; set; } = true; +} + +private List basicCustoms = +[ + new() { Name = ""Add"" }, new() { Name = ""Edit"" }, new() { Name = ""Delete"" } +]; + +private List disabledCustoms = +[ + new() { Name = ""Add"" }, new() { Name = ""Edit"", IsEnabled = false }, new() { Name = ""Delete"" } +];"; + + private readonly string example3RazorCode = @" + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +"; + private readonly string example3CsharpCode = @" +private BitButtonGroupNameSelectors nameSelector = new() { Text = { Selector = i => i.Name } }; + +public class Operation +{ + public string? Name { get; set; } +} + +private List basicCustoms = +[ + new() { Name = ""Add"" }, new() { Name = ""Edit"" }, new() { Name = ""Delete"" } +];"; + + private readonly string example4RazorCode = @" + i.Name }, + IconName = { Selector = i => i.Icon } })"" /> + + i.Name }, + IconName = { Selector = i => i.Icon } })"" /> + + i.Name }, + IconName = { Selector = i => i.Icon } })"" />"; + private readonly string example4CsharpCode = @" +public class Operation +{ + public string? Name { get; set; } + public string? Icon { get; set; } +} + +private List iconCustoms = +[ + new() { Name = ""Add"", Icon = BitIconName.Add }, + new() { Name = ""Edit"", Icon = BitIconName.Edit }, + new() { Name = ""Delete"", Icon = BitIconName.Delete } +];"; + + private readonly string example5RazorCode = @" + i.Name }, + IconName = { Selector = i => i.Icon } })"" IconOnly /> + + i.Name }, + IconName = { Selector = i => i.Icon } })"" IconOnly /> + + i.Name }, + IconName = { Selector = i => i.Icon } })"" IconOnly /> + + + i.Name }, + IconName = { Selector = i => i.Icon } })"" /> + + i.Name }, + IconName = { Selector = i => i.Icon } })"" /> + + i.Name }, + IconName = { Selector = i => i.Icon } })"" />"; + private readonly string example5CsharpCode = @" +public class Operation +{ + public string? Name { get; set; } + public string? Icon { get; set; } +} + +private List iconCustoms = +[ + new() { Name = ""Add"", Icon = BitIconName.Add }, + new() { Name = ""Edit"", Icon = BitIconName.Edit }, + new() { Name = ""Delete"", Icon = BitIconName.Delete } +]; + +private List onlyIconCustoms = +[ + new() { Name = ""Add"", Icon = BitIconName.Add }, + new() { Icon = BitIconName.Edit }, + new() { Name = ""Delete"", Icon = BitIconName.Delete } +];"; + + private readonly string example6RazorCode = @" + i.Name }, + IconName = { Selector = i => i.Icon }, + ReversedIcon = { Selector = i => i.ReversedIcon } })"" /> + + i.Name }, + IconName = { Selector = i => i.Icon }, + ReversedIcon = { Selector = i => i.ReversedIcon } })"" /> + + i.Name }, + IconName = { Selector = i => i.Icon }, + ReversedIcon = { Selector = i => i.ReversedIcon } })"" />"; + private readonly string example6CsharpCode = @" +public class Operation +{ + public string? Name { get; set; } + public string? Icon { get; set; } + public bool ReversedIcon { get; set; } +} + +private List reversedIconCustoms = +[ + new() { Name = ""Add"", Icon = BitIconName.Add, ReversedIcon = true }, + new() { Name = ""Edit"", Icon = BitIconName.Edit, ReversedIcon = true }, + new() { Name = ""Delete"", Icon = BitIconName.Delete, ReversedIcon = true } +];"; + + private readonly string example7RazorCode = @" + i.OnName }, + OffText = { Selector = i => i.OffName }, + OnTitle = { Selector = i => i.OnTitle }, + OffTitle = { Selector = i => i.OffTitle }, + OnIconName = { Selector = i => i.OnIcon }, + OffIconName = { Selector = i => i.OffIcon }, + ReversedIcon = { Selector = i => i.ReversedIcon } })"" Toggled /> + + i.OnName }, + OffText = { Selector = i => i.OffName }, + OnTitle = { Selector = i => i.OnTitle }, + OffTitle = { Selector = i => i.OffTitle }, + OnIconName = { Selector = i => i.OnIcon }, + OffIconName = { Selector = i => i.OffIcon }, + ReversedIcon = { Selector = i => i.ReversedIcon } })"" Toggled /> + + i.OnName }, + OffText = { Selector = i => i.OffName }, + OnTitle = { Selector = i => i.OnTitle }, + OffTitle = { Selector = i => i.OffTitle }, + OnIconName = { Selector = i => i.OnIcon }, + OffIconName = { Selector = i => i.OffIcon }, + ReversedIcon = { Selector = i => i.ReversedIcon } })"" Toggled />"; + private readonly string example7CsharpCode = @" +public class Operation +{ + public string? OnIcon { get; set; } + public string? OffIcon { get; set; } + public string? OnName { get; set; } + public string? OffName { get; set; } + public string? OnTitle { get; set; } + public string? OffTitle { get; set; } + public bool ReversedIcon { get; set; } +} + +private List toggledCustoms = +[ + new() { OnName = ""Back (2X)"", OffName = ""Back"", OnIcon = BitIconName.RewindTwoX, OffIcon = BitIconName.Rewind }, + new() { OnTitle = ""Resume"", OffTitle = ""Play"", OnIcon = BitIconName.PlayResume, OffIcon = BitIconName.Play }, + new() { OnName = ""Forward (2X)"", OffName = ""Forward"", OnIcon = BitIconName.FastForwardTwoX, OffIcon = BitIconName.FastForward, ReversedIcon = true } +];"; + + private readonly string example8RazorCode = @" + + +"; + private readonly string example8CsharpCode = @" +private BitButtonGroupNameSelectors nameSelector = new() { Text = { Selector = i => i.Name } }; + +public class Operation +{ + public string? Name { get; set; } +} + +private List basicCustoms = +[ + new() { Name = ""Add"" }, new() { Name = ""Edit"" }, new() { Name = ""Delete"" } +];"; + + private readonly string example9RazorCode = @" + + + + + + + + + + +"; + private readonly string example9CsharpCode = @" +private BitButtonGroupNameSelectors nameSelector = new() { Text = { Selector = i => i.Name } }; + +public class Operation +{ + public string? Name { get; set; } +} + +private List basicCustoms = +[ + new() { Name = ""Add"" }, new() { Name = ""Edit"" }, new() { Name = ""Delete"" } +];"; + + private readonly string example10RazorCode = @" + + + + + + + i.Name }, + IconName = { Selector = i => i.Icon } })"" />"; + private readonly string example10CsharpCode = @" +private BitButtonGroupNameSelectors nameSelector = new() { Text = { Selector = i => i.Name } }; + +public class Operation +{ + public string? Name { get; set; } + public string? Icon { get; set; } + public string? Class { get; set; } + public string? Style { get; set; } +} + +private List basicCustoms = +[ + new() { Name = ""Add"" }, new() { Name = ""Edit"" }, new() { Name = ""Delete"" } +]; + +private List styleClassCustoms = +[ + new() + { + Name = ""Styled"", + Style = ""color: tomato; border-color: brown; background-color: peachpuff;"", + Icon = BitIconName.Brush, + }, + new() + { + Name = ""Classed"", + Class = ""custom-item"", + Icon = BitIconName.FormatPainter, + } +];"; + + private readonly string example11RazorCode = @" + clickedCustom = item.Name"" /> +
Clicked item: @clickedCustom
+ + i.Name }, + IconName = { Selector = i => i.Icon }, + OnClick = { Selector = i => i.Clicked } })"" /> +
Click count: @clickCounter
"; + private readonly string example11CsharpCode = @" +private BitButtonGroupNameSelectors nameSelector = new() { Text = { Selector = i => i.Name } }; + +public class Operation +{ + public string? Name { get; set; } + public string? Icon { get; set; } + public Action? Clicked { get; set; } +} + +private int clickCounter; + +private List basicCustoms = +[ + new() { Name = ""Add"" }, new() { Name = ""Edit"" }, new() { Name = ""Delete"" } +]; + +private List eventsCustoms = +[ + new() { Name = ""Increase"", Icon = BitIconName.Add }, + new() { Name = ""Reset"", Icon = BitIconName.Reset }, + new() { Name = ""Decrease"", Icon = BitIconName.Remove } +]; + +protected override void OnInitialized() +{ + eventsCustoms[0].Clicked = _ => { clickCounter++; StateHasChanged(); }; + eventsCustoms[1].Clicked = _ => { clickCounter = 0; StateHasChanged(); }; + eventsCustoms[2].Clicked = _ => { clickCounter--; StateHasChanged(); }; +}"; + + private readonly string example12RazorCode = @" + i.Name }, + IconName = { Selector = i => i.Icon } })"" /> + + i.Name }, + IconName = { Selector = i => i.Icon } })"" /> + + i.Name }, + IconName = { Selector = i => i.Icon } })"" />"; + private readonly string example12CsharpCode = @" +public class Operation +{ + public string? Name { get; set; } + public string? Icon { get; set; } +} + +private List rtlCustoms = +[ + new() { Name = ""اضافه کردن"", Icon = BitIconName.Add }, + new() { Name = ""ویرایش"", Icon = BitIconName.Edit }, + new() { Name = ""حذف"", Icon = BitIconName.Delete } +];"; +} diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor index 4bdd3a2b85..f8988ea109 100644 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor @@ -181,7 +181,87 @@
- + + +
The IconOnly allows buttons to display only icons without any text, ideal for minimalistic designs or limited space.
+

+
+
Fill (default)
+ +
+

+
+
Outline
+ +
+

+
+
Text
+ +
+

+
Alternatively, each button can be set to IconOnly by simply leaving the text field empty.
+

+
+
Fill (default)
+ +
+

+
+
Outline
+ +
+

+
+
Text
+ +
+
+
+ + + +
Reverses the positions of the icon and the main content of the button.
+

+
+
Fill (default)
+ +
+

+
+
Outline
+ +
+

+
+
Text
+ +
+
+
+ + + +
The Toggled in BitButtonGroup allows you to control the active or inactive state of each button, providing clear visual feedback to users about which buttons are selected or currently in use.
+

+
+
Fill (default)
+ +
+

+
+
Outline
+ +
+

+
+
Text
+ +
+
+
+ +
By default the BitButtonGroup component is horizontal, but can be turned vertical by adding the Vertical property.


@@ -204,7 +284,7 @@
- +
Different sizes for buttons to meet design needs, ensuring flexibility within your application.


@@ -231,7 +311,7 @@
- +
Empower customization by overriding default styles and classes, allowing tailored design modifications to suit specific UI requirements.


@@ -248,7 +328,7 @@
- +
Managing button click events.


@@ -266,7 +346,7 @@
- +
Use BitButtonGroup in right-to-left (RTL).

diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor.cs index 1f27935f6f..15b29a29c7 100644 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor.cs +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor.cs @@ -22,6 +22,27 @@ public partial class _BitButtonGroupItemDemo new() { Text = "Delete", IconName = BitIconName.Delete } ]; + private List onlyIconItems = + [ + new() { Text = "Add", IconName = BitIconName.Add }, + new() { IconName = BitIconName.Edit }, + new() { Text = "Delete", IconName = BitIconName.Delete } + ]; + + private List reversedIconItems = + [ + new() { Text = "Add", IconName = BitIconName.Add, ReversedIcon = true }, + new() { Text = "Edit", IconName = BitIconName.Edit, ReversedIcon = true }, + new() { Text = "Delete", IconName = BitIconName.Delete, ReversedIcon = true } + ]; + + private List toggledItems = + [ + new() { OnText = "Back (2X)", OffText = "Back", OnIconName = BitIconName.RewindTwoX, OffIconName = BitIconName.Rewind }, + new() { OnTitle = "Resume", OffTitle = "Play", OnIconName = BitIconName.PlayResume, OffIconName = BitIconName.Play }, + new() { OnText = "Forward (2X)", OffText = "Forward", OnIconName = BitIconName.FastForwardTwoX, OffIconName = BitIconName.FastForward, ReversedIcon = true } + ]; + private List eventsItems = [ new() { Text = "Increase", IconName = BitIconName.Add }, @@ -58,242 +79,4 @@ protected override void OnInitialized() eventsItems[1].OnClick = _ => { clickCounter = 0; StateHasChanged(); }; eventsItems[2].OnClick = _ => { clickCounter--; StateHasChanged(); }; } - - - - private readonly string example1RazorCode = @" -"; - private readonly string example1CsharpCode = @" -private List basicItems = new() -{ - new() { Text = ""Add"" }, new() { Text = ""Edit"" }, new() { Text = ""Delete"" } -};"; - - private readonly string example2RazorCode = @" - - - - - - - - - - -"; - private readonly string example2CsharpCode = @" -private List basicItems = new() -{ - new() { Text = ""Add"" }, new() { Text = ""Edit"" }, new() { Text = ""Delete"" } -}; - -private List disabledItems = new() -{ - new() { Text = ""Add"" }, new() { Text = ""Edit"", IsEnabled = false }, new() { Text = ""Delete"" } -};"; - - private readonly string example3RazorCode = @" - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -"; - private readonly string example3CsharpCode = @" -private List basicItems = new() -{ - new() { Text = ""Add"" }, new() { Text = ""Edit"" }, new() { Text = ""Delete"" } -};"; - - private readonly string example4RazorCode = @" - - -"; - private readonly string example4CsharpCode = @" -private List iconItems = new() -{ - new() { Text = ""Add"", IconName = BitIconName.Add }, - new() { Text = ""Edit"", IconName = BitIconName.Edit }, - new() { Text = ""Delete"", IconName = BitIconName.Delete } -};"; - - private readonly string example5RazorCode = @" - - -"; - private readonly string example5CsharpCode = @" -private List basicItems = new() -{ - new() { Text = ""Add"" }, new() { Text = ""Edit"" }, new() { Text = ""Delete"" } -};"; - - private readonly string example6RazorCode = @" - - - - - - - - - - -"; - private readonly string example6CsharpCode = @" -private List basicItems = new() -{ - new() { Text = ""Add"" }, new() { Text = ""Edit"" }, new() { Text = ""Delete"" } -};"; - - private readonly string example7RazorCode = @" - - - - - - -"; - private readonly string example7CsharpCode = @" -private List basicItems = new() -{ - new() { Text = ""Add"" }, new() { Text = ""Edit"" }, new() { Text = ""Delete"" } -}; - -private List styleClassItems = new() -{ - new() - { - Text = ""Styled"", - Style = ""color: tomato; border-color: brown; background-color: peachpuff;"", - IconName = BitIconName.Brush, - }, - new() - { - Text = ""Classed"", - Class = ""custom-item"", - IconName = BitIconName.FormatPainter, - } -};"; - - private readonly string example8RazorCode = @" - clickedItem = item.Text"" /> -
Clicked item: @clickedItem
- - -
Click count: @clickCounter
"; - private readonly string example8CsharpCode = @" -private int clickCounter; -private string? clickedItem; - -private List eventsItems = new() -{ - new() { Text = ""Increase"", IconName = BitIconName.Add }, - new() { Text = ""Reset"", IconName = BitIconName.Reset }, - new() { Text = ""Decrease"", IconName = BitIconName.Remove } -}; - -protected override void OnInitialized() -{ - eventsItems[0].OnClick = _ => { clickCounter++; StateHasChanged(); }; - eventsItems[1].OnClick = _ => { clickCounter = 0; StateHasChanged(); }; - eventsItems[2].OnClick = _ => { clickCounter--; StateHasChanged(); }; -}"; - - private readonly string example9RazorCode = @" - - -"; - private readonly string example9CsharpCode = @" -private List rtlItems = new() -{ - new() { Text = ""اضافه کردن"", IconName = BitIconName.Add }, - new() { Text = ""ویرایش"", IconName = BitIconName.Edit }, - new() { Text = ""حذف"", IconName = BitIconName.Delete } -};"; } diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor.samples.cs new file mode 100644 index 0000000000..e41be97a4f --- /dev/null +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupItemDemo.razor.samples.cs @@ -0,0 +1,287 @@ +namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Buttons.ButtonGroup; + +public partial class _BitButtonGroupItemDemo +{ + private readonly string example1RazorCode = @" +"; + private readonly string example1CsharpCode = @" +private List basicItems = +[ + new() { Text = ""Add"" }, new() { Text = ""Edit"" }, new() { Text = ""Delete"" } +];"; + + private readonly string example2RazorCode = @" + + + + + + + + + + +"; + private readonly string example2CsharpCode = @" +private List basicItems = +[ + new() { Text = ""Add"" }, new() { Text = ""Edit"" }, new() { Text = ""Delete"" } +]; + +private List disabledItems = +[ + new() { Text = ""Add"" }, new() { Text = ""Edit"", IsEnabled = false }, new() { Text = ""Delete"" } +];"; + + private readonly string example3RazorCode = @" + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +"; + private readonly string example3CsharpCode = @" +private List basicItems = +[ + new() { Text = ""Add"" }, new() { Text = ""Edit"" }, new() { Text = ""Delete"" } +];"; + + private readonly string example4RazorCode = @" + + +"; + private readonly string example4CsharpCode = @" +private List iconItems = +[ + new() { Text = ""Add"", IconName = BitIconName.Add }, + new() { Text = ""Edit"", IconName = BitIconName.Edit }, + new() { Text = ""Delete"", IconName = BitIconName.Delete } +];"; + + private readonly string example5RazorCode = @" + + + + + + +"; + private readonly string example5CsharpCode = @" +private List iconItems = +[ + new() { Text = ""Add"", IconName = BitIconName.Add }, + new() { Text = ""Edit"", IconName = BitIconName.Edit }, + new() { Text = ""Delete"", IconName = BitIconName.Delete } +]; + +private List onlyIconItems = +[ + new() { Text = ""Add"", IconName = BitIconName.Add }, + new() { IconName = BitIconName.Edit }, + new() { Text = ""Delete"", IconName = BitIconName.Delete } +];"; + + private readonly string example6RazorCode = @" + + +"; + private readonly string example6CsharpCode = @" +private List reversedIconItems = +[ + new() { Text = ""Add"", IconName = BitIconName.Add, ReversedIcon = true }, + new() { Text = ""Edit"", IconName = BitIconName.Edit, ReversedIcon = true }, + new() { Text = ""Delete"", IconName = BitIconName.Delete, ReversedIcon = true } +];"; + + private readonly string example7RazorCode = @" + + +"; + private readonly string example7CsharpCode = @" +private List toggledItems = +[ + new() { OnText = ""Back (2X)"", OffText = ""Back"", OnIconName = BitIconName.RewindTwoX, OffIconName = BitIconName.Rewind }, + new() { OnTitle = ""Resume"", OffTitle = ""Play"", OnIconName = BitIconName.PlayResume, OffIconName = BitIconName.Play }, + new() { OnText = ""Forward (2X)"", OffText = ""Forward"", OnIconName = BitIconName.FastForwardTwoX, OffIconName = BitIconName.FastForward, ReversedIcon = true } +];"; + + private readonly string example8RazorCode = @" + + +"; + private readonly string example8CsharpCode = @" +private List basicItems = +[ + new() { Text = ""Add"" }, new() { Text = ""Edit"" }, new() { Text = ""Delete"" } +];"; + + private readonly string example9RazorCode = @" + + + + + + + + + + +"; + private readonly string example9CsharpCode = @" +private List basicItems = +[ + new() { Text = ""Add"" }, new() { Text = ""Edit"" }, new() { Text = ""Delete"" } +];"; + + private readonly string example10RazorCode = @" + + + + + + +"; + private readonly string example10CsharpCode = @" +private List basicItems = +[ + new() { Text = ""Add"" }, new() { Text = ""Edit"" }, new() { Text = ""Delete"" } +]; + +private List styleClassItems = +[ + new() + { + Text = ""Styled"", + Style = ""color: tomato; border-color: brown; background-color: peachpuff;"", + IconName = BitIconName.Brush, + }, + new() + { + Text = ""Classed"", + Class = ""custom-item"", + IconName = BitIconName.FormatPainter, + } +];"; + + private readonly string example11RazorCode = @" + clickedItem = item.Text"" /> +
Clicked item: @clickedItem
+ + +
Click count: @clickCounter
"; + private readonly string example11CsharpCode = @" +private int clickCounter; +private string? clickedItem; + +private List eventsItems = +[ + new() { Text = ""Increase"", IconName = BitIconName.Add }, + new() { Text = ""Reset"", IconName = BitIconName.Reset }, + new() { Text = ""Decrease"", IconName = BitIconName.Remove } +]; + +protected override void OnInitialized() +{ + eventsItems[0].OnClick = _ => { clickCounter++; StateHasChanged(); }; + eventsItems[1].OnClick = _ => { clickCounter = 0; StateHasChanged(); }; + eventsItems[2].OnClick = _ => { clickCounter--; StateHasChanged(); }; +}"; + + private readonly string example12RazorCode = @" + + +"; + private readonly string example12CsharpCode = @" +private List rtlItems = +[ + new() { Text = ""اضافه کردن"", IconName = BitIconName.Add }, + new() { Text = ""ویرایش"", IconName = BitIconName.Edit }, + new() { Text = ""حذف"", IconName = BitIconName.Delete } +];"; +} diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor index 78a2bcee32..6828f69be3 100644 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor @@ -317,7 +317,135 @@
- + + +
The IconOnly allows buttons to display only icons without any text, ideal for minimalistic designs or limited space.
+

+
+
Fill (default)
+ + + + + +
+

+
+
Outline
+ + + + + +
+

+
+
Text
+ + + + + +
+

+
Alternatively, each button can be set to IconOnly by simply leaving the text field empty.
+

+
+
Fill (default)
+ + + + + +
+

+
+
Outline
+ + + + + +
+

+
+
Text
+ + + + + +
+
+
+ + + +
Reverses the positions of the icon and the main content of the button.
+

+
+
Fill (default)
+ + + + + +
+

+
+
Outline
+ + + + + +
+

+
+
Text
+ + + + + +
+
+
+ + + +
The Toggled in BitButtonGroup allows you to control the active or inactive state of each button, providing clear visual feedback to users about which buttons are selected or currently in use.
+

+
+
Fill (default)
+ + + + + +
+

+
+
Outline
+ + + + + +
+

+
+
Text
+ + + + + +
+
+
+ +
By default the BitButtonGroup component is horizontal, but can be turned vertical by adding the Vertical property.


@@ -346,7 +474,7 @@
- +
Different sizes for buttons to meet design needs, ensuring flexibility within your application.


@@ -391,7 +519,7 @@
- +
Empower customization by overriding default styles and classes, allowing tailored design modifications to suit specific UI requirements.


@@ -416,7 +544,7 @@
- +
Managing button click events.


@@ -442,7 +570,7 @@
- +
Use BitButtonGroup in right-to-left (RTL).

diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor.cs index 3512afd078..998174d625 100644 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor.cs +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor.cs @@ -4,356 +4,4 @@ public partial class _BitButtonGroupOptionDemo { private int clickCounter; private string? clickedOption; - - private readonly string example1RazorCode = @" - - - - -"; - - private readonly string example2RazorCode = @" - - - - - - - - - - - - - - - - - - - - - - - - - - - - -"; - - private readonly string example3RazorCode = @" - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -"; - - private readonly string example4RazorCode = @" - - - - - - - - - - - - - - - - -"; - - private readonly string example5RazorCode = @" - - - - - - - - - - -"; - - private readonly string example6RazorCode = @" - - - - - - - - - - - - - - - - - - - - - - - - - - - - -"; - - private readonly string example7RazorCode = @" - - - - - - - - - - - - - - - -"; - - private readonly string example8RazorCode = @" - clickedOption = item.Text"" TItem=""BitButtonGroupOption""> - - - - -
Clicked item: @clickedOption
- - - { clickCounter++; StateHasChanged(); }"" /> - { clickCounter=0; StateHasChanged(); }"" /> - { clickCounter--; StateHasChanged(); }"" /> - -
Click count: @clickCounter
"; - private readonly string example8CsharpCode = @" -private int clickCounter; -private string? clickedOption;"; - - private readonly string example9RazorCode = @" - - - - - - - - - - - - - - - - -"; } diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor.samples.cs new file mode 100644 index 0000000000..796c28abae --- /dev/null +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/ButtonGroup/_BitButtonGroupOptionDemo.razor.samples.cs @@ -0,0 +1,433 @@ +namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Buttons.ButtonGroup; + +public partial class _BitButtonGroupOptionDemo +{ + private readonly string example1RazorCode = @" + + + + +"; + + private readonly string example2RazorCode = @" + + + + + + + + + + + + + + + + + + + + + + + + + + + + +"; + + private readonly string example3RazorCode = @" + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +"; + + private readonly string example4RazorCode = @" + + + + + + + + + + + + + + + + +"; + + private readonly string example5RazorCode = @" + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +"; + + private readonly string example6RazorCode = @" + + + + + + + + + + + + + + + + +"; + + private readonly string example7RazorCode = @" + + + + + + + + + + + + + + + + +"; + + private readonly string example8RazorCode = @" + + + + + + + + + + +"; + + private readonly string example9RazorCode = @" + + + + + + + + + + + + + + + + + + + + + + + + + + + + +"; + + private readonly string example10RazorCode = @" + + + + + + + + + + + + + + + +"; + + private readonly string example11RazorCode = @" + clickedOption = item.Text"" TItem=""BitButtonGroupOption""> + + + + +
Clicked item: @clickedOption
+ + + { clickCounter++; StateHasChanged(); }"" /> + { clickCounter=0; StateHasChanged(); }"" /> + { clickCounter--; StateHasChanged(); }"" /> + +
Click count: @clickCounter
"; + private readonly string example11CsharpCode = @" +private int clickCounter; +private string? clickedOption;"; + + private readonly string example12RazorCode = @" + + + + + + + + + + + + + + + + +"; +} diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Layouts/Stack/BitStackDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Layouts/Stack/BitStackDemo.razor index 3a1fb48261..cc78f13d21 100644 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Layouts/Stack/BitStackDemo.razor +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Layouts/Stack/BitStackDemo.razor @@ -73,8 +73,8 @@ - - + +
- - + +
+ + + +
An illustrative example of integrating this component into a straightforward mobile application.
+
+
+
+ +
+ + + + + bit BlazorUI + + + +
+
+ + + + Swipe left or right + + + +
+
+

Left Menu

+
Item1
+
Item2
+
Item3
+
+
+
+
+

Right Menu

+
Item1
+
Item2
+
Item3
+
+
+
+
+
+
+
+
+
\ No newline at end of file diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/SwipeTrap/BitSwipeTrapDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/SwipeTrap/BitSwipeTrapDemo.razor.cs index 800b85ba46..7295603970 100644 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/SwipeTrap/BitSwipeTrapDemo.razor.cs +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/SwipeTrap/BitSwipeTrapDemo.razor.cs @@ -296,275 +296,110 @@ private void ResetList() } - - private readonly string example1RazorCode = @" - - - -
-
StartX: @swipeTrapEventArgs?.StartX
-
StartY: @swipeTrapEventArgs?.StartY
-
DiffX: @swipeTrapEventArgs?.DiffX
-
DiffY: @swipeTrapEventArgs?.DiffY
-
---
-
Triggered? @isTriggered
-
Trigger direction: @swipeTrapTriggerArgs?.Direction
-
Trigger diffX: @swipeTrapTriggerArgs?.DiffX
-
Trigger diffY: @swipeTrapTriggerArgs?.DiffY
-
-
"; - private readonly string example1CsharpCode = @" -private bool isTriggeredBasic; -BitSwipeTrapEventArgs? swipeTrapEventArgsBasic; -BitSwipeTrapTriggerArgs? swipeTrapTriggerArgsBasic; -private void HandleOnStartBasic(BitSwipeTrapEventArgs args) -{ - swipeTrapEventArgsBasic = args; -} -private void HandleOnMoveBasic(BitSwipeTrapEventArgs args) -{ - swipeTrapEventArgsBasic = args; -} -private void HandleOnEndBasic(BitSwipeTrapEventArgs args) -{ - swipeTrapEventArgsBasic = args; -} -private void HandleOnTriggerBasic(BitSwipeTrapTriggerArgs args) -{ - isTriggeredBasic = true; - swipeTrapTriggerArgsBasic = args; - _ = Task.Delay(2000).ContinueWith(_ => + private decimal? diffXPanelAdvanced; + private BitSwipeDirection? direction; + private BitSwipeDirection? panelOpen; + private void OpenPanelAdvanced(BitSwipeDirection swipeDirection) { - isTriggeredBasic = false; - swipeTrapEventArgsBasic = null; - swipeTrapTriggerArgsBasic = null; - InvokeAsync(StateHasChanged); - }); -}"; + if (panelOpen == swipeDirection) return; - private readonly string example2RazorCode = @" - - -
- -
- - -
-

Title

-
Item1
-
Item2
-
Item3
-
-
-
-
"; - private readonly string example2CsharpCode = @" -private decimal diffXPanel; -private bool isPanelOpen; -private void OpenPanel() -{ - isPanelOpen = true; -} -private void ClosePanel() -{ - isPanelOpen = false; -} -private void HandleOnMovePanel(BitSwipeTrapEventArgs args) -{ - diffXPanel = args.DiffX; -} -private void HandleOnEndPanel(BitSwipeTrapEventArgs args) -{ - diffXPanel = 0; -} -private void HandleOnTriggerPanel(BitSwipeTrapTriggerArgs args) -{ - if (args.Direction == BitSwipeDirection.Left) + private void ClosePanelAdvanced() { - diffXPanel = 0; - ClosePanel(); - } -} -private string GetPanelStyle() -{ - return diffXPanel < 0 ? $""transform: translateX({diffXPanel}px)"" : """"; -}"; - - private readonly string example3RazorCode = @" - - -
- @foreach (int idx in itemsList) + private void HandleOnEndPanelAdvanced(BitSwipeTrapEventArgs args) { - var i = idx; -
-
Delete
- HandleOnMoveList(args, i)"" - OnEnd=""args => HandleOnEndList(args, i)"" - OnTrigger=""args => HandleOnTriggerList(args, i)""> -
-
Item@(i + 1)
-
-
-
+ if (panelOpen.HasValue) + { + diffXPanelAdvanced = 0; + } + else + { + diffXPanelAdvanced = null; + } } -
-Reset -"; - private readonly string example3CsharpCode = @" -private int deletingIndex = -1; -private bool isListDialogOpen; -private TaskCompletionSource listTcs; -private List itemsList = Enumerable.Range(0, 10).ToList(); -private decimal[] diffXList = Enumerable.Repeat(0m, 10).ToArray(); -private void HandleOnMoveList(BitSwipeTrapEventArgs args, int index) -{ - diffXList[index] = args.DiffX; -} -private void HandleOnEndList(BitSwipeTrapEventArgs args, int index) -{ - if (diffXList[index] < 60) + private void HandleOnTriggerPanelAdvanced(BitSwipeTrapTriggerArgs args) { - diffXList[index] = 0; + if (args.Direction == BitSwipeDirection.Left) + { + if (panelOpen.HasValue is false || panelOpen == BitSwipeDirection.Right) + { + OpenPanelAdvanced(BitSwipeDirection.Right); + } + else if (panelOpen == BitSwipeDirection.Left) + { + ClosePanelAdvanced(); + } + } + else if (args.Direction == BitSwipeDirection.Right) + { + if (panelOpen.HasValue is false || panelOpen == BitSwipeDirection.Left) + { + OpenPanelAdvanced(BitSwipeDirection.Left); + } + else if (panelOpen == BitSwipeDirection.Right) + { + ClosePanelAdvanced(); + } + } } -} -private async Task HandleOnTriggerList(BitSwipeTrapTriggerArgs args, int index) -{ - if (args.Direction == BitSwipeDirection.Right) + private string GetLeftPanelAdvancedStyle() { - deletingIndex = index; - listTcs = new(); - isListDialogOpen = true; - await listTcs.Task; - isListDialogOpen = false; - diffXList[index] = 0; - deletingIndex = -1; + if (panelOpen == BitSwipeDirection.Left && direction != BitSwipeDirection.Left) + { + return "transform: translateX(0px)"; + } + else if((panelOpen.HasValue is false && direction == BitSwipeDirection.Right) || (panelOpen == BitSwipeDirection.Left && direction == BitSwipeDirection.Left)) + { + return diffXPanelAdvanced switch + { + 0 or > 200 => "transform: translateX(0px)", + < 0 and < 200 => $"transform: translateX({diffXPanelAdvanced}px)", + > 0 => $"transform: translateX(calc(-100% + {diffXPanelAdvanced}px))", + _ => string.Empty + }; + } + + return string.Empty; } -} -private string GetRowStyle(int index) -{ - var x = Math.Min(diffXList[index], 60); - return x > 0 ? $""transform: translateX({x}px)"" : """"; -} -private void HandleOnOkList() -{ - if (deletingIndex != -1) + private string GetRightPanelAdvancedStyle() { - itemsList.Remove(deletingIndex); + if (panelOpen == BitSwipeDirection.Right && direction != BitSwipeDirection.Right) + { + return "transform: translateX(0px)"; + } + else if ((panelOpen.HasValue is false && direction == BitSwipeDirection.Left) || (panelOpen == BitSwipeDirection.Right && direction == BitSwipeDirection.Right)) + { + return diffXPanelAdvanced switch + { + 0 or < -200 => "transform: translateX(0px)", + > 0 => $"transform: translateX({diffXPanelAdvanced}px)", + < 0 => $"transform: translateX(calc(100% - {(-1 * diffXPanelAdvanced)}px))", + _ => string.Empty + }; + } + + return string.Empty; } - listTcs.SetResult(); -} -private void HandleOnCancelList() -{ - listTcs.SetResult(); -} -private void ResetList() -{ - itemsList = Enumerable.Range(0, 10).ToList(); -}"; } diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/SwipeTrap/BitSwipeTrapDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/SwipeTrap/BitSwipeTrapDemo.razor.samples.cs new file mode 100644 index 0000000000..68af948649 --- /dev/null +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/SwipeTrap/BitSwipeTrapDemo.razor.samples.cs @@ -0,0 +1,487 @@ +namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Utilities.SwipeTrap; + +public partial class BitSwipeTrapDemo +{ + + private readonly string example1RazorCode = @" + + + +
+
StartX: @swipeTrapEventArgs?.StartX
+
StartY: @swipeTrapEventArgs?.StartY
+
DiffX: @swipeTrapEventArgs?.DiffX
+
DiffY: @swipeTrapEventArgs?.DiffY
+
---
+
Triggered? @isTriggered
+
Trigger direction: @swipeTrapTriggerArgs?.Direction
+
Trigger diffX: @swipeTrapTriggerArgs?.DiffX
+
Trigger diffY: @swipeTrapTriggerArgs?.DiffY
+
+
"; + private readonly string example1CsharpCode = @" +private bool isTriggeredBasic; +BitSwipeTrapEventArgs? swipeTrapEventArgsBasic; +BitSwipeTrapTriggerArgs? swipeTrapTriggerArgsBasic; +private void HandleOnStartBasic(BitSwipeTrapEventArgs args) +{ + swipeTrapEventArgsBasic = args; +} +private void HandleOnMoveBasic(BitSwipeTrapEventArgs args) +{ + swipeTrapEventArgsBasic = args; +} +private void HandleOnEndBasic(BitSwipeTrapEventArgs args) +{ + swipeTrapEventArgsBasic = args; +} +private void HandleOnTriggerBasic(BitSwipeTrapTriggerArgs args) +{ + isTriggeredBasic = true; + swipeTrapTriggerArgsBasic = args; + _ = Task.Delay(2000).ContinueWith(_ => + { + isTriggeredBasic = false; + swipeTrapEventArgsBasic = null; + swipeTrapTriggerArgsBasic = null; + InvokeAsync(StateHasChanged); + }); +}"; + + private readonly string example2RazorCode = @" + + +
+ +
+ + +
+

Title

+
Item1
+
Item2
+
Item3
+
+
+
+
"; + private readonly string example2CsharpCode = @" +private decimal diffXPanel; +private bool isPanelOpen; +private void OpenPanel() +{ + isPanelOpen = true; +} +private void ClosePanel() +{ + isPanelOpen = false; +} +private void HandleOnMovePanel(BitSwipeTrapEventArgs args) +{ + diffXPanel = args.DiffX; +} +private void HandleOnEndPanel(BitSwipeTrapEventArgs args) +{ + diffXPanel = 0; +} +private void HandleOnTriggerPanel(BitSwipeTrapTriggerArgs args) +{ + if (args.Direction == BitSwipeDirection.Left) + { + diffXPanel = 0; + ClosePanel(); + } +} +private string GetPanelStyle() +{ + return diffXPanel < 0 ? $""transform: translateX({diffXPanel}px)"" : """"; +}"; + + private readonly string example3RazorCode = @" + + +
+ @foreach (int idx in itemsList) + { + var i = idx; +
+
Delete
+ HandleOnMoveList(args, i)"" + OnEnd=""args => HandleOnEndList(args, i)"" + OnTrigger=""args => HandleOnTriggerList(args, i)""> +
+
Item@(i + 1)
+
+
+
+ } +
+Reset +"; + private readonly string example3CsharpCode = @" +private int deletingIndex = -1; +private bool isListDialogOpen; +private TaskCompletionSource listTcs; +private List itemsList = Enumerable.Range(0, 10).ToList(); +private decimal[] diffXList = Enumerable.Repeat(0m, 10).ToArray(); +private void HandleOnMoveList(BitSwipeTrapEventArgs args, int index) +{ + diffXList[index] = args.DiffX; +} +private void HandleOnEndList(BitSwipeTrapEventArgs args, int index) +{ + if (diffXList[index] < 60) + { + diffXList[index] = 0; + } +} +private async Task HandleOnTriggerList(BitSwipeTrapTriggerArgs args, int index) +{ + if (args.Direction == BitSwipeDirection.Right) + { + deletingIndex = index; + listTcs = new(); + isListDialogOpen = true; + await listTcs.Task; + isListDialogOpen = false; + diffXList[index] = 0; + deletingIndex = -1; + } +} +private string GetRowStyle(int index) +{ + var x = Math.Min(diffXList[index], 60); + return x > 0 ? $""transform: translateX({x}px)"" : """"; +} +private void HandleOnOkList() +{ + if (deletingIndex != -1) + { + itemsList.Remove(deletingIndex); + } + listTcs.SetResult(); +} +private void HandleOnCancelList() +{ + listTcs.SetResult(); +} +private void ResetList() +{ + itemsList = Enumerable.Range(0, 10).ToList(); +}"; + + private readonly string example4RazorCode = @" + + +
+
+ +
+ + + + + bit BlazorUI + + + +
+
+ + + + Swipe left or right + + + +
+
+

Left Menu

+
Item1
+
Item2
+
Item3
+
+
+
+
+

Right Menu

+
Item1
+
Item2
+
Item3
+
+
+
+
+
+
+
"; + private readonly string example4CsharpCode = @" +private decimal? diffXPanelAdvanced; +private BitSwipeDirection? direction; +private BitSwipeDirection? panelOpen; +private void OpenPanelAdvanced(BitSwipeDirection swipeDirection) +{ + if (panelOpen == swipeDirection) return; + + direction = null; + panelOpen = swipeDirection; + diffXPanelAdvanced = 0; +} +private void ClosePanelAdvanced() +{ + panelOpen = null; + diffXPanelAdvanced = null; +} +private void HandleOnMovePanelAdvanced(BitSwipeTrapEventArgs args) +{ + diffXPanelAdvanced = args.DiffX; + + if (Math.Abs(args.DiffX) > 2 || Math.Abs(args.DiffY) > 2) + { + direction = Math.Abs(args.DiffX) > Math.Abs(args.DiffY) + ? args.DiffX > 0 ? BitSwipeDirection.Right : BitSwipeDirection.Left + : args.DiffY > 0 ? BitSwipeDirection.Bottom : BitSwipeDirection.Top; + } + else + { + direction = null; + } +} +private void HandleOnEndPanelAdvanced(BitSwipeTrapEventArgs args) +{ + if (panelOpen.HasValue) + { + diffXPanelAdvanced = 0; + } + else + { + diffXPanelAdvanced = null; + } +} +private void HandleOnTriggerPanelAdvanced(BitSwipeTrapTriggerArgs args) +{ + if (args.Direction == BitSwipeDirection.Left) + { + if (panelOpen.HasValue is false || panelOpen == BitSwipeDirection.Right) + { + OpenPanelAdvanced(BitSwipeDirection.Right); + } + else if (panelOpen == BitSwipeDirection.Left) + { + ClosePanelAdvanced(); + } + } + else if (args.Direction == BitSwipeDirection.Right) + { + if (panelOpen.HasValue is false || panelOpen == BitSwipeDirection.Left) + { + OpenPanelAdvanced(BitSwipeDirection.Left); + } + else if (panelOpen == BitSwipeDirection.Right) + { + ClosePanelAdvanced(); + } + } +} +private string GetLeftPanelAdvancedStyle() +{ + if (panelOpen == BitSwipeDirection.Left && direction != BitSwipeDirection.Left) + { + return ""transform: translateX(0px)""; + } + else if((panelOpen.HasValue is false && direction == BitSwipeDirection.Right) || (panelOpen == BitSwipeDirection.Left && direction == BitSwipeDirection.Left)) + { + return diffXPanelAdvanced switch + { + 0 or > 200 => ""transform: translateX(0px)"", + < 0 and < 200 => $""transform: translateX({diffXPanelAdvanced}px)"", + > 0 => $""transform: translateX(calc(-100% + {diffXPanelAdvanced}px))"", + _ => string.Empty + }; + } + + return string.Empty; +} +private string GetRightPanelAdvancedStyle() +{ + if (panelOpen == BitSwipeDirection.Right && direction != BitSwipeDirection.Right) + { + return ""transform: translateX(0px)""; + } + else if ((panelOpen.HasValue is false && direction == BitSwipeDirection.Left) || (panelOpen == BitSwipeDirection.Right && direction == BitSwipeDirection.Right)) + { + return diffXPanelAdvanced switch + { + 0 or < -200 => ""transform: translateX(0px)"", + > 0 => $""transform: translateX({diffXPanelAdvanced}px)"", + < 0 => $""transform: translateX(calc(100% - {(-1 * diffXPanelAdvanced)}px))"", + _ => string.Empty + }; + } + + return string.Empty; +}"; +} + diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/SwipeTrap/BitSwipeTrapDemo.razor.scss b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/SwipeTrap/BitSwipeTrapDemo.razor.scss index 5b3a05aedb..77a79b3945 100644 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/SwipeTrap/BitSwipeTrapDemo.razor.scss +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Utilities/SwipeTrap/BitSwipeTrapDemo.razor.scss @@ -83,5 +83,58 @@ } } +.mobile-frame { + width: 375px; + height: 712px; + overflow: hidden; + position: relative; + border-radius: 36px; + border: 16px solid #333; + box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); + background-color: var(--bit-clr-fg-sec); + + .screen { + width: 100%; + height: 100%; + overflow: auto; + } +} + ::deep { + .panel-adv-container { + cursor: grab; + overflow: hidden; + position: relative; + + .panel-adv { + color: black; + cursor: grab; + inset-block: 0; + user-select: none; + position: absolute; + background-color: lightgray; + + &.left { + left: 0; + width: 200px; + transform: translateX(-100%); + } + + &.right { + right: 0; + width: 200px; + transform: translateX(100%); + } + + .panel-adv-trap { + gap: 1rem; + height: 100%; + display: flex; + padding-top: 0.2rem; + padding-left: 0.8rem; + flex-direction: column; + background-color: gray; + } + } + } } diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj index bbfbad2c22..a78bc9e22f 100644 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj @@ -85,12 +85,12 @@
- + all runtime; build; native; contentfiles; analyzers; buildtransitive - + all runtime; build; native; contentfiles; analyzers; buildtransitive diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/Bit.BlazorUI.Demo.Client.Web.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/Bit.BlazorUI.Demo.Client.Web.csproj index c24a58d9d8..fa833eaa74 100644 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/Bit.BlazorUI.Demo.Client.Web.csproj +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/Bit.BlazorUI.Demo.Client.Web.csproj @@ -24,13 +24,13 @@ - + - + all runtime; build; native; contentfiles; analyzers; buildtransitive - + all runtime; build; native; contentfiles; analyzers; buildtransitive diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/service-worker.published.js b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/service-worker.published.js index a71df9e01d..cbf2648732 100644 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/service-worker.published.js +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/service-worker.published.js @@ -1,4 +1,4 @@ -// bit version: 9.1.1 +// bit version: 9.1.2 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup self.assetsInclude = []; diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj index c6cec5e7bb..bb00b11acf 100644 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj @@ -29,11 +29,11 @@ - + all runtime; build; native; contentfiles; analyzers; buildtransitive - + all runtime; build; native; contentfiles; analyzers; buildtransitive diff --git a/src/BlazorUI/Demo/Directory.Build.props b/src/BlazorUI/Demo/Directory.Build.props index 48713529b8..3cb6a10806 100644 --- a/src/BlazorUI/Demo/Directory.Build.props +++ b/src/BlazorUI/Demo/Directory.Build.props @@ -1,4 +1,4 @@ - + 13.0 diff --git a/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.js b/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.js index e4cd143d5d..f947871964 100644 --- a/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.js +++ b/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.js @@ -1,4 +1,4 @@ -// bit version: 9.1.1 +// bit version: 9.1.2 self.assetsExclude = [/\.scp\.css$/, /weather\.json$/]; self.caseInsensitiveUrl = true; diff --git a/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.published.js b/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.published.js index 0e948d764d..0a69c38c32 100644 --- a/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.published.js +++ b/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.published.js @@ -1,4 +1,4 @@ -// bit version: 9.1.1 +// bit version: 9.1.2 self.assetsExclude = [/\.scp\.css$/, /weather\.json$/]; self.caseInsensitiveUrl = true; diff --git a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.js b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.js index 2ecbf8c7ba..b21dcb871a 100644 --- a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.js +++ b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.js @@ -1,4 +1,4 @@ -// bit version: 9.1.1 +// bit version: 9.1.2 // In development, always fetch from the network and do not enable offline support. // This is because caching would make development more difficult (changes would not diff --git a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.published.js b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.published.js index 17c28f1961..093c23c631 100644 --- a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.published.js +++ b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.published.js @@ -1,4 +1,4 @@ -// bit version: 9.1.1 +// bit version: 9.1.2 self.assetsInclude = []; self.assetsExclude = [ diff --git a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.progress.ts b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.progress.ts index e983cbed8d..8e31f78a6c 100644 --- a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.progress.ts +++ b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.progress.ts @@ -1,4 +1,4 @@ -window['bit-bswup.progress version'] = '9.1.1'; +window['bit-bswup.progress version'] = '9.1.2'; ; (function () { (window as any).startBswupProgress = (autoReload: boolean, diff --git a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts index a0f9828c02..c35e3e61bb 100644 --- a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts +++ b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts @@ -1,4 +1,4 @@ -self['bit-bswup.sw version'] = '9.1.1'; +self['bit-bswup.sw version'] = '9.1.2'; interface Window { clients: any diff --git a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts index fff156bdf3..cc7cc54e27 100644 --- a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts +++ b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts @@ -1,5 +1,5 @@ const BitBswup = {} as any; -BitBswup.version = window['bit-bswup version'] = '9.1.1'; +BitBswup.version = window['bit-bswup version'] = '9.1.2'; declare const Blazor: any; diff --git a/src/Bswup/FullDemo/Client/wwwroot/service-worker.js b/src/Bswup/FullDemo/Client/wwwroot/service-worker.js index 79553ecfce..859ed8e409 100644 --- a/src/Bswup/FullDemo/Client/wwwroot/service-worker.js +++ b/src/Bswup/FullDemo/Client/wwwroot/service-worker.js @@ -1,4 +1,4 @@ -// bit version: 9.1.1 +// bit version: 9.1.2 // In development, always fetch from the network and do not enable offline support. // This is because caching would make development more difficult (changes would not diff --git a/src/Bswup/FullDemo/Client/wwwroot/service-worker.published.js b/src/Bswup/FullDemo/Client/wwwroot/service-worker.published.js index b6a3ad822b..582cb9d837 100644 --- a/src/Bswup/FullDemo/Client/wwwroot/service-worker.published.js +++ b/src/Bswup/FullDemo/Client/wwwroot/service-worker.published.js @@ -1,4 +1,4 @@ -// bit version: 9.1.1 +// bit version: 9.1.2 self.assetsInclude = []; self.assetsExclude = [/\.scp\.css$/, /weather\.json$/]; diff --git a/src/Bup/Bit.Bup/Scripts/bit-bup.progress.ts b/src/Bup/Bit.Bup/Scripts/bit-bup.progress.ts index e4a1a00937..2a3046e8c1 100644 --- a/src/Bup/Bit.Bup/Scripts/bit-bup.progress.ts +++ b/src/Bup/Bit.Bup/Scripts/bit-bup.progress.ts @@ -1,4 +1,4 @@ -window['bit-bup.progress version'] = '9.1.1'; +window['bit-bup.progress version'] = '9.1.2'; ; (function () { (window as any).startBupProgress = (showLogs: boolean, showAssets: boolean, appContainerSelector: string, hideApp: boolean, autoHide: boolean) => { diff --git a/src/Bup/Bit.Bup/Scripts/bit-bup.ts b/src/Bup/Bit.Bup/Scripts/bit-bup.ts index 7e7f345e31..784cd1ce6c 100644 --- a/src/Bup/Bit.Bup/Scripts/bit-bup.ts +++ b/src/Bup/Bit.Bup/Scripts/bit-bup.ts @@ -1,5 +1,5 @@ var BitBup = BitBup || {}; -BitBup.version = window['bit-bup version'] = '9.1.1'; +BitBup.version = window['bit-bup version'] = '9.1.2'; declare const Blazor: any; diff --git a/src/Butil/Bit.Butil/Scripts/butil.ts b/src/Butil/Bit.Butil/Scripts/butil.ts index 6155d41e06..91f0c54d26 100644 --- a/src/Butil/Bit.Butil/Scripts/butil.ts +++ b/src/Butil/Bit.Butil/Scripts/butil.ts @@ -1,2 +1,2 @@ var BitButil = BitButil || {}; -BitButil.version = window['bit-butil version'] = '9.1.1'; \ No newline at end of file +BitButil.version = window['bit-butil version'] = '9.1.2'; \ No newline at end of file diff --git a/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty.Client/BlazorEmpty.Client.csproj b/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty.Client/BlazorEmpty.Client.csproj index 40a7ff0f34..61a4b13249 100644 --- a/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty.Client/BlazorEmpty.Client.csproj +++ b/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty.Client/BlazorEmpty.Client.csproj @@ -1,4 +1,4 @@ - + @@ -17,14 +17,14 @@ - + - + all runtime; build; native; contentfiles; analyzers; buildtransitive - + all runtime; build; native; contentfiles; analyzers; buildtransitive diff --git a/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty/BlazorEmpty.csproj b/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty/BlazorEmpty.csproj index 3fe47d656f..cb4b6d36aa 100644 --- a/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty/BlazorEmpty.csproj +++ b/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty/BlazorEmpty.csproj @@ -1,4 +1,4 @@ - + @@ -19,14 +19,14 @@ - + - + all runtime; build; native; contentfiles; analyzers; buildtransitive - + all runtime; build; native; contentfiles; analyzers; buildtransitive diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.template.config/template.json b/src/Templates/Boilerplate/Bit.Boilerplate/.template.config/template.json index aa7e5eebd8..32f395e039 100644 --- a/src/Templates/Boilerplate/Bit.Boilerplate/.template.config/template.json +++ b/src/Templates/Boilerplate/Bit.Boilerplate/.template.config/template.json @@ -345,7 +345,7 @@ "path": "README.md" }, { - "path": "Boilerplate.Web.slnf" + "path": "Boilerplate.sln" } ], "sources": [ diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/AppComponentBase.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/AppComponentBase.cs index 0ac667ca98..d98e8501aa 100644 --- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/AppComponentBase.cs +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/AppComponentBase.cs @@ -260,6 +260,6 @@ private void HandleException(Exception exp, } parameters["ComponentType"] = GetType().FullName; - ExceptionHandler.Handle(exp, nonInterrupting: false, parameters, lineNumber, memberName, filePath); + ExceptionHandler.Handle(exp, displayKind: ExceptionDisplayKind.Interrupting, parameters, lineNumber, memberName, filePath); } } diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/ClientAppCoordinator.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/ClientAppCoordinator.cs index 942bedaa81..a77bd51200 100644 --- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/ClientAppCoordinator.cs +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/ClientAppCoordinator.cs @@ -180,10 +180,10 @@ private void SubscribeToSignalREventsMessages() // You can also leverage IPubSubService to notify other components in the application. })); - signalROnDisposables.Add(hubConnection.On(SignalREvents.PUBLISH_MESSAGE, async (message) => + signalROnDisposables.Add(hubConnection.On(SignalREvents.PUBLISH_MESSAGE, async (message, payload) => { logger.LogInformation("SignalR Message {Message} received from server to publish.", message); - PubSubService.Publish(message); + PubSubService.Publish(message, payload); })); hubConnection.Closed += HubConnectionStateChange; diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/AuthorizedHeader.razor.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/AuthorizedHeader.razor.cs index f54775c3c9..94bf8cb273 100644 --- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/AuthorizedHeader.razor.cs +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/AuthorizedHeader.razor.cs @@ -11,7 +11,7 @@ protected override async Task OnInitAsync() { unsubscribePageTitleChanged = PubSubService.Subscribe(ClientPubSubMessages.PAGE_TITLE_CHANGED, async payload => { - (pageTitle, pageSubtitle) = (ValueTuple)payload!; + (pageTitle, pageSubtitle) = ((string, string))payload!; StateHasChanged(); }); diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/SnackBar.razor.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/SnackBar.razor.cs index 60609cacfd..dab8f6fdf9 100644 --- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/SnackBar.razor.cs +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/SnackBar.razor.cs @@ -10,7 +10,7 @@ protected override Task OnInitAsync() { unsubscribe = PubSubService.Subscribe(ClientPubSubMessages.SHOW_SNACK, async args => { - var (title, body, color) = (ValueTuple)args!; + var (title, body, color) = ((string, string, BitColor))args!; await snackbarRef.Show(title, body, color); }); diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/UserMenu.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/UserMenu.razor index d6c56d0648..75c0aacf01 100644 --- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/UserMenu.razor +++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/UserMenu.razor @@ -1,8 +1,4 @@ -@inherits AppComponentBase - -@{ - var imageUrl = user.ProfileImageName is null ? null : $"{profileImageUrl}&file={user.ProfileImageName}"; -} +@inherits AppComponentBase