Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 7 Next »

Establish: Paragon Working Group

  • Representatives:
    • A Frontend Engineer from as many themes as possible
    • A11y (Jeff)
    • (UX) UI/Vis Designer
    • ... (get suggestions for others required)
  • Meeting:
    • Bi-weekly, 1 hour
    • Purpose: discuss issues, desired features, distribute workload

Phase 1: Project Tune Up

"Reset" GreenKeeper

  • Upgrade project dependencies to current versions (prefer an all-at-once approach)
  • Delete Greenkeeper PRs and Issues
  • Ensure Greenkeeper is configured properly
    • Evaluate Renovate as replacement

Clear Stale Issues, PRs, Branches

  • Old issues may be valid, but we will take this opportunity to reset our vision
  • There are 14 Pages of Stale Branches
  • 5 pages of active branches, mostly greenkeeper
  • Clear project board

Upgrade linters to match current MFEs

Get a11y review to understand baseline

Phase 2: Minor Updates

Let's work on all non-breaking improvements we can.

  • Add per-component npm package exports
    • Support today's import @edx/paragon and also @edx/paragon-{componentName}
      • Look at "Bit"
  • Streamline exported package (today including a component from Paragon may add about 500kb to build)
    • Tree shaking
  • Swap icons to use FontAwesome React inline SVG: https://github.com/edx/paragon/issues/347
  • Storybook should style with edx-bootstrap v2 theme
  • Add more components with Reactstrap (non-breaking additions)
    • Add passthrough components
    • be judicious about what components we add to augment the library.
  • Docs
    • combine with edx bootstrap, do work to sort out best way to do this.
  • Component Interface Cleanup (maintain backwards compatibility)
    • Paragon components should have similar consistent props
    • write down decisions on naming. WOOw
  • Stop auto-generating ids on things where it doesn't make sense (i.e. <Icon />)
  • Support i18n
  • Analytics
  • remove hardcoded English labels


Major/Minor Grey Area

  • Stop using content in a component for aria-labels. They should be required when it makes sense, but not made for you.

Phase 3: Major Updates

All breaking improvements.

  • Remove build targets themeable and static. Lose support for use in legacy applications.
  • Simplify the ways styles are added in Paragon
    • Prefer class strings over imported style objects
    • Remove includes of scss in .jsx files
  • Remove backwards compatibility for legacy props
  • remove asInput()
  • Open Issues (with proposed breaking changes)
  • Leverage Reactstrap (breaking change implementations)
    • Where appropriate swap Paragon implementations with Reactstrap passthroughs/wrappers.


  • No labels