feat: add `Button` component by umairraza96 · Pull Request #5783 · nodejs/nodejs.org

umairraza96 · 2023-09-11T12:11:12Z

Description

Add new dependency for storybook for pseudo states

Write stories for 24 button states

Validation

Related Issues

Addresses #5758

Check List

I have read the Contributing Guidelines and made commit messages that follow the guideline.
I have run npx turbo lint to ensure the code follows the style guide. And run npx turbo lint:fix to fix the style errors if necessary.
I have run npx turbo format to ensure the code follows the style guide.
I have run npx turbo test to check if all tests are passing.
I've covered new added functionality with unit tests if necessary.

vercel · 2023-09-11T12:11:15Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
nodejs-org	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Sep 28, 2023 2:33pm

github-actions · 2023-09-11T13:17:08Z

Unit Test Coverage Report

Lines	Statements	Branches	Functions
	90.24% (185/205)	75% (30/40)	86.66% (39/45)

Unit Test Report

Tests	Skipped	Failures	Errors	Time
14	0 💤	0 ❌	0 🔥	3.328s ⏱️

Add new dependency for storybook for pseudo states Write stories for 24 button states

Co-authored-by: Claudio W <cwunder@gnome.org> Signed-off-by: Umair Raza <52033975+umairraza96@users.noreply.github.com>

remove `storybook-addon-pseudo-states` dependency

Signed-off-by: Claudio W <cwunder@gnome.org>

- Remove tertiary variant - Add special variant - Adjust styles for special - Remove unused `.dark` class

ovflowd · 2023-09-26T15:12:23Z

Hey @umairraza96 the PostCSS changes got merged. I guess you can rebase and do the following:

update your mixin to use the @define-mixin API from postcss-mixins (and update the @include to be @mixin) (also they don't use () on both definition and usage)
replace the plain Hex Colors on your styles with the Talwind theme() call

targos · 2023-09-28T11:17:20Z

What kind of review do you need from releaser?

ovflowd · 2023-09-28T11:18:37Z

I think that @umairraza96 messed up their rebase.

And now it is containing files that are owned by releasers (aka release blog posts)

This PR became a big mess...

umairraza96 · 2023-09-28T11:38:30Z

I think that @umairraza96 messed up their rebase.

And now it is containing files that are owned by releasers (aka release blog posts)

This PR became a big mess...

I will try to fix it. Using
git reset --hard main and then try to do things again hope it helps

ovflowd · 2023-09-28T11:45:30Z

I think that @umairraza96 messed up their rebase.
And now it is containing files that are owned by releasers (aka release blog posts)
This PR became a big mess...

I will try to fix it. Using git reset --hard main and then try to do things again hope it helps

You need to keep in mind that your fork main branch is not the same as the upstream main branch. The source of this mess is probably that you tried to rebase based on your fork's main.

I recommend syncing your fork through GitHub UI or manual pull on your main from upstream's main.

umairraza96 · 2023-09-28T11:48:06Z

I think that @umairraza96 messed up their rebase.
And now it is containing files that are owned by releasers (aka release blog posts)
This PR became a big mess...

I will try to fix it. Using git reset --hard main and then try to do things again hope it helps

You need to keep in mind that your fork main branch is not the same as the upstream main branch. The source of this mess is probably that you tried to rebase based on your fork's main.

I recommend syncing your fork through GitHub UI or manual pull on your main from upstream's main.

Exactly that was the issue, figured it out.

ovflowd

I've pushed a quick fix (accidentally you created a index.scss) and added the variant stories.

LGTM! Thank you soooooo much for your contribution, @umairraza96! Superb work, and thank you for the continuous effort here, even after all the extensive reviews 🙇

vercel Bot deployed to Preview September 11, 2023 12:12 View deployment

umairraza96 changed the title ~~feat: add button component~~ feat: add Button component Sep 11, 2023

rodion-arr linked an issue Sep 11, 2023 that may be closed by this pull request

Create Button component #5758

Closed

rodion-arr added the github_actions:pull-request Trigger Pull Request Checks label Sep 11, 2023

rodion-arr deployed to Storybook September 11, 2023 13:15 — with GitHub Actions View deployment

github-actions Bot removed the github_actions:pull-request Trigger Pull Request Checks label Sep 11, 2023

AugustinMauroy reviewed Sep 11, 2023

View reviewed changes

Comment thread components/Common/Button/index.stories.tsx Outdated