[ZOOT-1101][BpkDialogInner]: Adds optional aria-modal to the dialog

[michmaml]

Background:

It was discovered that it is possible to escape the modal with the screen reader. This can cause confusion if the content under the modal is unclear, and leaving the dialog may not be obvious, which can make travelers trapped behind an undismissable modal.

Action

In order to address the issue, it was decided to set an extra property to the modal that would prevent travelers from escaping the modal. To avoid breaking any other pages that use the modal, the property will be set as optional.

Changes

Fairly simple:

1. Added aria-modal={ariaModal} to the modal, which has the ariaModal value set to false by default.
2. Set the type of the variable as a boolean to prevent teams from setting the value to incorrect values.

Screen.Recording.2024-04-30.at.15.55.09.mov

---

• Ensure the PR title includes the name of the component you are changing so it's clear in the release notes for consumers of the changes in the version e.g [KOA-123][BpkButton] Updating the colour
• README.md (If you have created a new component)
• Component README.md
• Tests
• Storybook examples created/updated
• Type declaration (.d.ts) files updated
• For breaking changes or deprecating components/properties, migration guides added to the description of the PR. If the guide has large changes, consider creating a new Markdown page inside the component's docs folder and link it here

[github-actions]

	Warnings
⚠️	Package source files (e.g. packages/package-name/src/Component.js) were updated, but snapshots weren't. Have you checked that the tests still pass?
⚠️	Package source files (e.g. packages/package-name/src/Component.tsx) were updated, but type files weren't. Have you checked that no types have changed?

Browser support

If this is a visual change, make sure you've tested it in multiple browsers.

Generated by 🚫 dangerJS against 1c35ad1

[github-actions]

Visit https://backpack.github.io/storybook-prs/3400 to see this build running in a browser.

[github-actions]

Visit https://backpack.github.io/storybook-prs/3400 to see this build running in a browser.

[github-actions]

Visit https://backpack.github.io/storybook-prs/3400 to see this build running in a browser.

[github-actions]

Visit https://backpack.github.io/storybook-prs/3400 to see this build running in a browser.

[github-actions]

Visit https://backpack.github.io/storybook-prs/3400 to see this build running in a browser.