Page Comparison

5 min

a11y table is in progress

Vladyslav Zadorozhnii

• Accessibility (a11y) Documentation

Notes:

• Thank you Vladyslav Zadorozhnii !!

• Intent is to put a11y info as a table on component pages on the Paragon docs site.

• Will need to think through where/how we want to display the a11y table on component pages.

• Also plan on including “Dos” and “Dont's” later on, too.

• Jeff Witt may be able add additional details for “why”.

• How should the table of a11y documentation be folded in with more context or explanation for the various components

• Some inspiring solutions from other design systems:

  • https://polaris.shopify.com/foundations/accessibility

  • https://m2.material.io/design/usability/accessibility.html#hierarchy

  • https://design.gs.com/foundation/accessibility

  • https://designsystem.digital.gov/design-principles/#embrace-accessibility

5 min

Rating component

Vladyslav Zadorozhnii

https://mui.com/material-ui/react-rating/ (This component has Jeff’s and Matt’s blessing)
Notes:

• What use cases are there for star ratings today?

  • [Kaleb] Rating system is on the growth theme’s roadmap

  • [Adam] maybe a use case in enterprise

• We need to consider all of the states (focus, hover, selected, etc)

• Should it only be stars or should it have more customization/props options? Icon options, label options, etc?

• [Matt] Tab order, arrow key controls, enter key controls

• Sounds like something we should consider, but likely something to re-consider once the use case(s) are more known.

  • There is a possible upcoming use case for a “Search+Discover” project around course ratings.

  • Designer(s) working on that project can spec out component, and make the formal component proposal then.

Icons

Kaleb Davenport

Notes:

• Extra small icon is not officially supported inside IconButton, because it needs a touch/click target size of 24x24.

• If its not clickable it doesn't need the 24x24 sizing.

• Kaleb may come next PWG with screenshots of use cases for further discussion.

MegaMenu

Jeff Witt

Notes:

• Are we going to include mega menu as a paragon component?

  • Will/should mega menu be compatible with Paragon’s Navbar component (still WIP)?

• Nested menu

  • Should our existing Menu component support nested menus?

• Consider Open edX and the need for this outside of edX

• Home in on use cases and best practice

• Would be nice to get more code and design reuse for headers in the LMS and edX.org ++

  • Should frontend-component-header (and edX.org’s frontend-component-header-edx, etc.) use Paragon Navbar component instead?

  • Should result in less duplicate, copy/pasted code across header repos that’s more easily maintained.

Accessible charts

Jeff Witt

User testing soon for accessible charts with Plotly, open to observers. Contact Jeff Witt to get involved.

Video.js

Jeff Witt

Any way/ideas to reduce this npm size?