You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: polaris.shopify.com/content/contributing/code-of-conduct/index.md
+2-2Lines changed: 2 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -23,7 +23,7 @@ Examples of unacceptable behavior by participants include:
23
23
- The use of sexualized language or imagery and unwelcome sexual attention or advances
24
24
- Trolling, insulting/derogatory comments, and personal or political attacks
25
25
- Public or private harassment
26
-
- Publishing others' private information, such as a physical or electronic address, without explicit permission
26
+
- Publishing others’ private information, such as a physical or electronic address, without explicit permission
27
27
- Other conduct which could reasonably be considered inappropriate in a professional setting
28
28
29
29
## Our responsibilities
@@ -40,7 +40,7 @@ This Code of Conduct applies both within project spaces and in public spaces whe
40
40
41
41
Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by contacting the project team at [email protected]. All complaints will be reviewed and investigated and will result in a response that is deemed necessary and appropriate to the circumstances. The project team is obligated to maintain confidentiality with regard to the reporter of an incident. Further details of specific enforcement policies may be posted separately.
42
42
43
-
Project maintainers who do not follow or enforce the Code of Conduct in good faith may face temporary or permanent repercussions as determined by other members of the project's leadership.
43
+
Project maintainers who do not follow or enforce the Code of Conduct in good faith may face temporary or permanent repercussions as determined by other members of the project’s leadership.
Copy file name to clipboardExpand all lines: polaris.shopify.com/content/contributing/components/index.md
+8-8Lines changed: 8 additions & 8 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -15,11 +15,11 @@ keywords:
15
15
- open source
16
16
---
17
17
18
-
Bug fixes can be as simple as removing a typo, or as complex as refactoring a component to address a performance or accessibility issue. Enhancements usually add to or update the props of an existing component to extend its functionality or presentation. New patterns can be contributed by simply adding a new example to an existing component's documentation, or by adding new components or utilities. Often component contributions are a mix of these.
18
+
Bug fixes can be as simple as removing a typo, or as complex as refactoring a component to address a performance or accessibility issue. Enhancements usually add to or update the props of an existing component to extend its functionality or presentation. New patterns can be contributed by simply adding a new example to an existing component’s documentation, or by adding new components or utilities. Often component contributions are a mix of these.
19
19
20
-
Start planning your contribution as early as possible to account for the scope in your timeline. To get help with the strategy for your contribution early on, start a [discussion](https://github.com/Shopify/polaris/discussions/new) with the Polaris community. If you have a smaller question, reach out in #polaris if you work at Shopify, or the [Shopify Partners Slack](http://shopifypartners.slack.com) if you're an open source contributor. Once you've decided on the best way to solve the problem, submit a [feature proposal](https://github.com/Shopify/polaris/issues/new?assignees=&labels=Feature+request&template=FEATURE_REQUEST.md) or [bug report](https://github.com/Shopify/polaris/issues/new?assignees=&labels=%F0%9F%90%9BBug&template=ISSUE.md) issue. Then contribute the change by shipping a pull request.
20
+
Start planning your contribution as early as possible to account for the scope in your timeline. To get help with the strategy for your contribution early on, start a [discussion](https://github.com/Shopify/polaris/discussions/new) with the Polaris community. If you have a smaller question, reach out in #polaris if you work at Shopify, or the [Shopify Partners Slack](http://shopifypartners.slack.com) if you’re an open source contributor. Once you’ve decided on the best way to solve the problem, submit a [feature proposal](https://github.com/Shopify/polaris/issues/new?assignees=&labels=Feature+request&template=FEATURE_REQUEST.md) or [bug report](https://github.com/Shopify/polaris/issues/new?assignees=&labels=%F0%9F%90%9BBug&template=ISSUE.md) issue. Then contribute the change by shipping a pull request.
21
21
22
-
Often the changes you make to a component's code impact the [documentation](/contributing/documentation) and [Figma UI Kit](/contributing/figma-ui-kit). If you work at Shopify, component contributions should be a team effort across disciplines. If you're an open source contributor, we'll work with you to update the Figma UI Kit once you [create an issue](https://github.com/Shopify/polaris/issues/new/choose) or [open a pull request](/contributing/shipping-your-contribution#open-your-first-pr) in the `Shopify/polaris` repo.
22
+
Often the changes you make to a component’s code impact the [documentation](/contributing/documentation) and [Figma UI Kit](/contributing/figma-ui-kit). If you work at Shopify, component contributions should be a team effort across disciplines. If you’re an open source contributor, we’ll work with you to update the Figma UI Kit once you [create an issue](https://github.com/Shopify/polaris/issues/new/choose) or [open a pull request](/contributing/shipping-your-contribution#open-your-first-pr) in the `Shopify/polaris` repo.
23
23
24
24
## Update props
25
25
@@ -35,7 +35,7 @@ Components should be performant, accessible, and maintainable. When contributing
35
35
- Address a pain point in the merchant experience
36
36
- Reduce complexity of the source code
37
37
38
-
If a component isn't flexible enough to meet your project's requirements, or you're unsure whether a component is right for your use case, submit an [issue](https://github.com/Shopify/polaris/issues/new?assignees=&labels=Feature+request&template=FEATURE_REQUEST.md) or [open a pull request](/contributing/shipping-your-contribution#open-your-first-pr) outlining the problem and the approach you're thinking about. We're happy to collaborate to find a solution.
38
+
If a component isn’t flexible enough to meet your project’s requirements, or you’re unsure whether a component is right for your use case, submit an [issue](https://github.com/Shopify/polaris/issues/new?assignees=&labels=Feature+request&template=FEATURE_REQUEST.md) or [open a pull request](/contributing/shipping-your-contribution#open-your-first-pr) outlining the problem and the approach you’re thinking about. We’re happy to collaborate to find a solution.
39
39
40
40
### How to contribute
41
41
@@ -57,13 +57,13 @@ To add or update a prop:
57
57
58
58
### Considerations
59
59
60
-
Bug fixes are high impact contributions that ensure we deliver a reliable, crafted experience to merchants. Whether you're a seasoned contributor or looking to make your first pull request, there's a bug report open for every level of experience.
60
+
Bug fixes are high impact contributions that ensure we deliver a reliable, crafted experience to merchants. Whether you’re a seasoned contributor or looking to make your first pull request, there’s a bug report open for every level of experience.
61
61
62
-
If you're just getting started with contributing to Polaris React, look for issues that are:
62
+
If you’re just getting started with contributing to Polaris React, look for issues that are:
63
63
64
64
- Labeled as a [good first issue](https://github.com/Shopify/polaris/issues?q=is%3Aopen+is%3Aissue+label%3A%22Good+first+issue%22)
65
65
- Not yet assigned to someone
66
-
- Haven't been updated in two or more weeks
66
+
- Haven’t been updated in two or more weeks
67
67
68
68
### How to contribute
69
69
@@ -95,7 +95,7 @@ When exploring the potential for improving the look, feel, and or experience of
95
95
96
96
### Case study
97
97
98
-
In the years since Polaris launched in 2017, we've learned a lot from the Shopify and design system communities. As the system's matured, we've found that many of the components should evolve toward [composition over configuration](https://maecapozzi.com/blog/composition-vs-configuration/). Many props is a signal that a component is solving too many problems or is too opinionated. When that's the case, there's an opportunity to refactor the component or build a new component to better meet merchant needs.
98
+
In the years since Polaris launched in 2017, we’ve learned a lot from the Shopify and design system communities. As the system’s matured, we’ve found that many of the components should evolve toward [composition over configuration](https://maecapozzi.com/blog/composition-vs-configuration/). Many props is a signal that a component is solving too many problems or is too opinionated. When that’s the case, there’s an opportunity to refactor the component or build a new component to better meet merchant needs.
99
99
100
100
For example, `Autocomplete` implements [the combobox with list pattern](https://www.w3.org/WAI/ARIA/apg/patterns/combobox/). When the Deliver team looked into fixing bugs in the component, they decided it would benefit from being broken down into two new components. They contributed `Combobox` and `Listbox` and refactored `Autocomplete` to use them. This reduced complexity and made `Autocomplete` easier to maintain.
Copy file name to clipboardExpand all lines: polaris.shopify.com/content/contributing/designing-with-a-system/index.md
+4-4Lines changed: 4 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -8,23 +8,23 @@ keywords:
8
8
9
9

10
10
11
-
At Shopify, we often say, "Polaris is the floor, not the ceiling." The design system provides you with building blocks, and it's up to you to construct them in a way that best meets your user's needs. The idea behind Polaris not being a ceiling is that you shouldn't limit your ideas to fit into existing system pieces too early. Zoom out, figure out the best design solution to the problem, and then see if Polaris has all the pieces for you to design that solution. If there's a gap, then [contribute](https://polaris.shopify.com/contributing) to the system to make it better.
11
+
At Shopify, we often say, “Polaris is the floor, not the ceiling.” The design system provides you with building blocks, and it’s up to you to construct them in a way that best meets your user’s needs. The idea behind Polaris not being a ceiling is that you shouldn’t limit your ideas to fit into existing system pieces too early. Zoom out, figure out the best design solution to the problem, and then see if Polaris has all the pieces for you to design that solution. If there’s a gap, then [contribute](https://polaris.shopify.com/contributing) to the system to make it better.
12
12
13
13
## Zoom out
14
14
15
-
No matter what problem you're solving, zooming out allows you to get a better understanding of the problem, and its sphere of influence. A problem rarely exists in isolation, so understanding context and contributing factors is key before getting into solutions. Practically speaking, this means that you should understand the product as a whole, not just the product area you're working on.
15
+
No matter what problem you’re solving, zooming out allows you to get a better understanding of the problem, and its sphere of influence. A problem rarely exists in isolation, so understanding context and contributing factors is key before getting into solutions. Practically speaking, this means that you should understand the product as a whole, not just the product area you’re working on.
16
16
17
17
For instance, if you work on Orders, you should have a holistic understanding of the Shopify admin so you can leverage existing patterns and mental models. You can also gain context and empathy for merchants through research.
18
18
19
-
Merchants don't care about Shopify's internal organization. They use the admin as a whole, so we must design with the whole experience in mind.
19
+
Merchants don’t care about Shopify’s internal organization. They use the admin as a whole, so we must design with the whole experience in mind.
20
20
21
21

22
22
23
23
The Deliver team identified a need to consolidate 6 different tag components with varying UX that were doing the same job in different sections of the admin. The redundancy in components was causing a fractured user experience.
24
24
25
25
## Explore freely
26
26
27
-
When you understand the product as a whole, you should be well equipped to explore without constraints. That means don't start from our UI kit, component library, or patterns you see in the product---start with a blank sheet of paper instead. Solve the problem, preferably in more than one way, before you start worrying about consistency.
27
+
When you understand the product as a whole, you should be well equipped to explore without constraints. That means don’t start from our UI kit, component library, or patterns you see in the product---start with a blank sheet of paper instead. Solve the problem, preferably in more than one way, before you start worrying about consistency.
28
28
29
29

Copy file name to clipboardExpand all lines: polaris.shopify.com/content/contributing/documentation/index.md
+10-8Lines changed: 10 additions & 8 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -11,15 +11,15 @@ Shopify teams create documentation for polaris.shopify.com, but open source cont
11
11
12
12
To write effectively as a Shopify employee, use a cross-discipline lens. Make sure your content meets both UX and development needs. Before starting, check out our [style guide to the style guide](https://docs.google.com/document/d/1zVDsHIWhoir2svRjdtSdRbD_ruTz3K1nAJcQLGPVQwM/edit#heading=h.ni67tdntu9cr).
13
13
14
-
Most documentation about the design system is meant for polaris.shopify.com. However, there may be a reason for the content to live elsewhere. If you're not sure if something should live on this site, the Polaris team can help you figure that out.
14
+
Most documentation about the design system is meant for polaris.shopify.com. However, there may be a reason for the content to live elsewhere. If you’re not sure if something should live on this site, the Polaris team can help you figure that out.
15
15
16
16
## Making copy edits
17
17
18
18
Edits related to spelling, grammar, punctuation, or other typos should happen quickly and often. Both Shopify employees and open source contributors are welcome to submit copy edits.
19
19
20
20
To fix any copy issues on polaris.shopify.com, [open a pull request](/contributing/shipping-your-contribution#open-your-first-pr) in the [Shopify/polaris repo](https://github.com/Shopify/polaris) GitHub repo.
21
21
22
-
Note: If you find copy issues in other Polaris resources, follow the steps for that resource's contribution guidelines.
22
+
Note: If you find copy issues in other Polaris resources, follow the steps for that resource’s contribution guidelines.
23
23
24
24
## Updating documentation
25
25
@@ -36,16 +36,18 @@ New documentation in Polaris can range from component documentation, to content
36
36
37
37
To create new documentation:
38
38
39
-
1. Book office hours with Polaris to share your rationale for why you think this addition would improve the design system.
40
-
2. Once the Polaris team provides feedback, draft the content in Google docs for easy collaboration. We recommend writing in [Markdown](https://www.markdownguide.org/cheat-sheet/), or converting your file to Markdown when finished.
39
+
1. Reach out to the Polaris team and we can help you:
40
+
- strategize where to add the documentation
41
+
- offer strategies and templates for drafting your documentation
42
+
- provide asynchronous feedback
43
+
- offer ad hoc pair writing session when you get stuck
44
+
2. Draft the content in Google docs for easy collaboration. We recommend writing in [Markdown](https://www.markdownguide.org/cheat-sheet/), or converting your file to Markdown when finished.
41
45
3. Get feedback from subject matter experts, or someone with high context around your changes (team member, manager, etc.).
42
-
4. Reach out to the Polaris team again to review your changes for style guide alignment.
43
-
<br /> If on review of the initial proposal the Polaris team suggests that the content should live somewhere besides the Polaris site, you don't need to have the content reviewed for style guide alignment.
44
-
5.[Open a pull request](/contributing/shipping-your-contribution#open-your-first-pr) in the [Shopify/polaris repo](https://github.com/Shopify/polaris) GitHub repo.
46
+
4.[Open a pull request](/contributing/shipping-your-contribution#open-your-first-pr) in the [Shopify/polaris repo](https://github.com/Shopify/polaris) GitHub repo.
45
47
46
48
## Removing documentation
47
49
48
-
It's important that inaccurate or outdated information be removed as soon as possible. This helps maintain high trust in Polaris as a source of truth for design system guidance.
50
+
It’s important that inaccurate or outdated information be removed as soon as possible. This helps maintain high trust in Polaris as a source of truth for design system guidance.
Copy file name to clipboardExpand all lines: polaris.shopify.com/content/contributing/figma-ui-kit/index.md
+4-4Lines changed: 4 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -9,17 +9,17 @@ keywords:
9
9
10
10
Any designer that works at Shopify can contribute to the Figma UI Kit. If you find a bug to fix or your team is contributing new patterns or variants to Polaris React components, we want you to feel empowered to contribute.
11
11
12
-
Components, features, or patterns shouldn't be added to the Figma UI Kit if they are not part of Polaris React, as our goal is to keep Figma in sync with the code base. Only contributing changes to the Figma UI Kit when there's a counterpart in Polaris React prevents confusion and keeps tooling in sync across resources.
12
+
Components, features, or patterns shouldn’t be added to the Figma UI Kit if they are not part of Polaris React, as our goal is to keep Figma in sync with the code base. Only contributing changes to the Figma UI Kit when there’s a counterpart in Polaris React prevents confusion and keeps tooling in sync across resources.
13
13
14
14
1. Submit an issue in the [Shopify/polaris](https://github.com/Shopify/polaris/issues/new) GitHub repo, or assign yourself to [an existing issue](https://github.com/Shopify/polaris/labels/Figma%20UI%20Kit). Make sure to:
15
15
1. Assign yourself to the issue so it’s clear who is doing the work.
16
16
2. Add the "Figma UI Kit" label so we can easily find the issue.
17
17
3. Use a descriptive title.
18
-
4. Describe the change you're making in the issue itself.
18
+
4. Describe the change you’re making in the issue itself.
19
19
2. Create a branch in the Polaris Components Figma library.
20
-
<br /> - Give your branch a descriptive name, ideally using the GitHub issue number so it's easy to track.
20
+
<br /> - Give your branch a descriptive name, ideally using the GitHub issue number so it’s easy to track.
21
21
<br /> - For example, "[4963] Navigation design changes"
22
22
3. Make the necessary changes in the new branch.
23
23
4. Document all changes in the “Release Notes” page within the UI kit.
24
-
5. Add a design reviewer from the Polaris team to review the changes on your branch. If you aren't sure who to add, share the link to your Figma branch and ask for review in the #polaris Slack channel.
24
+
5. Add a design reviewer from the Polaris team to review the changes on your branch. If you aren’t sure who to add, share the link to your Figma branch and ask for review in the #polaris Slack channel.
25
25
6. Once reviewed and approved, the Polaris designer will merge your changes into the main branch and publish the updates.
0 commit comments