From f85b34f41a898ffbd39bb5c0401155086a6330e5 Mon Sep 17 00:00:00 2001
From: Ryan Smith <100248909+rsmithadhoc@users.noreply.github.com>
Date: Mon, 10 Mar 2025 12:30:23 -0400
Subject: [PATCH 1/2] Checkbox aria checked (#1514)

* Testing output values

* Remove this

* Set aria-checked to null when not indeterminate or checked

* Add test
---
 .../components/va-checkbox/test/va-checkbox.e2e.ts    | 10 ++++++++++
 .../src/components/va-checkbox/va-checkbox.tsx        | 11 ++++++++++-
 2 files changed, 20 insertions(+), 1 deletion(-)

diff --git a/packages/web-components/src/components/va-checkbox/test/va-checkbox.e2e.ts b/packages/web-components/src/components/va-checkbox/test/va-checkbox.e2e.ts
index 26141d30f..2d51a4089 100644
--- a/packages/web-components/src/components/va-checkbox/test/va-checkbox.e2e.ts
+++ b/packages/web-components/src/components/va-checkbox/test/va-checkbox.e2e.ts
@@ -284,6 +284,16 @@ describe('va-checkbox', () => {
     expect(checkboxEl).toEqualAttribute('aria-checked', 'mixed');
   });
 
+  it('does not set aria-checked when toggled off', async () => {
+    const page = await newE2EPage();
+    await page.setContent(
+      '<va-checkbox label="Just another checkbox here" />',
+    );
+    const checkboxEl = await page.find('va-checkbox >>> input');
+
+    expect(checkboxEl).not.toHaveAttribute('aria-checked');
+  });
+
   it('does not set the data-indeterminate attribute if checked is set', async () => {
     const page = await newE2EPage();
     await page.setContent(
diff --git a/packages/web-components/src/components/va-checkbox/va-checkbox.tsx b/packages/web-components/src/components/va-checkbox/va-checkbox.tsx
index 87ef35023..7fa1ff74d 100644
--- a/packages/web-components/src/components/va-checkbox/va-checkbox.tsx
+++ b/packages/web-components/src/components/va-checkbox/va-checkbox.tsx
@@ -232,6 +232,15 @@ export class VaCheckbox {
         .join(' ')
         // Return null so we don't add the attribute if we have an empty string
         .trim() || null;
+    
+    let ariaChecked: boolean | string | null;
+    if (indeterminate && !checked) {
+      ariaChecked = 'mixed';
+    } else if (!indeterminate && !checked) {
+      ariaChecked = null;
+    } else {
+      ariaChecked = checked;
+    }
 
     return (
       <Host>
@@ -266,7 +275,7 @@ export class VaCheckbox {
             aria-invalid={error ? 'true' : 'false'}
             disabled={disabled}
             data-indeterminate={indeterminate && !checked}
-            aria-checked={indeterminate && !checked ? 'mixed' : checked}
+            aria-checked={ariaChecked}
           />
           <label htmlFor="checkbox-element" class="va-checkbox__label">
             <span part="label">{label}</span>&nbsp;

From 9baa5d38cd590b4a54c7d6dfb2a83ba6d08bbde5 Mon Sep 17 00:00:00 2001
From: Jami Gibbs <jami.gibbs@adhocteam.us>
Date: Mon, 10 Mar 2025 12:44:36 -0500
Subject: [PATCH 2/2] Capitalize first letter in button and cleanup (#1518)

---
 .../stories/va-checkbox-group-uswds.stories.jsx        |  4 ++--
 .../stories/va-memorable-date-uswds.stories.jsx        | 10 ++++------
 packages/storybook/stories/va-radio-uswds.stories.jsx  |  5 ++---
 packages/storybook/stories/va-select-uswds.stories.jsx |  2 +-
 .../storybook/stories/va-text-input-uswds.stories.jsx  |  6 ++----
 .../storybook/stories/va-textarea-uswds.stories.jsx    | 10 ++++------
 6 files changed, 15 insertions(+), 22 deletions(-)

diff --git a/packages/storybook/stories/va-checkbox-group-uswds.stories.jsx b/packages/storybook/stories/va-checkbox-group-uswds.stories.jsx
index 420dbfc6b..74537c2db 100644
--- a/packages/storybook/stories/va-checkbox-group-uswds.stories.jsx
+++ b/packages/storybook/stories/va-checkbox-group-uswds.stories.jsx
@@ -285,7 +285,7 @@ const FormsPatternMultipleTemplate = ({
         />
       </va-checkbox-group>
       <hr />
-      <va-button text="click to focus header" onClick={handleClick} uswds={false}></va-button>
+      <va-button text="Click to focus header" onClick={handleClick}></va-button>
     </>
   );
 };
@@ -349,7 +349,7 @@ const FormsPatternSingleTemplate = ({
 
       <hr />
 
-      <va-button text="click to focus header" onClick={handleClick} uswds={false}></va-button>
+      <va-button text="Click to focus header" onClick={handleClick}></va-button>
     </>
   );
 };
diff --git a/packages/storybook/stories/va-memorable-date-uswds.stories.jsx b/packages/storybook/stories/va-memorable-date-uswds.stories.jsx
index 77467c13e..ec5e68e67 100644
--- a/packages/storybook/stories/va-memorable-date-uswds.stories.jsx
+++ b/packages/storybook/stories/va-memorable-date-uswds.stories.jsx
@@ -173,9 +173,8 @@ const FormsPatternSingleTemplate = ({ label, name, hint, required, error, value,
       <hr />
 
       <va-button 
-        text="click to focus header" 
-        onClick={handleClick}
-        uswds={false}>
+        text="Click to focus header" 
+        onClick={handleClick}>
       </va-button>
     </>
   );
@@ -224,9 +223,8 @@ const FormsPatternMultipleTemplate = ({ label, name, hint, required, error, valu
       <hr />
 
       <va-button 
-        text="click to focus header" 
-        onClick={handleClick}
-        uswds={false}>
+        text="Click to focus header" 
+        onClick={handleClick}>
       </va-button>
     </>
   );
diff --git a/packages/storybook/stories/va-radio-uswds.stories.jsx b/packages/storybook/stories/va-radio-uswds.stories.jsx
index 2c006ee0a..27571c9fe 100644
--- a/packages/storybook/stories/va-radio-uswds.stories.jsx
+++ b/packages/storybook/stories/va-radio-uswds.stories.jsx
@@ -331,9 +331,8 @@ const FormsPatternMultipleTemplate = ({ label, required }) => {
 
       <hr />
       <va-button
-        text="click to focus header"
+        text="Click to focus header"
         onClick={handleClick}
-        uswds={false}
       ></va-button>
     </>
   );
@@ -387,7 +386,7 @@ const FormsPatternSingleTemplate = ({
 
       <hr />
 
-      <va-button text="click to focus header" onClick={handleClick} uswds={false}></va-button>
+      <va-button text="Click to focus header" onClick={handleClick}></va-button>
     </>
   );
 };
diff --git a/packages/storybook/stories/va-select-uswds.stories.jsx b/packages/storybook/stories/va-select-uswds.stories.jsx
index b80a447bc..63cd8b85f 100644
--- a/packages/storybook/stories/va-select-uswds.stories.jsx
+++ b/packages/storybook/stories/va-select-uswds.stories.jsx
@@ -286,7 +286,7 @@ const FormsPatternSingleTemplate = args => {
       <hr />
 
       <va-button
-        text="click to focus header"
+        text="Click to focus header"
         onClick={handleClick}
       ></va-button>
     </>
diff --git a/packages/storybook/stories/va-text-input-uswds.stories.jsx b/packages/storybook/stories/va-text-input-uswds.stories.jsx
index ced59968d..9701eed81 100644
--- a/packages/storybook/stories/va-text-input-uswds.stories.jsx
+++ b/packages/storybook/stories/va-text-input-uswds.stories.jsx
@@ -259,9 +259,8 @@ const FormsPatternMultipleTemplate = ({ name, value, uswds }) => {
       <va-text-input name={name} label="Email address" value={value} />
       <hr />
       <va-button
-        text="click to focus header"
+        text="Click to focus header"
         onClick={handleClick}
-        uswds={false}
       ></va-button>
     </>
   );
@@ -304,9 +303,8 @@ const FormsPatternSingleTemplate = ({ name, value, error }) => {
       <hr />
 
       <va-button
-        text="click to focus header"
+        text="Click to focus header"
         onClick={handleClick}
-        uswds={false}
       ></va-button>
     </>
   );
diff --git a/packages/storybook/stories/va-textarea-uswds.stories.jsx b/packages/storybook/stories/va-textarea-uswds.stories.jsx
index 89491a93c..244e2b3e8 100644
--- a/packages/storybook/stories/va-textarea-uswds.stories.jsx
+++ b/packages/storybook/stories/va-textarea-uswds.stories.jsx
@@ -153,9 +153,8 @@ const FormsPatternSingleTemplate = ({
       <hr />
 
       <va-button 
-        text="click to focus header" 
-        onClick={handleClick}
-        uswds={false}>
+        text="Click to focus header" 
+        onClick={handleClick}>
       </va-button>
     </>
   );
@@ -230,9 +229,8 @@ const FormsPatternMultipleTemplate = ({
       <hr />
 
       <va-button 
-        text="click to focus header"
-        onClick={handleClick}
-        uswds={false}>
+        text="Click to focus header"
+        onClick={handleClick}>
       </va-button>
     </>
   );