2025-03-19 Meeting notes

Datatable isEntireTableSelected flag behavior

Hamzah

• When user filters in a DataTable, the result dataset only includes a handful of row(s), the row(s) are all selected, the filters are removed… the entire table’s rows are all selected incorrectly.

• Bug fix implemented.

• Sanity checked expected behavior.

• “n shown below” wording might be less than ideal

  • Maybe “n shown on current page”?

• Bug fix against release-22.x

  • Sync with release-23.x and next afterwards

• Next steps:

  • Backlog an issue to document broader changes around selections for a11y/usability.

box-shadow-sm/ box-shadow-lg

@Brian Smith

• Based on https://openedx.slack.com/archives/C071U9E4VNV/p1742369144675249?thread_ts=1742352614.102629&cid=C071U9E4VNV it sound like we should update them to be compound tokens?

  • Token already compound token, SCSS variable currently implemented without using the compound token

  • Need to update SCSS var to use compound token

Design tokens progress update

@Brian Smith

• https://github.com/openedx/platform-roadmap/issues/393

  • frontend-component-header PR landed!

• Target date to cutover to design tokens by Teak cutoff (~1 month).

  • Cutoff: April 9, 2025

  • https://docs.openedx.org/en/latest/community/release_notes/teak/dev_op_release_notes.html

• Open Q:

  • frontend-lib-learning-assistant

  • If timing alignment seems to be an issue, we should get ahead of this sooner than later.

  • @Adam Stankiewicz we will discuss at 2U FedX meeting to discuss timing.

Form.Control and autofill

@Adam Stankiewicz

[update] https://github.com/openedx/paragon/pull/3451#issuecomment-2733784240

A CSS-only solution was proposed, which makes sense to me.

Form.Control.Feedback

@Adam Stankiewicz

What are a11y requirements / best practices around form validation messages, e.g. aria-invalid?

https://paragon-openedx.netlify.app/components/form/form-control-feedback/

Might we need to improve the Form.Control.Feedback?

Example a11y recommendations from react-hook-form: Advanced Usage

• Different size forms have different a11y requirements (1 field vs 10 fields) as well as required vs non-required (tabbing through form causes onBlur announcements to interrupt navigation)

Next steps:

• Create GH issue to backlog an update to draft best practices / usage guidelines around form validation wrt ARIA roles, etc. (e.g., aria-invalid="true").

  • E.g., document 3 common form use cases.