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

[1Copenut]

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

• [EuiModal] Adjust the source order to announce EuiTitle before Close button #7222

WCAG or Vendor Guidance (optional)

• SC 1.3.2: Meaningful Sequence (Level A)

Screenshots or Trace Logs

[itzabhinavarya]

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]

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]

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

[github-actions]

👋 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.