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

Example apps & documentation (usage, contribution) #19

Merged
merged 38 commits into from
Aug 4, 2023
Merged

Conversation

coopbri
Copy link
Contributor

@coopbri coopbri commented Aug 3, 2023

Description

Task link: https://trello.com/c/qwSmnpZQ/68-ui-kit
  • Added example apps (Vite + React, Next.js)
  • Added library usage docs (both locally for development with yalc and from remote package repository)
  • Added changesets usage docs
  • Added backfilled default Panda patterns (Flex, Circle, ...)
  • Added Text component

Test Steps

  • In Storybook, verify Text component looks good (we can modify later, see Example apps & documentation (usage, contribution) #19 (comment))
  • Locally on this branch:
    1. Follow the instructions added to the README Local Development (links to docs/usage.md) section to install the UI library in a separate local project (e.g. a Next.js app or similar) and make sure it works correctly (try changing Panda styles).
    2. Follow the instructions in examples/README.md to test both the Next.js and the Vite + React example apps and make sure they work correctly (try changing Panda styles).
  • Verify the documentation looks good all around (including the docs/changesets.md, linked from CONTRIBUTING.md) file. If anything is confusing, let me know.

@changeset-bot
Copy link

changeset-bot bot commented Aug 3, 2023

🦋 Changeset detected

Latest commit: 1ab38fb

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@animareflection/ui Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@vercel
Copy link

vercel bot commented Aug 3, 2023

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

Name Status Preview Comments Updated (UTC)
ui ✅ Ready (Inspect) Visit Preview 💬 Add feedback Aug 4, 2023 5:21pm

@github-actions
Copy link
Contributor

github-actions bot commented Aug 3, 2023

Coverage report

St.
Category Percentage Covered / Total
🟢 Statements 100% 57/57
🟢 Branches 100% 0/0
🟢 Functions 100% 0/0
🟢 Lines 100% 57/57
Show new covered files 🐣
St.
File Statements Branches Functions Lines
🟢 Button/Button.tsx 100% 100% 100% 100%
🟢 Text/Text.tsx 100% 100% 100% 100%

Test suite run success

2 tests passing in 2 suites.

Report generated by 🧪jest coverage report action from 1ab38fb

Comment on lines +6 to +13
const recipe = cva({
variants: {
size: {
sm: { fontSize: "sm" },
lg: { fontSize: "lg" },
},
},
});
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Arbitrary styles, we can change any of this as needed! Just a placeholder.

src/index.ts Show resolved Hide resolved
Comment on lines +1 to +5
---
"@animareflection/ui": minor
---

Add `Button` component
Copy link
Contributor Author

Choose a reason for hiding this comment

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

For future reference, no reason this changeset can't be combined with the above changeset; changesets are designed to stack. Upon a release, the changesets are "compressed" into the changelog.

Comment on lines +1 to +3
# Contributing

Follow the [changesets documentation](docs/changesets.md) for guidelines on how to create changesets, which describe changes you've created.
Copy link
Contributor Author

Choose a reason for hiding this comment

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

This file is minimal just to have a convenient and clear entrypoint to the docs/changesets.md file, though it will be expanded in the future to include all the guidelines necessary for someone to contribute smoothly.

Also note that e.g. the changesets documentation, as well as this file, will eventually be extracted to organization-wide docs so that we have one source of truth for multiple repos using this tooling.

@coopbri coopbri requested a review from hobbescodes August 3, 2023 07:57
@coopbri coopbri changed the title Examples & usage documentation Example apps & usage + contribution documentation Aug 3, 2023
@coopbri coopbri changed the title Example apps & usage + contribution documentation Example apps & documentation for usage and contribution Aug 3, 2023
@coopbri coopbri changed the title Example apps & documentation for usage and contribution Example apps & documentation for usage + contribution Aug 3, 2023
@coopbri coopbri changed the title Example apps & documentation for usage + contribution Example apps & documentation (usage, contribution) Aug 3, 2023
@coopbri coopbri marked this pull request as ready for review August 3, 2023 08:38
Copy link
Contributor

@hobbescodes hobbescodes left a comment

Choose a reason for hiding this comment

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

Files look great for the most part! Left a comment requesting one change. Will now work through manual testing steps to verify everything runs smoothly! Ty again for all this work! Exciting stuff!

EDIT: Verified that everything ran smoothly with local development in both example apps! Great work!

src/components/core/Button/Button.tsx Show resolved Hide resolved
src/index.ts Show resolved Hide resolved
@@ -14,7 +14,6 @@
"module": "esnext",
"moduleResolution": "node",
"noEmit": true,
"outDir": "build",
Copy link
Contributor Author

Choose a reason for hiding this comment

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

This is not necessary because we have noEmit specified, which prevents TS from emitting files

Copy link
Contributor

@hobbescodes hobbescodes left a comment

Choose a reason for hiding this comment

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

lgtm!

@coopbri coopbri merged commit 844180f into master Aug 4, 2023
@coopbri coopbri deleted the docs/usage branch August 4, 2023 17:25
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.

2 participants