[dev-v5] MessageBar (WIP!!)

[vnbaaij]

Just storing it here to not loose anything. NOT DONE YET!

[MarvinKlein1508]

@vnbaaij since you are working on this component I would like to mention one behaviour from v4 which really annoys my. By default all MessageBoxes are using fade animations. But for the most part I use them as warning or information boxes which will be initiated on page load. I know I can change this behaviour by setting FadeIn to false but this needs to be done for every component I place in my project. I would like to have some way to change the default behaviour for this if possible.

Maybe also for AllowDismiss

Maybe you can consider it for v5 :)

[vnbaaij]

@vnbaaij since you are working on this component I would like to mention one behaviour from v4 which really annoys my. By default all MessageBoxes are using fade animations. But for the most part I use them as warning or information boxes which will be initiated on page load. I know I can change this behaviour by setting FadeIn to false but this needs to be done for every component I place in my project. I would like to have some way to change the default behaviour for this if possible.

Maybe also for AllowDismiss

Maybe you can consider it for v5 :)

Yes, want have these available on a provider level, I think.

But don't expect any new code/progress for the next 7 days. Enjoying some time off without access to an IDE 😉

[MarvinKlein1508]

@vnbaaij sure, no problem! :) I just thought I might take the chance to mention this. This kind of functionality would be nice for other components as well. Perhaps there is some room for future ideas.

I'm thinking about FluentStack for example where I always change the direction.

But first enjoy your days off! :)

[vnbaaij]

@vnbaaij sure, no problem! :) I just thought I might take the chance to mention this. This kind of functionality would be nice for other components as well. Perhaps there is some room for future ideas.

Definitely! But in the short term probably only for our own 'native' Blazor components. For the web components our influence is more limited.

I'm thinking about FluentStack for example where I always change the direction.

We must choose either orientation as a default. What is your idea to solve your issue? Create something like a FluentVerticalStack perhaps?

But first enjoy your days off! :)

Already enjoying it. I'm answering this poolside from a sunbed, so... 😁

[dvoituron]

I'm thinking about FluentStack for example where I always change the direction.

What do you mean? By default, the FluentStack has an Orientation=Horizontal because the default HTML orientation is vertical.

In summary:

• Need a Horizontal orientation => FluentStack
• Need a Vertical orientation => div

So. Why do you want to be able to change the default Orientation?

[MarvinKlein1508]

So. Why do you want to be able to change the default Orientation?

Because I use the FluentStack to have equal spacing between each item. Since the component allows you to change orientation, why not use it? :)

I kinda use it like the Bootstrap col system.

[dvoituron]

Because I use the FluentStack to have equal spacing between each item. Since the component allows you to change orientation, why not use it? :)

Yes you can use it, and I also use it. But in this case, I set Orientation="Vertical" and all is fine :-)

[github-actions[bot]]

Unit Tests

• ❌[FAILED] Microsoft.FluentUI.AspNetCore.Components.Tests.Components.Base.ComponentBaseTests.ComponentBase_DefaultProperties(blazor: "Id='id='My-Specific-ID'", html: "id='My-Specific-ID'")
• ❌[FAILED] Microsoft.FluentUI.AspNetCore.Components.Tests.Components.Base.ComponentBaseTests.ComponentBase_DefaultProperties(blazor: "Padding='my-padding'", html: "class='my-padding'")
• ❌[FAILED] Microsoft.FluentUI.AspNetCore.Components.Tests.Components.Base.ComponentBaseTests.ComponentBase_DefaultProperties(blazor: "extra-attribute='My-Specific-Attribute'", html: "extra-attribute='My-Specific-Attribute'")
• ❌[FAILED] Microsoft.FluentUI.AspNetCore.Components.Tests.Components.Base.ComponentBaseTests.ComponentBase_DefaultProperties(blazor: "Style='My-Specific-Style'", html: "style='My-Specific-Style'")
• ❌[FAILED] Microsoft.FluentUI.AspNetCore.Components.Tests.Components.Base.ComponentBaseTests.ComponentBase_DefaultProperties(blazor: "Class='My-Specific-Item'", html: "class='My-Specific-Item'")
• ❌[FAILED] Microsoft.FluentUI.AspNetCore.Components.Tests.Components.Base.ComponentBaseTests.ComponentBase_DefaultProperties(blazor: "Padding='10px'", html: "style='padding: 10px;*'")
• ❌[FAILED] Microsoft.FluentUI.AspNetCore.Components.Tests.Components.Base.ComponentBaseTests.ComponentBase_DefaultProperties(blazor: "Margin='my-margin'", html: "class='my-margin'")
• ❌[FAILED] Microsoft.FluentUI.AspNetCore.Components.Tests.Components.Base.ComponentBaseTests.ComponentBase_DefaultProperties(blazor: "Margin='10px'", html: "style='margin: 10px;*'")

Details on your Workflow / Core Tests page.