Skip to content

feat(newspack-components): add divider component#4462

Merged
dkoo merged 4 commits intotrunkfrom
add/separator-component
Feb 7, 2026
Merged

feat(newspack-components): add divider component#4462
dkoo merged 4 commits intotrunkfrom
add/separator-component

Conversation

@thomasguillot
Copy link
Contributor

@thomasguillot thomasguillot commented Feb 6, 2026

All Submissions:

Changes proposed in this Pull Request:

This PR adds a new component: Divider. I added a readme to explain how to use this in the future.

How to test the changes in this Pull Request:

  1. Switch to this branch
  2. Check if Dashboard still works
  3. Check Components Demo.

Other information:

  • Have you added an explanation of what your changes do and why you'd like us to include them?
  • Have you written new tests for your changes, as applicable?
  • Have you successfully ran tests with your changes locally?

@thomasguillot thomasguillot requested a review from a team as a code owner February 6, 2026 16:57
@thomasguillot thomasguillot added the [Status] Needs Review The issue or pull request needs to be reviewed label Feb 6, 2026
@thomasguillot thomasguillot force-pushed the add/separator-component branch from 18bbc95 to f4e5e5f Compare February 6, 2026 17:10
Copy link
Contributor

@dkoo dkoo left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The 100vw width doesn't work when it's used inside a container-type element:

Image

We could add an exception for when it's inside a newspack-card element with borders, but I'm not sure that would catch all instances like this. IMO full-width shouldn't be the default alignment.

Also, React recommends using function-style components over class-style components, so I refactored this to a function-style component in 37f3897.

@github-actions github-actions bot added the [Status] Needs Changes or Feedback The issue or pull request needs action from the original creator label Feb 6, 2026
@thomasguillot
Copy link
Contributor Author

@dkoo PR updated with better defaults 98932a8

@thomasguillot thomasguillot requested a review from dkoo February 6, 2026 20:07
@thomasguillot thomasguillot removed the [Status] Needs Changes or Feedback The issue or pull request needs action from the original creator label Feb 6, 2026
@thomasguillot thomasguillot changed the title feat: add separator component feat(newspack-components): add divider component Feb 6, 2026
@thomasguillot thomasguillot force-pushed the add/separator-component branch from d141731 to c58758a Compare February 6, 2026 20:23
@dkoo dkoo merged commit f080d72 into trunk Feb 7, 2026
9 checks passed
@github-actions github-actions bot added [Status] Approved The pull request has been reviewed and is ready to merge and removed [Status] Needs Review The issue or pull request needs to be reviewed labels Feb 7, 2026
@dkoo dkoo deleted the add/separator-component branch February 7, 2026 00:33
@github-actions
Copy link

github-actions bot commented Feb 7, 2026

Hey @thomasguillot, good job getting this PR merged! 🎉

Now, the needs-changelog label has been added to it.

Please check if this PR needs to be included in the "Upcoming Changes" and "Release Notes" doc. If it doesn't, simply remove the label.

If it does, please add an entry to our shared document, with screenshots and testing instructions if applicable, then remove the label.

Thank you! ❤️

miguelpeixe pushed a commit that referenced this pull request Feb 9, 2026
* feat: add separator component

* refactor: use function-type component syntax

* feat(separator): update defaults

* feat(separator): rename component

---------

Co-authored-by: dkoo <derrick.koo@automattic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

[Status] Approved The pull request has been reviewed and is ready to merge

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants