Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[dev-v5] Add FluentDivider component #3365

Merged
merged 5 commits into from
Feb 15, 2025

Conversation

AClerbois
Copy link
Contributor

@AClerbois AClerbois commented Feb 14, 2025

Add FluentDivider component

The FluentDivider component is used to separate content within a container.

Horizontally

{1651DE57-82DB-4F26-AB65-AEEB9FF87992}

Vertically

{A0190758-CCEB-456F-9356-B95088199646}

Documentation

  • AlignContent Gets or sets the alignment of the content.
  • Appearance Gets or sets the appearance of the content.
  • ChildContent Gets or sets the content to be shown.
  • Inset Adds padding to the beginning and end of the divider.
  • Vertical A divider can be horizontal (default) or vertical.

Unit Tests

{415DBAF9-31E5-4F6F-A47D-C08F49C9D169}

- Removed trailing comma in ButtonAppearance enum in ButtonAppearance.cs
- Added HTML files as None items in Components.Tests.csproj for FluentDividerTests
- Added FluentDivider.md with metadata, examples, and API reference
- Added FluentDivider.razor defining the structure and attributes of the FluentDivider component
- Added FluentDivider.razor.cs partial class with properties and logic for FluentDivider
- Added DividerAlignContent enum in DividerAlignContent.cs for content alignment
- Added DividerAppearance enum in DividerAppearance.cs for appearance styles
- Added FluentDividerTests.FluentDivider_Default.verified.razor.html with a simple fluent-divider element
- Added FluentDividerTests.razor with Xunit test cases for FluentDivider component
Updated FluentDividerExamples.razor to include a new FluentStack component with child components for setting FluentDivider properties interactively. Corrected attribute name in FluentDivider.razor to align-content. Added [Parameter] attributes in FluentDivider.razor.cs for bindable properties. Updated FluentDivider.md with usage details. Added new unit tests in FluentDividerTests.razor for various attributes.
Revised FluentStack orientation to horizontal with margin-bottom.
Reordered FluentTextInput, FluentSelect, and FluentCheckbox
components within the stack for better structure. Moved
FluentDivider outside of FluentStack to the end for improved
visual layout.
Updated the `DividerAppearance` enum description for `Default` value in `DividerAppearance.cs`. Modified `FluentDivider_AlignContent` and `FluentDivider_DividerAppearance` test methods in `FluentDividerTests.razor` to accept nullable values. Added test cases for `null` and invalid enum values (`999`), expecting an empty string as the result.
@AClerbois AClerbois requested a review from dvoituron February 14, 2025 15:02
@dvoituron dvoituron marked this pull request as ready for review February 14, 2025 15:38
@dvoituron dvoituron requested a review from vnbaaij as a code owner February 14, 2025 15:38
@dvoituron dvoituron enabled auto-merge (squash) February 15, 2025 18:58
@dvoituron dvoituron merged commit d21904b into microsoft:dev-v5 Feb 15, 2025
3 checks passed
@AClerbois AClerbois deleted the users/aclerbois/dev-v5/divider branch February 18, 2025 15:38
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants