Skip to content

Created examples code for truncation and added prop definition #8107

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
Merged
merged 3 commits into from
Jan 23, 2023
Merged

Created examples code for truncation and added prop definition #8107

merged 3 commits into from
Jan 23, 2023

Conversation

@Rmnlly
Copy link
Contributor

@Rmnlly Rmnlly commented Jan 19, 2023 •
edited
Loading

WHY are these changes introduced?

Closes https://github.com/Shopify/core-workflows/issues/737

We've added a couples of new features into the Navigation component that require documentation. The truncateText prop for truncating long nav item text and the multiple secondary actions feature both need examples and prop definitions added to the Polaris document site.

WHAT is this pull request doing?

Examples have been added for the truncation feature and multiple secondary actions feature.
Truncation: With truncation active for various states
Multiple Secondary Actions: With multiple secondary actions

How to 🎩

🎩 Link to doc site => https://polaris.examples-in-docs-truncation-actions.raman-lally.us.spin.dev

🖥 Local development instructions
🗒 General tophatting guidelines
📄 Changelog guidelines

🎩 checklist

@Rmnlly Rmnlly requested a review from chloerice January 20, 2023 16:18
@Rmnlly Rmnlly assigned martenbjork and unassigned martenbjork Jan 20, 2023
@Rmnlly Rmnlly requested a review from martenbjork January 20, 2023 16:19
martenbjork
martenbjork approved these changes Jan 20, 2023
View reviewed changes
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.

Looks good to me! 🙌

