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

Add type tokens to storybook #65993

Merged
merged 3 commits into from
Oct 10, 2024
Merged

Add type tokens to storybook #65993

merged 3 commits into from
Oct 10, 2024

Conversation

jameskoster
Copy link
Contributor

Screenshot 2024-10-09 at 14 49 42

Related to #65982.

What?

Document the recently added type tokens (#65418) in Storybook.

Why?

This makes them more discoverable and usable.

Testing Instructions

  1. npm run storybook
  2. Browse the Tokens -> Typography section

@jameskoster jameskoster added [Type] Enhancement A suggestion for improvement. Storybook Storybook and its stories for components Design System Issues related to the system of combining components according to best practices. labels Oct 9, 2024
Copy link

github-actions bot commented Oct 9, 2024

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: jameskoster <jameskoster@git.wordpress.org>
Co-authored-by: tyxla <tyxla@git.wordpress.org>
Co-authored-by: jasmussen <joen@git.wordpress.org>
Co-authored-by: ciampo <mciampini@git.wordpress.org>

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

@jameskoster jameskoster requested a review from a team October 9, 2024 13:57
@jameskoster jameskoster self-assigned this Oct 9, 2024
@t-hamano t-hamano requested a review from a team October 9, 2024 22:47
Copy link
Contributor

@jasmussen jasmussen left a comment

Choose a reason for hiding this comment

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

Looks great. I'll defer to a review from the components team if they have one.

Storybook arcana-wise, it's interesting to use HTML tables here, glad to see that working. I looked at using Markdown tables, that seems to require an extension for the moment.

@tyxla
Copy link
Member

tyxla commented Oct 10, 2024

Will take a look, but in the meantime, I've converted spaces to tabs to be consistent with the rest of the codebase.

Copy link
Member

@tyxla tyxla left a comment

Choose a reason for hiding this comment

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

Looks great! We can always add more context or explanations if we feel it's needed. 🚀

After addressing spacing, I also left a few minor suggestions, mostly related to syntax highlighting. Good to go after they're addressed. 👍

storybook/stories/tokens/typography.mdx Outdated Show resolved Hide resolved
storybook/stories/tokens/typography.mdx Outdated Show resolved Hide resolved
storybook/stories/tokens/typography.mdx Outdated Show resolved Hide resolved
storybook/stories/tokens/typography.mdx Outdated Show resolved Hide resolved
storybook/stories/tokens/typography.mdx Outdated Show resolved Hide resolved
storybook/stories/tokens/typography.mdx Outdated Show resolved Hide resolved
storybook/stories/tokens/typography.mdx Outdated Show resolved Hide resolved
storybook/stories/tokens/typography.mdx Outdated Show resolved Hide resolved
Co-authored-by: Marin Atanasov <8436925+tyxla@users.noreply.github.com>
@jameskoster
Copy link
Contributor Author

Thanks the for the reviews y'all.

I looked at using Markdown tables, that seems to require an extension for the moment.

Yeah I meant to note that. Markdown tables aren't working currently. Let's look at adding the extension separately then revisit.

Copy link

Flaky tests detected in 1b78147.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/11271245984
📝 Reported issues:

@ciampo ciampo merged commit 715844d into trunk Oct 10, 2024
62 checks passed
@ciampo ciampo deleted the update/storybook-type-tokens branch October 10, 2024 12:16
@github-actions github-actions bot added this to the Gutenberg 19.5 milestone Oct 10, 2024
ciampo added a commit that referenced this pull request Oct 14, 2024
* Add type tokens to storybook

* Use tabs for spacing

* Apply suggestions from code review

Co-authored-by: Marin Atanasov <8436925+tyxla@users.noreply.github.com>

---------

Co-authored-by: jameskoster <jameskoster@git.wordpress.org>
Co-authored-by: tyxla <tyxla@git.wordpress.org>
Co-authored-by: jasmussen <joen@git.wordpress.org>
Co-authored-by: ciampo <mciampini@git.wordpress.org>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Design System Issues related to the system of combining components according to best practices. Storybook Storybook and its stories for components [Type] Enhancement A suggestion for improvement.
Projects
Status: 💫 Done
Development

Successfully merging this pull request may close these issues.

4 participants