The three statuses above and their possible values:

For more information see the https://openedx.atlassian.net/wiki/spaces/BPL/pages/1773502564/Component+Contribution+Process#Step-1-%E2%80%93-Start-a-component-proposal.

Chips are compact elements that represent an input, attribute, or action.

Contributors

Bronwyn Hawkins (Deactivated) Jon F

Slack channel

If one exists, paste a link to the working Slack channel...

Paragon Jira ticket

https://openedx.atlassian.net/browse/PAR-437

Other Jira tickets

Insert links to related work...

Design resources

Insert links to Figma or Miro design specs or explorations...

Technical docs

Insert a link to the tech docs when they are created...

Design

material.io/components/chips

Use case example: 3 chips appearing under a form field allow a user to choose a username.

https://www.figma.com/file/0uBm1o7nH2ExePrRXGvB7Z/Logistration?node-id=1071%3A15033

(blue star) Variants

https://www.figma.com/file/eGmDp94FlqEr4iSqy1Uc1K/Paragon-2021?node-id=10237%3A36310

(blue star) Best Practices

Do

  • Do have an interactive element in a chip

  • Do use the Dark variant against dark backgrounds

Don't

  • Don’t have more than 1 interactive element in a chip

  • Don’t use the Dark variant against light backgrounds

(blue star) Related Components

Similar to the Badge component, but interactive.

(blue star) Specification

What does an engineer need to know in order to build this component?

Redlined Design Spec

Paste a link to a Figma frame here and choose "Display as embed"...

(blue star) Behaviors

Add rows to this table outlining individual behaviors of the component.

Descriptions of a behavior should contain any specification detail needed to build it, including animation timing.

(blue star) Accessibility

Add rows to the table outlining focus management, semantic markup, or other a11y related specifications...

Notes

Notes from collaborator conversations or meetings regarding this component.

XX.XX.20XX