Skip to content

Conversation

@nickpresta
Copy link
Member

@nickpresta nickpresta commented Sep 22, 2022

WHY are these changes introduced?

Hot on the heels of #6757 being merged, this change introduces the ability to collapse props after being expanded. This allows users to expand ("explore") and then collapse ("focus") props as needed depending on the types they want to see.

Before

2022-09-22_12-05-35.mp4

After

2022-09-22_12-07-20.mp4

WHAT is this pull request doing?

  • Adds an additional function to collapse props within the props table.
  • Wraps the TypeTable in <AnimatePresence> per Framer's instruction when using exit animations on div.motion as well as a key.
  • Updated hasBenExpanded to hasBeenExpanded -- think this was a typo.
  • I also introduced a subtle hover state on the clickable types, since it wasn't immediately obvious to me that they were interactable.

How to 🎩

🖥 Local development instructions
🗒 General tophatting guidelines
📄 Changelog guidelines

Run the Polaris docs:

  1. dev up
  2. cd polaris.shopify.com && yarn run dev
  3. Open up a component page - e.g. http://localhost:3000/components/option-list

🎩 checklist

@nickpresta nickpresta requested review from a team and martenbjork September 22, 2022 16:05
Copy link
Member

@chloerice chloerice left a comment

Choose a reason for hiding this comment

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

Thanks @nickpresta!! 🙌🏽

Copy link
Contributor

@martenbjork martenbjork left a comment

Choose a reason for hiding this comment

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

Thanks so much for this PR and for your patience, Nick!

I took the liberty to push some style UX changes, most importantly adding a dedicated collapse button.

Screen Shot 2022-10-07 at 2 08 01 PM

I think this is ready to ship. Let me know what you think!

@nickpresta
Copy link
Member Author

Awesome! Looks great! 👍 to ship!

@martenbjork martenbjork merged commit 61cf086 into main Oct 7, 2022
@martenbjork martenbjork deleted the polaris-docs-props-table-type-collapsing branch October 7, 2022 12:35
@github-actions github-actions bot mentioned this pull request Oct 7, 2022
kyledurand pushed a commit that referenced this pull request Oct 7, 2022
This PR was opened by the [Changesets
release](https://github.com/changesets/action) GitHub action. When
you're ready to do a release, you can merge this and the packages will
be published to npm automatically. If you're not ready to do a release
yet, that's fine, whenever you add more changesets to main, this PR will
be updated.


# Releases
## @shopify/[email protected]

### Minor Changes

- [#7216](#7216)
[`fbf2f8832`](fbf2f88)
Thanks [@aaronccasanova](https://github.com/aaronccasanova)! - Add
migration to replace static mixins with declarations

### Patch Changes

- [#7328](#7328)
[`b31f51f25`](b31f51f)
Thanks [@aaronccasanova](https://github.com/aaronccasanova)! - Add
namespace support to the `replace-static-breakpoint-mixins` migration

## @shopify/[email protected]

### Minor Changes

- [#7360](#7360)
[`f7140123d`](f714012)
Thanks [@mrcthms](https://github.com/mrcthms)! - Update `IndexTable` in
sortable mode to fix visual bugs and include label Tooltips

### Patch Changes

- [#7361](#7361)
[`b1b576403`](b1b5764)
Thanks [@kyledurand](https://github.com/kyledurand)! - Use state
callback in page actions


- [#7319](#7319)
[`4b95fdc64`](4b95fdc)
Thanks [@qt314](https://github.com/qt314)! - Update the `VideoThumbnail`
play button user experience

## @shopify/[email protected]

### Patch Changes

- Updated dependencies
\[[`fbf2f8832`](fbf2f88),
[`b31f51f25`](b31f51f)]:
    -   @shopify/[email protected]

## [email protected]

### Minor Changes

- [#7254](#7254)
[`61cf086ed`](61cf086)
Thanks [@nickpresta](https://github.com/nickpresta)! - Added ability to
collapse props that have been expanded.

### Patch Changes

- [#7305](#7305)
[`b0445cf9b`](b0445cf)
Thanks [@selenehinkley](https://github.com/selenehinkley)! - Added
"Getting started" section

- Updated dependencies
\[[`f7140123d`](f714012),
[`b1b576403`](b1b5764),
[`4b95fdc64`](4b95fdc)]:
    -   @shopify/[email protected]

## [email protected]

### Patch Changes

- Updated dependencies
\[[`f7140123d`](f714012),
[`b1b576403`](b1b5764),
[`4b95fdc64`](4b95fdc)]:
    -   @shopify/[email protected]

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
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.

3 participants