(These property tables in markdown look rather messy, but that's a problem that we need to solve on our end 😄)

@Rmnlly Rmnlly force-pushed the add-docs-truncation-multi-actions branch from 703e3b1 to ac1351f Compare January 20, 2023 21:25
@Rmnlly Rmnlly force-pushed the add-docs-truncation-multi-actions branch from ac1351f to 4401dc6 Compare January 20, 2023 21:33
henryyi
henryyi approved these changes Jan 20, 2023
View reviewed changes
Copy link
Contributor

@henryyi henryyi left a comment

Choose a reason for hiding this comment

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

🎩 LGTM

@Rmnlly Rmnlly merged commit fc30bbd into main Jan 23, 2023
@Rmnlly Rmnlly deleted the add-docs-truncation-multi-actions branch January 23, 2023 14:10
@shopify-github-actions-access shopify-github-actions-access bot mentioned this pull request Jan 23, 2023
Merged
sophschneider pushed a commit that referenced this pull request Jan 24, 2023
@shopify-github-actions-access @github-actions
Version Packages (#8103)
57a6b44 
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/polaris-icons@6.9.0

### Minor Changes

- [#8139](#8139)
[`b998ca007`](b998ca0)
Thanks [@leileu](https://github.com/leileu)! - Adding content minor icon
for left nav in admin


- [#8094](#8094)
[`94988bc26`](94988bc)
Thanks [@Tamas-Kisss](https://github.com/Tamas-Kisss)! - Added major and
minor icon for Papercheck


- [#8121](#8121)
[`f74e8ffcc`](f74e8ff)
Thanks [@zecarlostorre](https://github.com/zecarlostorre)! - Added
EnterMajor icon

## @shopify/polaris@10.23.0

### Minor Changes

- [#8134](#8134)
[`8d80691b5`](8d80691)
Thanks [@mrcthms](https://github.com/mrcthms)! - Removed the focus ring
from `Listbox` options

### Patch Changes

- [#8093](#8093)
[`60dd5a0c5`](60dd5a0)
Thanks [@highfieldjames](https://github.com/highfieldjames)! - Added
`borderRadius` style to `TooltipOverlay`


- [#8090](#8090)
[`bdcc291a4`](bdcc291)
Thanks [@emmanueletti](https://github.com/emmanueletti)! - Replaced
mouse up and down events on Backdrop with onClick to close Modal


- [#8131](#8131)
[`6096c3492`](6096c34)
Thanks [@henryyi](https://github.com/henryyi)! - Fixed Navigation item
secondaryActions alignment in mobile when floating actions are enabled


- [#8114](#8114)
[`e6aa9c801`](e6aa9c8)
Thanks [@highfieldjames](https://github.com/highfieldjames)! - Dismiss
index table tooltip on mouse out


- [#8091](#8091)
[`23ee70d13`](23ee70d)
Thanks [@ginabak](https://github.com/ginabak)! - Added `onBlur` prop to
numerical steppers (`Spinner` component of `TextField`) to remove multi
focus issue in `TextField`.

- Updated dependencies
\[[`b998ca007`](b998ca0),
[`94988bc26`](94988bc),
[`f74e8ffcc`](f74e8ff)]:
    -   @shopify/polaris-icons@6.9.0

## @shopify/plugin-polaris@0.0.30

### Patch Changes

-   Updated dependencies \[]:
    -   @shopify/polaris-migrator@0.11.1

## @shopify/polaris-migrator@0.11.1

### Patch Changes

- Updated dependencies
\[[`cd150396b`](cd15039)]:
    -   @shopify/stylelint-polaris@5.1.1

## @shopify/stylelint-polaris@5.1.1

### Patch Changes

- [#8097](#8097)
[`cd150396b`](cd15039)
Thanks [@qt314](https://github.com/qt314)! - Fix incorrect unit function
categorization

## polaris.shopify.com@0.30.0

### Minor Changes

- [#8110](#8110)
[`5db7778e4`](5db7778)
Thanks [@yurm04](https://github.com/yurm04)! - Added New badge pattern
guidance for the primary nav

### Patch Changes

- [#8107](#8107)
[`fc30bbd32`](fc30bbd)
Thanks [@Rmnlly](https://github.com/Rmnlly)! - Adding examples for
truncateText and multiple secondary actions and updating props on the
documentation site

- Updated dependencies
\[[`b998ca007`](b998ca0),
[`60dd5a0c5`](60dd5a0),
[`bdcc291a4`](bdcc291),
[`6096c3492`](6096c34),
[`94988bc26`](94988bc),
[`e6aa9c801`](e6aa9c8),
[`8d80691b5`](8d80691),
[`f74e8ffcc`](f74e8ff),
[`23ee70d13`](23ee70d)]:
    -   @shopify/polaris-icons@6.9.0
    -   @shopify/polaris@10.23.0

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
@marlowpayne marlowpayne mentioned this pull request Jan 24, 2023
Merged
5 tasks
@gwyneplaine gwyneplaine mentioned this pull request Feb 14, 2023
Merged
juzser pushed a commit to juzser/polaris that referenced this pull request Jul 27, 2023
@Rmnlly @juzser
Created examples code for truncation and added prop definition (Shopi…
89cb1c4 
…fy#8107)

<!--
  ☝️How to write a good PR title:
- Prefix it with [ComponentName] (if applicable), for example: [Button]
  - Start with a verb, for example: Add, Delete, Improve, Fix…
  - Give as much context as necessary and as little as possible
  - Prefix it with [WIP] while it’s a work in progress
-->

### WHY are these changes introduced?

Closes https://github.com/Shopify/core-workflows/issues/737

We've added a couples of new features into the Navigation component that
require documentation. The truncateText prop for truncating long nav
item text and the multiple secondary actions feature both need examples
and prop definitions added to the Polaris document site.

### WHAT is this pull request doing?

Examples have been added for the truncation feature and multiple
secondary actions feature.
Truncation: `With truncation active for various states`
Multiple Secondary Actions: `With multiple secondary actions`

### How to 🎩

🎩 Link to doc site =>
[https://polaris.examples-in-docs-truncation-actions.raman-lally.us.spin.dev](https://polaris.examples-in-docs-truncation-actions.raman-lally.us.spin.dev/components/navigation#secondary-action)

🖥 [Local development
instructions](https://github.com/Shopify/polaris/blob/main/README.md#local-development)
🗒 [General tophatting
guidelines](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting.md)
📄 [Changelog
guidelines](https://github.com/Shopify/polaris/blob/main/.github/CONTRIBUTING.md#changelog)

### 🎩 checklist

- [x] Tested on
[mobile](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting.md#cross-browser-testing)
- [x] Tested on [multiple
browsers](https://help.shopify.com/en/manual/shopify-admin/supported-browsers)
- [ ] Tested for
[accessibility](https://github.com/Shopify/polaris/blob/main/documentation/Accessibility%20testing.md)
- [x] Updated the component's `README.md` with documentation changes
- [x] [Tophatted
documentation](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting%20documentation.md)
changes in the style guide
juzser pushed a commit to juzser/polaris that referenced this pull request Jul 27, 2023
@shopify-github-actions-access @github-actions @juzser
Version Packages (Shopify#8103)
d32b782 
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/polaris-icons@6.9.0

### Minor Changes

- [Shopify#8139](Shopify#8139)
[`b998ca007`](Shopify@b998ca0)
Thanks [@leileu](https://github.com/leileu)! - Adding content minor icon
for left nav in admin


- [Shopify#8094](Shopify#8094)
[`94988bc26`](Shopify@94988bc)
Thanks [@Tamas-Kisss](https://github.com/Tamas-Kisss)! - Added major and
minor icon for Papercheck


- [Shopify#8121](Shopify#8121)
[`f74e8ffcc`](Shopify@f74e8ff)
Thanks [@zecarlostorre](https://github.com/zecarlostorre)! - Added
EnterMajor icon

## @shopify/polaris@10.23.0

### Minor Changes

- [Shopify#8134](Shopify#8134)
[`8d80691b5`](Shopify@8d80691)
Thanks [@mrcthms](https://github.com/mrcthms)! - Removed the focus ring
from `Listbox` options

### Patch Changes

- [Shopify#8093](Shopify#8093)
[`60dd5a0c5`](Shopify@60dd5a0)
Thanks [@highfieldjames](https://github.com/highfieldjames)! - Added
`borderRadius` style to `TooltipOverlay`


- [Shopify#8090](Shopify#8090)
[`bdcc291a4`](Shopify@bdcc291)
Thanks [@emmanueletti](https://github.com/emmanueletti)! - Replaced
mouse up and down events on Backdrop with onClick to close Modal


- [Shopify#8131](Shopify#8131)
[`6096c3492`](Shopify@6096c34)
Thanks [@henryyi](https://github.com/henryyi)! - Fixed Navigation item
secondaryActions alignment in mobile when floating actions are enabled


- [Shopify#8114](Shopify#8114)
[`e6aa9c801`](Shopify@e6aa9c8)
Thanks [@highfieldjames](https://github.com/highfieldjames)! - Dismiss
index table tooltip on mouse out


- [Shopify#8091](Shopify#8091)
[`23ee70d13`](Shopify@23ee70d)
Thanks [@ginabak](https://github.com/ginabak)! - Added `onBlur` prop to
numerical steppers (`Spinner` component of `TextField`) to remove multi
focus issue in `TextField`.

- Updated dependencies
\[[`b998ca007`](Shopify@b998ca0),
[`94988bc26`](Shopify@94988bc),
[`f74e8ffcc`](Shopify@f74e8ff)]:
    -   @shopify/polaris-icons@6.9.0

## @shopify/plugin-polaris@0.0.30

### Patch Changes

-   Updated dependencies \[]:
    -   @shopify/polaris-migrator@0.11.1

## @shopify/polaris-migrator@0.11.1

### Patch Changes

- Updated dependencies
\[[`cd150396b`](Shopify@cd15039)]:
    -   @shopify/stylelint-polaris@5.1.1

## @shopify/stylelint-polaris@5.1.1

### Patch Changes

- [Shopify#8097](Shopify#8097)
[`cd150396b`](Shopify@cd15039)
Thanks [@qt314](https://github.com/qt314)! - Fix incorrect unit function
categorization

## polaris.shopify.com@0.30.0

### Minor Changes

- [Shopify#8110](Shopify#8110)
[`5db7778e4`](Shopify@5db7778)
Thanks [@yurm04](https://github.com/yurm04)! - Added New badge pattern
guidance for the primary nav

### Patch Changes

- [Shopify#8107](Shopify#8107)
[`fc30bbd32`](Shopify@fc30bbd)
Thanks [@Rmnlly](https://github.com/Rmnlly)! - Adding examples for
truncateText and multiple secondary actions and updating props on the
documentation site

- Updated dependencies
\[[`b998ca007`](Shopify@b998ca0),
[`60dd5a0c5`](Shopify@60dd5a0),
[`bdcc291a4`](Shopify@bdcc291),
[`6096c3492`](Shopify@6096c34),
[`94988bc26`](Shopify@94988bc),
[`e6aa9c801`](Shopify@e6aa9c8),
[`8d80691b5`](Shopify@8d80691),
[`f74e8ffcc`](Shopify@f74e8ff),
[`23ee70d13`](Shopify@23ee70d)]:
    -   @shopify/polaris-icons@6.9.0
    -   @shopify/polaris@10.23.0

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

Reviewers

@henryyi henryyi henryyi approved these changes

@chloerice chloerice Awaiting requested review from chloerice

+1 more reviewer

@martenbjork martenbjork martenbjork approved these changes

Reviewers whose approvals may not affect merge requirements

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@Rmnlly @martenbjork @henryyi