Repository: grommet/hpe-design-system
Pull request #5050: Added accessibility information for box
Author: login: julauxen
Created: 2025-04-16T09:58:38Z | Merged: 2025-04-17T16:15:43Z

<!--- Provide a general summary of the PR in the Title above -->

<!---
#### Notifications

[Update/New tag]Exact name of component/template

[name of the updated section within the guidance][Another update section]

[Message to fill the inline notification]

Example:
[Update]Accordion

[Accessibility]

[WCAG rule documentation added]
-->

<!--- Insert the PR's # for the deploy preview's URL -->
[Deploy Preview](https://deploy-preview-5050--keen-mayer-a86c8b.netlify.app/)

#### What does this PR do?
Adds accessibility information for Box

#### Where should the reviewer start?

#### What testing has been done on this PR?

In addition to the feature you are implementing, have you checked the following:

**General UX Checks**
- [ ] Small, medium, and large screen sizes
- [ ] Cross-browsers (FireFox, Chrome, and Safari)
- [ ] Light & dark modes
- [ ] All hyperlinks route properly

**Accessibility Checks**
- [ ] Keyboard interactions
- [ ] Screen reader experience
- [ ] Run WAVE accessibility plugin (Chrome)

**Code Quality Checks**
- [ ] Console is free of warnings and errors
- [ ] Passes E2E commit checks
- [ ] Visual snapshots are reasonable

#### How should this be manually tested?

#### Any background context you want to provide?

#### What are the relevant issues?
[#5012](https://github.com/grommet/hpe-design-system/issues/5012)

#### Screenshots (if appropriate)

#### Should this PR be mentioned in Design System updates?

#### Is this change backwards compatible or is it a breaking change?



Diff:
diff --git a/aries-site/src/data/structures/components.js b/aries-site/src/data/structures/components.js
index 57327cb24d..8c7156be7a 100644
--- a/aries-site/src/data/structures/components.js
+++ b/aries-site/src/data/structures/components.js
@@ -900,6 +900,7 @@ export const components = [
   },
   {
     name: 'Box',
+    accessibility: 'Passed WCAG 2.2 AAA',
     category: 'Layouts',
     description:
       'Boxes are containers that drive the layout of your content. Flexible props allow the behavior of content to be defined to optimize the user experience.',
diff --git a/aries-site/src/data/wcag/box.json b/aries-site/src/data/wcag/box.json
new file mode 100644
index 0000000000..8c0ca4ed9c
--- /dev/null
+++ b/aries-site/src/data/wcag/box.json
@@ -0,0 +1,506 @@
+[
+    {
+      "rule": "1.1.1",
+      "label": "Non-text content",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.1",
+      "label": "Audio-only and Video-only (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.2",
+      "label": "Captions (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.3",
+      "label": "Audio Description or Media Alternative (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.4",
+      "label": "Captions (Live)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.5",
+      "label": "Audio Description (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.6",
+      "label": "Sign Language (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.7",
+      "label": "Extended Audio Description (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.8",
+      "label": "Media Alternative (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.9",
+      "label": "Audio-only (Live)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.3.1",
+      "label": "Info and Relationships",
+      "status": "conditional",
+      "notes": "Use semantic HTML to structure content inside the Box (e.g., headings, forms, groups)."
+    },
+    {
+      "rule": "1.3.2",
+      "label": "Meaningful Sequence",
+      "status": "conditional",
+      "notes": "Ensure content inside the Box follows a logical order in both visual layout and HTML structure."
+    },
+    {
+      "rule": "1.3.3",
+      "label": "Sensory Characteristics",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.3.4",
+      "label": "Orientation",
+      "status": "passed",
+      "notes": ""
+    },
+    {
+      "rule": "1.3.5",
+      "label": "Identify Input Purpose",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.3.6",
+      "label": "Identify Purpose",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.1",
+      "label": "Use of Color",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.2",
+      "label": "Audio Control",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.3",
+      "label": "Contrast (Minimum)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.4",
+      "label": "Resize Text",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.5",
+      "label": "Images of Text",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.6",
+      "label": "Contrast (Enhanced)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.7",
+      "label": "Low or No Background Audio",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.8",
+      "label": "Visual Presentation",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.10",
+      "label": "Reflow",
+      "status": "conditional",
+      "notes": "Use flexible layouts (e.g. flexbox or grid) and test with zoom and small screen widths to ensure content reflows without clipping or requiring horizontal scroll."
+    },
+    {
+      "rule": "1.4.11",
+      "label": "Non-text Contrast",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.12",
+      "label": "Text Spacing",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.13",
+      "label": "Content on Hover or Focus",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "2.1.1",
+      "label": "Keyboard",
+      "status": "passed",
+      "notes": ""
+    },
+    {
+      "rule": "2.1.2",
+      "label": "No Keyboard Trap",
+      "status": "passed",
+      "notes": ""
+    },
+    {
+      "rule": "2.1.3",
+      "label": "Keyboard (No Exception)",
+      "status": "passed",
+      "notes": ""
+    },
+    {
+      "rule": "2.2.1",
+      "label": "Timing Adjustable",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "2.2.2",
+      "label": "Pause, Stop, Hide",
+      "status": "conditional",
+      "notes": "Provide a keyboard-accessible way to pause, stop, or hide any auto-updating or animated content."
+    },
+    {
+      "rule": "2.2.3",
+      "label": "No Timing",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "2.2.4",
+      "label": "Interruptions",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "2.2.5",
+      "label": "Re-authenticating",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "2.2.6",
+      "label": "Timeouts",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "2.3.1",
+      "label": "Three Flashes or Below Threshold",
+      "status": "conditional",
+      "notes": "If adding animation to Box, avoid or limit flashing 3 flashes per second."
+    },
+    {
+      "rule": "2.3.2",
+      "label": "Three Flashes",
+      "status": "conditional",
+      "notes": "If adding animation to Box, ensure there is no flashing."
+    },
+    {
+      "rule": "2.3.3",
+      "label": "Animation from Interactions",
+      "status": "conditional",
+      "notes": "If adding animation to Box, wrap it in logic that respects the prefers-reduced-motion media query and disables non-essential animations accordingly."
+    },
+    {
+      "rule": "2.4.1",
+      "label": "Bypass Blocks",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "2.4.2",
+      "label": "Page Titled",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "2.4.3",
+      "label": "Focus Order",
+      "status": "conditional",
+      "notes": "Ensure focusable elements within the Box follow a logical and predictable order, matching the visual layout."
+    },
+    {
+      "rule": "2.4.4",
+      "label": "Link Purpose (In Context)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "2.4.5",
+      "label": "Multiple Ways",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "2.4.6",
+      "label": "Headings and Labels",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "2.4.7",
+      "label": "Focus Visible",
+      "status": "passed",
+      "notes": ""
+    },
+    {
+      "rule": "2.4.8",
+      "label": "Location",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "2.4.9",
+      "label": "Link Purpose (Link Only)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "2.4.10",
+      "label": "Section Headings",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "2.4.11",
+      "label": "Focus Not Obscured (Minimum)",
+      "status": "passed",
+      "notes": ""
+    },
+    {
+      "rule": "2.4.12",
+      "label": "Focus Not Obscured (Enhanced)",
+      "status": "passed",
+      "notes": ""
+    },
+    {
+      "rule": "2.4.13",
+      "label": "Focus Appearance",
+      "status": "passed",
+      "notes": ""
+    },
+    {
+      "rule": "2.5.1",
+      "label": "Pointer Gestures",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "2.5.2",
+      "label": "Pointer Cancellation",
+      "status": "passed",
+      "notes": ""
+    },
+    {
+      "rule": "2.5.3",
+      "label": "Label in Name",
+      "status": "conditional",
+      "notes": "If the Box component is interactive, ensure it has an accessible name that conveys its purpose clearly to screen readers."
+    },
+    {
+      "rule": "2.5.4",
+      "label": "Motion Actuation",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "2.5.5",
+      "label": "Target Size (Enhanced)",
+      "status": "conditional",
+      "notes": "Ensure the Box component with an onClick property has a minimum clickable area of 44x44 pixels."
+    },
+    {
+      "rule": "2.5.6",
+      "label": "Concurrent Input Mechanisms",
+      "status": "passed",
+      "notes": ""
+    },
+    {
+      "rule": "2.5.7",
+      "label": "Dragging Movements",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "2.5.8",
+      "label": "Target Size (Minimum)",
+      "status": "conditional",
+      "notes": "Ensure the Box component with an onClick property has a minimum clickable area of 24�24 pixels."
+    },
+    {
+      "rule": "3.1.1",
+      "label": "Language of Page",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "3.1.2",
+      "label": "Language of Parts",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "3.1.3",
+      "label": "Unusual Words",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "3.1.4",
+      "label": "Abbreviations",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "3.1.5",
+      "label": "Reading Level",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "3.1.6",
+      "label": "Pronunciation",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "3.2.1",
+      "label": "On Focus",
+      "status": "passed",
+      "notes": ""
+    },
+    {
+      "rule": "3.2.2",
+      "label": "On Input",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "3.2.3",
+      "label": "Consistent Navigation",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "3.2.4",
+      "label": "Consistent Identification",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "3.2.5",
+      "label": "Change on Request",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "3.2.6",
+      "label": "Consistent Help",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "3.3.1",
+      "label": "Error Identification",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "3.3.2",
+      "label": "Labels or Instructions",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "3.3.3",
+      "label": "Error Suggestion",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "3.3.4",
+      "label": "Error Prevention (Legal, Financial, Data)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "3.3.5",
+      "label": "Help",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "3.3.6",
+      "label": "Error Prevention (All)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "3.3.7",
+      "label": "Redundant Entry",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "3.3.8",
+      "label": "Accessible Authentication (Minimum)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "3.3.9",
+      "label": "Accessible Authentication (Enhanced)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "4.1.2",
+      "label": "Name, Role, Value",
+      "status": "conditional",
+      "notes": "Ensure the Box component with an onClick property uses the correct ARIA role, provide a clear accessible name, and ensure state changes are announced."
+    },
+    {
+      "rule": "4.1.3",
+      "label": "Status Messages",
+      "status": "not-applicable",
+      "notes": ""
+    }
+  ]
diff --git a/aries-site/src/pages/components/box.mdx b/aries-site/src/pages/components/box.mdx
index 2563a20b51..e078e6d0c3 100644
--- a/aries-site/src/pages/components/box.mdx
+++ b/aries-site/src/pages/components/box.mdx
@@ -1,4 +1,4 @@
-import { Example } from '../../layouts';
+import { AccessibilitySection, Example } from '../../layouts';
 import { BoxExample } from '../../examples';
 
 <Example
@@ -9,3 +9,7 @@ import { BoxExample } from '../../examples';
 >
   <BoxExample />
 </Example>
+
+## Accessibility
+### WCAG compliance
+  <AccessibilitySection title='box' />


Reviews:
user: login: taysea
body: LGTM!
state: APPROVED
author_association: COLLABORATOR
submitted_at: 2025-04-16T22:16:31Z
user: login: britt6612
state: COMMENTED
author_association: COLLABORATOR
submitted_at: 2025-04-17T15:49:11Z
user: login: jcfilben
state: COMMENTED
author_association: COLLABORATOR
submitted_at: 2025-04-17T15:57:24Z
user: login: julauxen
state: COMMENTED
author_association: COLLABORATOR
submitted_at: 2025-04-17T15:57:48Z
user: login: britt6612
state: APPROVED
author_association: COLLABORATOR
submitted_at: 2025-04-17T16:02:10Z

Review comments:
diff_hunk: @@ -0,0 +1,512 @@
+[
+    {
+      "rule": "1.1.1",
+      "label": "Non-text content",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.1",
+      "label": "Audio-only and Video-only (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.2",
+      "label": "Captions (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.3",
+      "label": "Audio Description or Media Alternative (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.4",
+      "label": "Captions (Live)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.5",
+      "label": "Audio Description (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.6",
+      "label": "Sign Language (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.7",
+      "label": "Extended Audio Description (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.8",
+      "label": "Media Alternative (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.9",
+      "label": "Audio-only (Live)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.3.1",
+      "label": "Info and Relationships",
+      "status": "conditional",
+      "notes": "Use semantic HTML to structure content inside the Box (e.g., headings, forms, groups)."
+    },
+    {
+      "rule": "1.3.2",
+      "label": "Meaningful Sequence",
+      "status": "conditional",
+      "notes": "Ensure content inside the Box follows a logical order in both visual layout and HTML structure."
+    },
+    {
+      "rule": "1.3.3",
+      "label": "Sensory Characteristics",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.3.4",
+      "label": "Orientation",
+      "status": "passed",
+      "notes": ""
+    },
+    {
+      "rule": "1.3.5",
+      "label": "Identify Input Purpose",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.3.6",
+      "label": "Identify Purpose",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.1",
+      "label": "Use of Color",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.2",
+      "label": "Audio Control",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.3",
+      "label": "Contrast (Minimum)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.4",
+      "label": "Resize Text",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.5",
+      "label": "Images of Text",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.6",
+      "label": "Contrast (Enhanced)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.7",
+      "label": "Low or No Background Audio",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.8",
+      "label": "Visual Presentation",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.11",
path: aries-site/src/data/wcag/box.json
user: login: britt6612
body: looks like you have this rule twice
created_at: 2025-04-17T15:49:11Z
author_association: COLLABORATOR
diff_hunk: @@ -0,0 +1,512 @@
+[
+    {
+      "rule": "1.1.1",
+      "label": "Non-text content",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.1",
+      "label": "Audio-only and Video-only (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.2",
+      "label": "Captions (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.3",
+      "label": "Audio Description or Media Alternative (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.4",
+      "label": "Captions (Live)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.5",
+      "label": "Audio Description (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.6",
+      "label": "Sign Language (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.7",
+      "label": "Extended Audio Description (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.8",
+      "label": "Media Alternative (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.9",
+      "label": "Audio-only (Live)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.3.1",
+      "label": "Info and Relationships",
+      "status": "conditional",
+      "notes": "Use semantic HTML to structure content inside the Box (e.g., headings, forms, groups)."
+    },
+    {
+      "rule": "1.3.2",
+      "label": "Meaningful Sequence",
+      "status": "conditional",
+      "notes": "Ensure content inside the Box follows a logical order in both visual layout and HTML structure."
+    },
+    {
+      "rule": "1.3.3",
+      "label": "Sensory Characteristics",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.3.4",
+      "label": "Orientation",
+      "status": "passed",
+      "notes": ""
+    },
+    {
+      "rule": "1.3.5",
+      "label": "Identify Input Purpose",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.3.6",
+      "label": "Identify Purpose",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.1",
+      "label": "Use of Color",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.2",
+      "label": "Audio Control",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.3",
+      "label": "Contrast (Minimum)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.4",
+      "label": "Resize Text",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.5",
+      "label": "Images of Text",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.6",
+      "label": "Contrast (Enhanced)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.7",
+      "label": "Low or No Background Audio",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.8",
+      "label": "Visual Presentation",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.11",
path: aries-site/src/data/wcag/box.json
user: login: jcfilben
body: Nice catch @britt6612. Once this is fixed, good to merge. Everything else looked good
created_at: 2025-04-17T15:57:24Z
author_association: COLLABORATOR
diff_hunk: @@ -0,0 +1,512 @@
+[
+    {
+      "rule": "1.1.1",
+      "label": "Non-text content",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.1",
+      "label": "Audio-only and Video-only (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.2",
+      "label": "Captions (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.3",
+      "label": "Audio Description or Media Alternative (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.4",
+      "label": "Captions (Live)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.5",
+      "label": "Audio Description (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.6",
+      "label": "Sign Language (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.7",
+      "label": "Extended Audio Description (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.8",
+      "label": "Media Alternative (Prerecorded)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.2.9",
+      "label": "Audio-only (Live)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.3.1",
+      "label": "Info and Relationships",
+      "status": "conditional",
+      "notes": "Use semantic HTML to structure content inside the Box (e.g., headings, forms, groups)."
+    },
+    {
+      "rule": "1.3.2",
+      "label": "Meaningful Sequence",
+      "status": "conditional",
+      "notes": "Ensure content inside the Box follows a logical order in both visual layout and HTML structure."
+    },
+    {
+      "rule": "1.3.3",
+      "label": "Sensory Characteristics",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.3.4",
+      "label": "Orientation",
+      "status": "passed",
+      "notes": ""
+    },
+    {
+      "rule": "1.3.5",
+      "label": "Identify Input Purpose",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.3.6",
+      "label": "Identify Purpose",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.1",
+      "label": "Use of Color",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.2",
+      "label": "Audio Control",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.3",
+      "label": "Contrast (Minimum)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.4",
+      "label": "Resize Text",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.5",
+      "label": "Images of Text",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.6",
+      "label": "Contrast (Enhanced)",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.7",
+      "label": "Low or No Background Audio",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.8",
+      "label": "Visual Presentation",
+      "status": "not-applicable",
+      "notes": ""
+    },
+    {
+      "rule": "1.4.11",
path: aries-site/src/data/wcag/box.json
user: login: julauxen
body: Thanks, I deleted the repeated rule
created_at: 2025-04-17T15:57:48Z
author_association: COLLABORATOR

PR comments:
user: login: changeset-bot[bot]
created_at: 2025-04-16T09:58:42Z
body: ###  ⚠️  No Changeset found

Latest commit: e2e651bf855c963227d38dddcb7e7a1c14e36e96

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. **If these changes should result in a version bump, you need to add a changeset.**

<details><summary>This PR includes no changesets</summary>

  When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

</details>

[Click here to learn what changesets are, and how to add one](https://github.com/changesets/changesets/blob/main/docs/adding-a-changeset.md).

[Click here if you're a maintainer who wants to add a changeset to this PR](https://github.com/grommet/hpe-design-system/new/box-accessibility-information?filename=.changeset/chilly-flies-try.md&value=---%0A%22aries-site%22%3A%20patch%0A---%0A%0AAdded%20accessibility%20information%20for%20box%0A)


author_association: NONE
user: login: netlify[bot]
created_at: 2025-04-16T09:58:55Z
body: ### <span aria-hidden="true">✅</span> Deploy Preview for *hpe-theme-preview* ready!


|  Name | Link |
|:-:|------------------------|
|<span aria-hidden="true">🔨</span> Latest commit | e2e651bf855c963227d38dddcb7e7a1c14e36e96 |
|<span aria-hidden="true">🔍</span> Latest deploy log | https://app.netlify.com/sites/hpe-theme-preview/deploys/680124bd9d59f40008a4f3d6 |
|<span aria-hidden="true">😎</span> Deploy Preview | [https://deploy-preview-5050--hpe-theme-preview.netlify.app](https://deploy-preview-5050--hpe-theme-preview.netlify.app) |
|<span aria-hidden="true">📱</span> Preview on mobile | <details><summary> Toggle QR Code... </summary><br /><br />![QR Code](https://app.netlify.com/qr-code/eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1cmwiOiJodHRwczovL2RlcGxveS1wcmV2aWV3LTUwNTAtLWhwZS10aGVtZS1wcmV2aWV3Lm5ldGxpZnkuYXBwIn0.yrAv9pCVnWDWeunT-dzzlKDW1ePBlL3i77YSEoPSlZ4)<br /><br />_Use your smartphone camera to open QR code link._</details> |
---
<!-- [hpe-theme-preview Preview](https://deploy-preview-5050--hpe-theme-preview.netlify.app) -->
_To edit notification comments on pull requests, go to your [Netlify site configuration](https://app.netlify.com/sites/hpe-theme-preview/configuration/notifications#deploy-webhooks)._
author_association: NONE
user: login: netlify[bot]
created_at: 2025-04-16T09:58:57Z
body: ### <span aria-hidden="true">✅</span> Deploy Preview for *unrivaled-bublanina-3a9bae* ready!


|  Name | Link |
|:-:|------------------------|
|<span aria-hidden="true">🔨</span> Latest commit | e2e651bf855c963227d38dddcb7e7a1c14e36e96 |
|<span aria-hidden="true">🔍</span> Latest deploy log | https://app.netlify.com/sites/unrivaled-bublanina-3a9bae/deploys/680124bdf7772300081ac69a |
|<span aria-hidden="true">😎</span> Deploy Preview | [https://deploy-preview-5050--unrivaled-bublanina-3a9bae.netlify.app](https://deploy-preview-5050--unrivaled-bublanina-3a9bae.netlify.app) |
|<span aria-hidden="true">📱</span> Preview on mobile | <details><summary> Toggle QR Code... </summary><br /><br />![QR Code](https://app.netlify.com/qr-code/eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1cmwiOiJodHRwczovL2RlcGxveS1wcmV2aWV3LTUwNTAtLXVucml2YWxlZC1idWJsYW5pbmEtM2E5YmFlLm5ldGxpZnkuYXBwIn0.pqdXGgIj2jMGJ_ErOtWSX7LeNjwCPCF4tQyjnLHpDGQ)<br /><br />_Use your smartphone camera to open QR code link._</details> |
---
<!-- [unrivaled-bublanina-3a9bae Preview](https://deploy-preview-5050--unrivaled-bublanina-3a9bae.netlify.app) -->
_To edit notification comments on pull requests, go to your [Netlify site configuration](https://app.netlify.com/sites/unrivaled-bublanina-3a9bae/configuration/notifications#deploy-webhooks)._
author_association: NONE
user: login: britt6612
created_at: 2025-04-17T15:53:58Z
body: @julauxen one small comment otherwise looks good!
author_association: COLLABORATOR