From 5ed96d3c3c00cda7b04363f12ca526944551cf9d Mon Sep 17 00:00:00 2001 From: Mohammad Hosein Rastegarinia Date: Sun, 14 Jul 2024 20:10:50 +0330 Subject: [PATCH] Remove BitSpinner component #8006 --- .../Progress/Spinner/BitSpinnerTests.cs | 61 ------- .../Progress/Spinner/BitSpinner.razor | 23 --- .../Progress/Spinner/BitSpinner.razor.cs | 62 -------- .../Progress/Spinner/BitSpinner.scss | 80 ---------- .../Progress/Spinner/BitSpinnerAriaLive.cs | 8 - .../Bit.BlazorUI/Styles/components.scss | 1 - .../Progress/Spinner/BitSpinnerDemo.razor | 63 -------- .../Progress/Spinner/BitSpinnerDemo.razor.cs | 149 ------------------ .../Spinner/BitSpinnerDemo.razor.scss | 67 -------- .../compilerconfig.json | 6 - 10 files changed, 520 deletions(-) delete mode 100644 src/BlazorUI/Bit.BlazorUI.Tests/Components/Progress/Spinner/BitSpinnerTests.cs delete mode 100644 src/BlazorUI/Bit.BlazorUI/Components/Progress/Spinner/BitSpinner.razor delete mode 100644 src/BlazorUI/Bit.BlazorUI/Components/Progress/Spinner/BitSpinner.razor.cs delete mode 100644 src/BlazorUI/Bit.BlazorUI/Components/Progress/Spinner/BitSpinner.scss delete mode 100644 src/BlazorUI/Bit.BlazorUI/Components/Progress/Spinner/BitSpinnerAriaLive.cs delete mode 100644 src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Progress/Spinner/BitSpinnerDemo.razor delete mode 100644 src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Progress/Spinner/BitSpinnerDemo.razor.cs delete mode 100644 src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Progress/Spinner/BitSpinnerDemo.razor.scss diff --git a/src/BlazorUI/Bit.BlazorUI.Tests/Components/Progress/Spinner/BitSpinnerTests.cs b/src/BlazorUI/Bit.BlazorUI.Tests/Components/Progress/Spinner/BitSpinnerTests.cs deleted file mode 100644 index cabfea57ff..0000000000 --- a/src/BlazorUI/Bit.BlazorUI.Tests/Components/Progress/Spinner/BitSpinnerTests.cs +++ /dev/null @@ -1,61 +0,0 @@ -using System; -using Microsoft.VisualStudio.TestTools.UnitTesting; -using Bunit; - -namespace Bit.BlazorUI.Tests.Components.Progress.Spinner; - -[TestClass] -public class BitSpinnerTests : BunitTestContext -{ - [DataTestMethod, - DataRow(BitSize.Large), - DataRow(BitSize.Medium), - DataRow(BitSize.Small), - ] - public void BitSpinnerShouldRespectSize(BitSize size) - { - var component = RenderComponent(parameters => - { - parameters.Add(p => p.Size, size); - }); - - var sizeClass = size switch - { - BitSize.Small => "bit-spn-sm", - BitSize.Medium => "bit-spn-md", - BitSize.Large => "bit-spn-lg", - _ => throw new NotSupportedException() - }; - - var bitSpinner = component.Find(".bit-spn"); - - Assert.IsTrue(bitSpinner.ClassList.Contains(sizeClass)); - } - - [DataTestMethod, - DataRow(BitLabelPosition.Top), - DataRow(BitLabelPosition.Bottom), - DataRow(BitLabelPosition.End), - DataRow(BitLabelPosition.Start) - ] - public void BitSpinnerShouldRespectPosition(BitLabelPosition position) - { - var component = RenderComponent(parameters => - { - parameters.Add(p => p.LabelPosition, position); - }); - - var positionClass = position switch - { - BitLabelPosition.Top => "bit-spn-top", - BitLabelPosition.End => "bit-spn-end", - BitLabelPosition.Start => "bit-spn-srt", - BitLabelPosition.Bottom => "bit-spn-btm", - _ => throw new NotSupportedException() - }; - - var bitSpinner = component.Find(".bit-spn"); - - Assert.IsTrue(bitSpinner.ClassList.Contains(positionClass)); - } -} diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Progress/Spinner/BitSpinner.razor b/src/BlazorUI/Bit.BlazorUI/Components/Progress/Spinner/BitSpinner.razor deleted file mode 100644 index 3759148ef5..0000000000 --- a/src/BlazorUI/Bit.BlazorUI/Components/Progress/Spinner/BitSpinner.razor +++ /dev/null @@ -1,23 +0,0 @@ -@namespace Bit.BlazorUI -@inherits BitComponentBase - -
- -
- - @if (Label.HasValue()) - { -
@Label
- } - - @if (AriaLabel.HasValue()) - { -
-
@AriaLabel
-
- } -
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Progress/Spinner/BitSpinner.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Progress/Spinner/BitSpinner.razor.cs deleted file mode 100644 index 4a71c013ee..0000000000 --- a/src/BlazorUI/Bit.BlazorUI/Components/Progress/Spinner/BitSpinner.razor.cs +++ /dev/null @@ -1,62 +0,0 @@ -namespace Bit.BlazorUI; - -public partial class BitSpinner : BitComponentBase -{ - private BitSize? size; - - - - /// - /// Politeness setting for label update announcement. - /// - [Parameter] public BitSpinnerAriaLive AriaLive { get; set; } = BitSpinnerAriaLive.Polite; - - /// - /// The position of the label in regards to the spinner animation - /// - [Parameter] public BitLabelPosition LabelPosition { get; set; } - - /// - /// The size of spinner to render - /// - [Parameter] - public BitSize? Size - { - get => size; - set - { - if (size == value) return; - - size = value; - - ClassBuilder.Reset(); - } - } - - /// - /// The label to show next to the spinner. Label updates will be announced to the screen readers - /// - [Parameter] public string? Label { get; set; } - - protected override string RootElementClass => "bit-spn"; - - protected override void RegisterCssClasses() - { - ClassBuilder.Register(() => Size switch - { - BitSize.Small => "bit-spn-sm", - BitSize.Medium => "bit-spn-md", - BitSize.Large => "bit-spn-lg", - _ => string.Empty - }); - - ClassBuilder.Register(() => LabelPosition switch - { - BitLabelPosition.Top => "bit-spn-top", - BitLabelPosition.Start => "bit-spn-srt", - BitLabelPosition.End => "bit-spn-end", - BitLabelPosition.Bottom => "bit-spn-btm", - _ => string.Empty - }); - } -} diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Progress/Spinner/BitSpinner.scss b/src/BlazorUI/Bit.BlazorUI/Components/Progress/Spinner/BitSpinner.scss deleted file mode 100644 index 215f9246e8..0000000000 --- a/src/BlazorUI/Bit.BlazorUI/Components/Progress/Spinner/BitSpinner.scss +++ /dev/null @@ -1,80 +0,0 @@ -@import "../../../Styles/functions.scss"; - -.bit-spn { - display: flex; - gap: spacing(1); - justify-content: center; - - @keyframes bit-spn-animation { - 0% { - transform: rotate(0deg); - } - - 100% { - transform: rotate(360deg); - } - } -} - -.bit-spn-snr { - border-radius: 50%; - width: spacing(2.5); - height: spacing(2.5); - border-width: spacing(0.1875); - border-style: $shp-border-style; - border-color: $clr-brd-sec; - border-top-color: $clr-pri; - animation: bit-spn-animation 1.3s linear infinite; - animation-timing-function: cubic-bezier(0.53, 0.21, 0.29, 0.67); -} - -.bit-spn-lbl { - text-align: center; - font-size: spacing(1.5); - color: $clr-pri; - margin: spacing(0.25) spacing(1); -} - -.bit-spn-alb { - border: 0; - padding: 0; - overflow: hidden; - position: absolute; - width: spacing(0.125); - height: spacing(0.125); - margin: spacing(-0.125); -} - -.bit-spn-sm { - .bit-spn-snr { - width: spacing(1.5); - height: spacing(1.5); - } -} - -.bit-spn-lg { - .bit-spn-snr { - width: spacing(3.5); - height: spacing(3.5); - } -} - -.bit-spn-top { - align-items: center; - flex-direction: column-reverse; -} - -.bit-spn-srt { - align-items: center; - flex-direction: row-reverse; -} - -.bit-spn-end { - align-items: center; - flex-direction: row; -} - -.bit-spn-btm { - align-items: center; - flex-direction: column; -} diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Progress/Spinner/BitSpinnerAriaLive.cs b/src/BlazorUI/Bit.BlazorUI/Components/Progress/Spinner/BitSpinnerAriaLive.cs deleted file mode 100644 index 25ce503086..0000000000 --- a/src/BlazorUI/Bit.BlazorUI/Components/Progress/Spinner/BitSpinnerAriaLive.cs +++ /dev/null @@ -1,8 +0,0 @@ -namespace Bit.BlazorUI; - -public enum BitSpinnerAriaLive -{ - Assertive, - Polite, - Off -} diff --git a/src/BlazorUI/Bit.BlazorUI/Styles/components.scss b/src/BlazorUI/Bit.BlazorUI/Styles/components.scss index 43d58d8dd7..4c6ba272db 100644 --- a/src/BlazorUI/Bit.BlazorUI/Styles/components.scss +++ b/src/BlazorUI/Bit.BlazorUI/Styles/components.scss @@ -48,7 +48,6 @@ @import "../Components/Progress/ProgressBar/BitProgressBar.scss"; @import "../Components/Progress/Shimmer/BitShimmer.scss"; -@import "../Components/Progress/Spinner/BitSpinner.scss"; @import "../Components/Surfaces/Accordion/BitAccordion.scss"; @import "../Components/Surfaces/Dialog/BitDialog.scss"; diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Progress/Spinner/BitSpinnerDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Progress/Spinner/BitSpinnerDemo.razor deleted file mode 100644 index e0cdb28b0f..0000000000 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Progress/Spinner/BitSpinnerDemo.razor +++ /dev/null @@ -1,63 +0,0 @@ -@page "/components/spinner" - - - - - - -
To create a spinner, you can use a BitSpinner component.
- - - - - - -
By setting LabelPosition attribute, change position of spinner to bottom, top, start or end.
- - - - diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Progress/Spinner/BitSpinnerDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Progress/Spinner/BitSpinnerDemo.razor.cs deleted file mode 100644 index 6cc8cec972..0000000000 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Progress/Spinner/BitSpinnerDemo.razor.cs +++ /dev/null @@ -1,149 +0,0 @@ -namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Progress.Spinner; - -public partial class BitSpinnerDemo -{ - private readonly List componentParameters = - [ - new() - { - Name = "AriaLive", - Type = "BitSpinnerAriaLive", - LinkType = LinkType.Link, - Href= "#spinnerAriaLive-enum", - DefaultValue = "BitSpinnerAriaLive.Polite", - Description = "Politeness setting for label update announcement.", - }, - new() - { - Name = "Label", - Type = "string?", - DefaultValue = "null", - Description = "The label to show next to the spinner. Label updates will be announced to the screen readers.", - }, - new() - { - Name = "LabelPosition", - Type = "BitLabelPosition", - LinkType = LinkType.Link, - Href = "#spinner-labelPosition-enum", - DefaultValue = "BitLabelPosition.Top", - Description = "The position of the label in regards to the spinner animation.", - }, - new() - { - Name = "Size", - Type = "BitSize?", - DefaultValue = "null", - Description = "The size of spinner to render.", - LinkType = LinkType.Link, - Href = "#spinnerSize-enum", - } - ]; - - private readonly List componentSubEnums = - [ - new() - { - Id = "spinnerAriaLive-enum", - Name = "BitSpinnerAriaLive", - Description = "", - Items = - [ - new() - { - Name= "Assertive", - Description="", - Value="0", - }, - new() - { - Name= "Polite", - Description="", - Value="1", - }, - new() - { - Name= "Off", - Description="", - Value="2", - }, - ], - }, - new() - { - Id = "spinner-labelPosition-enum", - Name = "BitLabelPosition", - Description = "", - Items = - [ - new() - { - Name= "Top", - Description="The label shows on the top of the spinner.", - Value="0", - }, - new() - { - Name= "End", - Description="The label shows on the end of the spinner.", - Value="1", - }, - new() - { - Name= "Bottom", - Description="The label shows on the bottom of the spinner.", - Value="2", - }, - new() - { - Name= "Start", - Description="The label shows on the start of the spinner.", - Value="3", - }, - ] - }, - new() - { - Id = "spinnerSize-enum", - Name = "BitSize", - Description = "", - Items = - [ - new() - { - Name= "Small", - Description="12px Spinner diameter.", - Value="0", - }, - new() - { - Name= "Medium", - Description="20px Spinner diameter.", - Value="1", - }, - new() - { - Name= "Large", - Description="28px Spinner diameter.", - Value="2", - }, - ], - } - ]; - - - - private readonly string example1RazorCode = @" - - -"; - - private readonly string example2RazorCode = @" - - - - - - -"; -} diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Progress/Spinner/BitSpinnerDemo.razor.scss b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Progress/Spinner/BitSpinnerDemo.razor.scss deleted file mode 100644 index aa81107726..0000000000 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Progress/Spinner/BitSpinnerDemo.razor.scss +++ /dev/null @@ -1,67 +0,0 @@ -@import '../../../../Styles/abstracts/_functions.scss'; - -.m-b-15 { - margin-bottom: rem2(15px); -} - -.spinner-container, -.spinner-positioning { - label { - padding: rem2(16px) 0; - font-size: rem2(16px); - } -} - -.spinner-container { - label { - margin-right: rem2(20px); - } - - > div { - display: flex; - flex-direction: row; - align-items: center; - - > div { - margin-left: rem2(20px); - } - } -} - -.spinner-positioning { - display: flex; - flex-direction: column; - align-items: flex-start; - - > div { - display: flex; - flex-direction: column; - align-items: center; - - &:not(:first-child) { - margin-top: rem2(20px); - } - } -} - -::deep .spinner-container, -::deep .spinner-positioning { - & > div { - & label { - font-family: "Segoe UI", "Segoe UI Web (West European)", "Segoe UI", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", sans-serif; - -webkit-font-smoothing: antialiased; - font-size: 14px; - font-weight: 600; - color: rgb(50, 49, 48); - box-sizing: border-box; - box-shadow: none; - display: block; - padding: 5px 0px; - overflow-wrap: break-word; - } - } -} - -::deep .bit-spn-fluent { - margin-top: rem2(10px); -} \ No newline at end of file diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/compilerconfig.json b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/compilerconfig.json index 2145e373fa..42bee836e5 100644 --- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/compilerconfig.json +++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/compilerconfig.json @@ -299,12 +299,6 @@ "minify": { "enabled": false }, "options": { "sourceMap": false } }, - { - "outputFile": "Pages/Components/Progress/Spinner/BitSpinnerDemo.razor.css", - "inputFile": "Pages/Components/Progress/Spinner/BitSpinnerDemo.razor.scss", - "minify": { "enabled": false }, - "options": { "sourceMap": false } - }, { "outputFile": "Pages/Components/Surfaces/Accordion/BitAccordionDemo.razor.css", "inputFile": "Pages/Components/Surfaces/Accordion/BitAccordionDemo.razor.scss",