2024-01-10 Meeting notes

15 minutes

Paragon maintainership handoffs

@Adam Stankiewicz

2U/edX is handing off maintainership to Axim more formally. Part of this includes ensuring the following handoff items are discussed.

• Netlify

  • https://openedx.atlassian.net/wiki/spaces/BPL/pages/3105521713

• GitHub user (edx-netlify)

• Algolia DocSearch

• Segment

  • Tracks user engagement and CLI tools

  • Segment key is tied to 2U source

Notes:

• [Brian] Axim can use existing or new GitHub user

• [Brian] The main goal is to drive more community contribution to Paragon, with Brian taking on the responsibilities or leading that effort

• [Brian] PWG will remain, but we want more people to get involved in the design system

• Might be helpful to have a base theme Figma that Open edX consumers can leverage

• “Load a theme” instead of having a theme switcher in the future

•  

Next steps:

• Brian working with Adolfo to find contributions, especially design tokens

• Gabe attend next Product Working Group

5 min

List height in the Dropdown component

@Vladyslav Zadorozhnii

https://github.com/openedx/paragon/issues/2988

• [Gabe] Q: how is the default height of the Dropdown determined?

  • Is it determined by maximum number of visible dropdown items? More nuanced, e.g. never taller than the viewport?

  • [Vlad] Should this be responsive? E.g., 5 items for mobile-sized viewport; 10 items for desktop.

  • Might be worth testing in mobile specifically.

• [Brian] Screen width can be large while having a narrow height. Our breakpoints are width-only.

  • [Ben]: narrow height probably not as big of a concern.

  • Should we simplify to just pick a constant number?

• [Adam] What about responsiveness based on the container the Dropdown is rendered in? Rendered container width !== always equal viewport responsiveness.

• [Brian] Are there existing use cases of Dropdown in platform today we could draw from as prior art?

• [Ben] semantic ui provides decent Dropdown examples to compare against our Bootstrap-based Dropdown.

  • See screenshots on the GitHub issue from semantic-ui's handling of Dropdown responsiveness.

  • https://semantic-ui.com/modules/dropdown.html#compact

• [Mahdiye] Are there alternative UI paradigms to consider here?

  • Q: Is there a search box within Dropdown?

    • Yes? Actually, no. Some consumers extend Dropdown to include a custom search, but this is not upstream in Paragon itself.

    • How does this relate to usage guidelines around Form.Autosuggest? Should the “max number of items displayed” consideration apply to Form.Autosuggest as well.

• Tenative decision: reduce number of items displayed in Dropdown based on responsiveness. Details TBD.

5 mins

ModalDialog overflow

@Brian Smith

• [Gabe] Any mobile/responsiveness considerations where the overflow could cut off?