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.

Sign up for GitHub

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

Jump to bottom

Storybook: Add UnitControl story #67346

Merged
merged 4 commits into from
Jan 7, 2025
Merged

Storybook: Add UnitControl story #67346

merged 4 commits into from
Jan 7, 2025

Conversation

im3dabasia
Copy link
Contributor

@im3dabasia im3dabasia commented Nov 27, 2024 •
edited
Loading

Part of #67165

What?

This PR will add stories for UnitControl component in the Storybook.

Why?

As part of the ongoing effort to improve component documentation and testing (tracked in #22891), we need comprehensive stories for all Block Editor components.

Testing Instructions

  1. Run npm run storybook:dev
  2. Open the storybook on http://localhost:50240/
  3. Check the UnitControl stories.

Screenshots or screencast

Screen.Recording.2024-11-27.at.4.57.25.PM.mov

@github-actions github-actions bot added the First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository label Nov 27, 2024
@github-actions GitHub Actions
Copy link

👋 Thanks for your first Pull Request and for helping build the future of Gutenberg and WordPress, @im3dabasia! In case you missed it, we'd love to have you join us in our Slack community.

If you want to learn more about WordPress development in general, check out the Core Handbook full of helpful information.

@im3dabasia im3dabasia marked this pull request as ready for review November 27, 2024 11:32
@im3dabasia im3dabasia requested a review from ellatrix as a code owner November 27, 2024 11:32
@github-actions GitHub Actions
Copy link

github-actions bot commented Nov 27, 2024 •
edited
Loading

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: im3dabasia <[email protected]>
Co-authored-by: t-hamano <[email protected]>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

@im3dabasia im3dabasia mentioned this pull request Nov 28, 2024
Open
@akasunil akasunil added [Type] Developer Documentation Documentation for developers Storybook Storybook and its stories for components labels Nov 28, 2024
@miminari miminari requested review from jsnajdr and ItsJonQ and removed request for ellatrix November 29, 2024 00:17
@im3dabasia im3dabasia force-pushed the storybook/unit-control branch from cf31838 to da9cedf Compare December 20, 2024 12:55
@im3dabasia
Copy link
Contributor Author

Hey @t-hamano,

I have refactored this PR to align with the patterns suggested in the issue. Please review my work when you have a moment. Thank you!

Screen.Recording.2024-12-23.at.2.42.02.PM.mov

@im3dabasia
Copy link
Contributor Author

Would it be a good idea to show a story with custom units? I had considered adding this but have removed it for now. Let me know if it makes sense to include a story for this.

t-hamano
t-hamano reviewed Dec 30, 2024
View reviewed changes
Copy link
Contributor

@t-hamano t-hamano left a comment

Choose a reason for hiding this comment

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

Thanks for the PR!

We may also want to add the following three props to match the README:

  • disabledUnits
  • isPressEnterToChange
  • isUnitSelectTabbable

packages/block-editor/src/components/unit-control/stories/index.story.js Outdated Show resolved Hide resolved
packages/block-editor/src/components/unit-control/stories/index.story.js Outdated Show resolved Hide resolved
packages/block-editor/src/components/unit-control/stories/index.story.js Outdated Show resolved Hide resolved
packages/block-editor/src/components/unit-control/stories/index.story.js Outdated Show resolved Hide resolved
@t-hamano
Copy link
Contributor

Would it be a good idea to show a story with custom units?

This component is a kind of wrapper component for the UnitControl component in the components package. And this UnitControl component exported by the block-editor package doesn't seem to be used anywhere in Gutenberg right now.

Considering this, I think one story is enough.

@im3dabasia im3dabasia requested a review from t-hamano January 3, 2025 11:46
t-hamano
t-hamano reviewed Jan 4, 2025
View reviewed changes
packages/block-editor/src/components/unit-control/stories/index.story.js Outdated
defaultValue: { summary: false },
},
},
disabledUnits: {
Copy link
Contributor

Choose a reason for hiding this comment

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

Suggested change
disabledUnits: {
disableUnits: {

Sorry, I made a mistake with the prop name 😅 It would be nice if we could fix this together too.

@im3dabasia im3dabasia requested a review from t-hamano January 6, 2025 11:04
t-hamano
t-hamano approved these changes Jan 7, 2025
View reviewed changes
Copy link
Contributor

@t-hamano t-hamano left a comment

Choose a reason for hiding this comment

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

LGTM 👍

@t-hamano t-hamano merged commit d131a2c into WordPress:trunk Jan 7, 2025
63 checks passed
@github-actions github-actions bot added this to the Gutenberg 20.1 milestone Jan 7, 2025
westonruter added a commit that referenced this pull request Jan 7, 2025
@westonruter
Merge branch 'trunk' of https://github.com/WordPress/gutenberg into t…
88d679c 
…ry/interactivity-lazy-hydration

* 'trunk' of https://github.com/WordPress/gutenberg: (143 commits)
  Update: Bundle upload media. (#68522)
  Add: Media field changing ui to Dataviews and content preview field to posts and pages (#67278)
  Bump the react-native group with 2 updates (#68095)
  Check Storybook build on CI for PRs (#68466)
  Bump the github-actions group across 1 directory with 2 updates (#68436)
  Classic theme preview: remove admin-bar class name (#68519)
  Remove geriux as code owner (#68523)
  Post Featured Image: Adds control to clear the the overlay color (#68525)
  Components: Standardize reduced motion handling using media queries (#68421)
  Upgrade Playwright to v1.49 (#68504)
  Document Outline: Use block client ID as unique 'key' (#68502)
  Storybook: Add UnitControl story (#67346)
  Details: Add allowedBlocks and TemplateLock attributes (#68489)
  Post Comment Link: Show Border Control By Default (#68506)
  Query Total: Show Border Controls By Default (#68507)
  RSS: Added Colour support (#66419)
  Refactor: Separate input form styles to a dedicated stylesheet (#68501)
  Code quality: Fix typos (#67304)
  Page List: Added color support (#66430)
  Fix flaky DataViews list arraow nav e2e tests (#68503)
  ...
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@t-hamano t-hamano t-hamano approved these changes

@jsnajdr jsnajdr Awaiting requested review from jsnajdr

@ItsJonQ ItsJonQ Awaiting requested review from ItsJonQ

Assignees
No one assigned
Labels
First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository Storybook Storybook and its stories for components [Type] Developer Documentation Documentation for developers
Projects
None yet
Milestone
Gutenberg 20.1
Development

Successfully merging this pull request may close these issues.
3 participants
@im3dabasia @t-hamano @akasunil