[EuiFlyout] Adjust the source order to announce `EuiTitle` before Close button

1Copenut commented 9 months ago

Describe the problem

@kyrspl && @cee-chen are making a dismiss (close) button to EuiCallout in #7156. They proposed moving the heading (title) before the dismiss button in the source order so screen reader users could hear the message heading before deciding to dismiss the callout. I seconded this approach and suggested we should update EuiModal to have this same source order.

Proposed solution

! EuiFlyout lines 413-426
! https://github.com/elastic/eui/blob/main/src/components/flyout/flyout.tsx#L413C12-L426C12

<Element ...{props}>
  {!isPushed && screenReaderDescription}
! Potentially add a prop to ignore this Close button if a header exists
! Could be something like `hasHeader` that renders the button inside `EuiHeader`  {closeButton}
  {children}
</Element>

Related issues

7222

WCAG or Vendor Guidance (optional)

SC 1.3.2: Meaningful Sequence (Level A)

Screenshots or Trace Logs

itzabhinavarya commented 9 months ago

Hello @cee-chen Sir, Can you please explain this task to me and assign it to me. I want to make contribution in this issue, I request you to please elaborate about this issue in details and assign it to me.

cee-chen commented 8 months ago

Hey @itzabhinavarya! If it's not clear to you how to solve an issue from the existing PR, please feel free to take a look at another good fist issue or low hanging fruit that you do know how to solve. EUI at this point is not necessarily a beginner-friendly repo, and we ask that interested contributors pick issues within the scope of their abilities.

itzabhinavarya commented 8 months ago

@cee-chen Sir,Thank you. Now i'll look at those issue on which i have good command. Thank you for guide.

github-actions[bot] commented 2 months ago

👋 Hi there - this issue hasn't had any activity in 6 months. If the EUI team has not explicitly expressed that this is something on our roadmap, it's unlikely that we'll pick this issue up. We would sincerely appreciate a PR/community contribution if this is something that matters to you! If not, and there is no further activity on this issue for another 6 months (i.e. it's stale for over a year), the issue will be auto-closed.

elastic / eui