From 7a5a2c013aac0723c070255e6f6e1790439f7f4a Mon Sep 17 00:00:00 2001 From: labkey-susanh Date: Tue, 2 Jun 2026 09:09:22 -0700 Subject: [PATCH 1/8] More misc accessibility improvements for color contrast and empty buttons --- packages/components/package-lock.json | 4 ++-- packages/components/package.json | 2 +- packages/components/releaseNotes/components.md | 7 +++++++ .../src/internal/components/ExpandableContainer.tsx | 4 +++- .../src/internal/components/buttons/RemoveEntityButton.tsx | 3 ++- packages/components/src/theme/form.scss | 3 +++ packages/components/src/theme/navbar.scss | 4 ++-- packages/components/src/theme/settings.scss | 2 +- packages/components/src/theme/utils.scss | 6 ++++++ packages/components/src/theme/variables.scss | 1 + 10 files changed, 28 insertions(+), 8 deletions(-) diff --git a/packages/components/package-lock.json b/packages/components/package-lock.json index 4960217ef5..d8cd4df3f2 100644 --- a/packages/components/package-lock.json +++ b/packages/components/package-lock.json @@ -1,12 +1,12 @@ { "name": "@labkey/components", - "version": "7.40.0", + "version": "7.40.1-miscAssessibilityFixes.0", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@labkey/components", - "version": "7.40.0", + "version": "7.40.1-miscAssessibilityFixes.0", "license": "SEE LICENSE IN LICENSE.txt", "dependencies": { "@hello-pangea/dnd": "18.0.1", diff --git a/packages/components/package.json b/packages/components/package.json index 44b6b4b2c1..fb7aad477f 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -1,6 +1,6 @@ { "name": "@labkey/components", - "version": "7.40.0", + "version": "7.40.1-miscAssessibilityFixes.0", "description": "Components, models, actions, and utility functions for LabKey applications and pages", "sideEffects": false, "files": [ diff --git a/packages/components/releaseNotes/components.md b/packages/components/releaseNotes/components.md index 4aeffd5135..0657d97859 100644 --- a/packages/components/releaseNotes/components.md +++ b/packages/components/releaseNotes/components.md @@ -1,6 +1,13 @@ # @labkey/components Components, models, actions, and utility functions for LabKey applications and pages +### version TBD +*Released*: TBD +- More misc. accessibility improvements + - Fix empty buttons for `ExpandableContainer` and `RemoveEntityButton` + - Fix color contrast for `.name-id-setting__prefix-example`, `.container-nav` and `.lk-version-nav` + - Fix color contrast for `.sr-only` to avoid false positives from WAVE + ### version 7.40.0 *Released*: 28 May 2026 - Calculated Column Assistant diff --git a/packages/components/src/internal/components/ExpandableContainer.tsx b/packages/components/src/internal/components/ExpandableContainer.tsx index c3c8fe5c79..335ae3c2a5 100644 --- a/packages/components/src/internal/components/ExpandableContainer.tsx +++ b/packages/components/src/internal/components/ExpandableContainer.tsx @@ -108,7 +108,9 @@ export const ExpandableContainer: FC = memo(props => { })} onClick={hasOnClick || isExpandable ? handleClick : undefined} type="button" - /> + > + {visible ? 'Collapse' : 'Expand'} +
{clause} diff --git a/packages/components/src/internal/components/buttons/RemoveEntityButton.tsx b/packages/components/src/internal/components/buttons/RemoveEntityButton.tsx index 9e20395bbe..d92b5ec349 100644 --- a/packages/components/src/internal/components/buttons/RemoveEntityButton.tsx +++ b/packages/components/src/internal/components/buttons/RemoveEntityButton.tsx @@ -14,6 +14,7 @@ * limitations under the License. */ import React from 'react'; +import { Icon } from '../../Icon'; interface RemoveEntityButtonProps { entity?: string; @@ -33,7 +34,7 @@ export class RemoveEntityButton extends React.Component
diff --git a/packages/components/src/theme/form.scss b/packages/components/src/theme/form.scss index c03d42c581..77ec2cbc2c 100644 --- a/packages/components/src/theme/form.scss +++ b/packages/components/src/theme/form.scss @@ -146,6 +146,9 @@ border-bottom: 3px solid white } } + //&.list-group-item.disabled { + // color: black; + //} } diff --git a/packages/components/src/theme/navbar.scss b/packages/components/src/theme/navbar.scss index 2937583108..3ee83a9cf4 100644 --- a/packages/components/src/theme/navbar.scss +++ b/packages/components/src/theme/navbar.scss @@ -446,7 +446,7 @@ .container-nav { padding: 10px 0 8px 10px; - color: $text-color-gray; + color: $text-muted; position: relative; } .container-nav:before { @@ -470,7 +470,7 @@ .lk-version-nav { padding: 8px 0 8px 10px; - color: $text-color-gray; + color: $text-muted; position: relative; } diff --git a/packages/components/src/theme/settings.scss b/packages/components/src/theme/settings.scss index 53fa51cd2b..3e9fd25021 100644 --- a/packages/components/src/theme/settings.scss +++ b/packages/components/src/theme/settings.scss @@ -24,7 +24,7 @@ .name-id-setting__prefix-example { margin-top: 10px; margin-left: 48px; - color: #999999; + color: $text-muted; } .name-id-setting__error { diff --git a/packages/components/src/theme/utils.scss b/packages/components/src/theme/utils.scss index c7616336dc..0b3adb28bb 100644 --- a/packages/components/src/theme/utils.scss +++ b/packages/components/src/theme/utils.scss @@ -197,3 +197,9 @@ .pointer { cursor: pointer; } + +/** This is used to get around WAVE false-positives that flag the sr-only text as low contrast **/ +.sr-only { + color: black; + background: white; +} diff --git a/packages/components/src/theme/variables.scss b/packages/components/src/theme/variables.scss index 888eec216b..7e99c2528e 100644 --- a/packages/components/src/theme/variables.scss +++ b/packages/components/src/theme/variables.scss @@ -26,6 +26,7 @@ $badge-color: #D43F3A; $blue-highlight: #2980B9; $gray-no-highlight: $gray-lighten; $blue-icon-background: #CCE5FF; +$gray-icon-background: #767676; $blue-dark: #1e4f6f; $text-color-gray: #9d9d9d; From 37719ee47c15c3423c81319ffa444200cb355387 Mon Sep 17 00:00:00 2001 From: labkey-susanh Date: Tue, 2 Jun 2026 09:18:56 -0700 Subject: [PATCH 2/8] Update snapshots --- .../ExpandableContainer.test.tsx.snap | 16 ++++++++++++++-- .../__snapshots__/ColorPickerInput.test.tsx.snap | 14 +++++++++++--- 2 files changed, 25 insertions(+), 5 deletions(-) diff --git a/packages/components/src/internal/components/__snapshots__/ExpandableContainer.test.tsx.snap b/packages/components/src/internal/components/__snapshots__/ExpandableContainer.test.tsx.snap index 9d81e72a07..267fb0b59d 100644 --- a/packages/components/src/internal/components/__snapshots__/ExpandableContainer.test.tsx.snap +++ b/packages/components/src/internal/components/__snapshots__/ExpandableContainer.test.tsx.snap @@ -22,7 +22,13 @@ exports[` custom props 1`] = `
default props 1`] = `
- + +
Date: Tue, 2 Jun 2026 09:31:38 -0700 Subject: [PATCH 3/8] Change contrast for disabled tabs in wizard pages --- packages/components/src/theme/form.scss | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/packages/components/src/theme/form.scss b/packages/components/src/theme/form.scss index 77ec2cbc2c..a4407213ec 100644 --- a/packages/components/src/theme/form.scss +++ b/packages/components/src/theme/form.scss @@ -146,9 +146,10 @@ border-bottom: 3px solid white } } - //&.list-group-item.disabled { - // color: black; - //} + &.list-group-item.disabled { + background-color: $gray-shadow; + color: $text-color-light; + } } From f02f2e3dd788f677ae1e25619387b380dc354eb9 Mon Sep 17 00:00:00 2001 From: labkey-susanh Date: Tue, 2 Jun 2026 09:38:34 -0700 Subject: [PATCH 4/8] @labkey/components v7.40.1-miscAssessibilityFixes.1 --- packages/components/package-lock.json | 4 ++-- packages/components/package.json | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/components/package-lock.json b/packages/components/package-lock.json index d8cd4df3f2..5d93f24628 100644 --- a/packages/components/package-lock.json +++ b/packages/components/package-lock.json @@ -1,12 +1,12 @@ { "name": "@labkey/components", - "version": "7.40.1-miscAssessibilityFixes.0", + "version": "7.40.1-miscAssessibilityFixes.1", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@labkey/components", - "version": "7.40.1-miscAssessibilityFixes.0", + "version": "7.40.1-miscAssessibilityFixes.1", "license": "SEE LICENSE IN LICENSE.txt", "dependencies": { "@hello-pangea/dnd": "18.0.1", diff --git a/packages/components/package.json b/packages/components/package.json index fb7aad477f..343514a127 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -1,6 +1,6 @@ { "name": "@labkey/components", - "version": "7.40.1-miscAssessibilityFixes.0", + "version": "7.40.1-miscAssessibilityFixes.1", "description": "Components, models, actions, and utility functions for LabKey applications and pages", "sideEffects": false, "files": [ From 871f88e967c9efa4b4fa99155390f903e8ccfab4 Mon Sep 17 00:00:00 2001 From: labkey-susanh Date: Tue, 2 Jun 2026 11:23:11 -0700 Subject: [PATCH 5/8] Fix labeling text for remove button. --- .../internal/components/buttons/RemoveEntityButton.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/components/src/internal/components/buttons/RemoveEntityButton.tsx b/packages/components/src/internal/components/buttons/RemoveEntityButton.tsx index d92b5ec349..c91c414096 100644 --- a/packages/components/src/internal/components/buttons/RemoveEntityButton.tsx +++ b/packages/components/src/internal/components/buttons/RemoveEntityButton.tsx @@ -30,12 +30,12 @@ export class RemoveEntityButton extends React.Component -
); From 6ae20225e0c5ecbd15684fe010f4724a06f9e07b Mon Sep 17 00:00:00 2001 From: labkey-susanh Date: Tue, 2 Jun 2026 11:24:54 -0700 Subject: [PATCH 6/8] @labkey/components v7.40.1-miscAssessibilityFixes.2 --- packages/components/package-lock.json | 4 ++-- packages/components/package.json | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/components/package-lock.json b/packages/components/package-lock.json index 5d93f24628..1866f73712 100644 --- a/packages/components/package-lock.json +++ b/packages/components/package-lock.json @@ -1,12 +1,12 @@ { "name": "@labkey/components", - "version": "7.40.1-miscAssessibilityFixes.1", + "version": "7.40.1-miscAssessibilityFixes.2", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@labkey/components", - "version": "7.40.1-miscAssessibilityFixes.1", + "version": "7.40.1-miscAssessibilityFixes.2", "license": "SEE LICENSE IN LICENSE.txt", "dependencies": { "@hello-pangea/dnd": "18.0.1", diff --git a/packages/components/package.json b/packages/components/package.json index 343514a127..39cc911ec0 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -1,6 +1,6 @@ { "name": "@labkey/components", - "version": "7.40.1-miscAssessibilityFixes.1", + "version": "7.40.1-miscAssessibilityFixes.2", "description": "Components, models, actions, and utility functions for LabKey applications and pages", "sideEffects": false, "files": [ From d88f7dfec5152eb724da2c2127ae0196b6073e80 Mon Sep 17 00:00:00 2001 From: labkey-susanh Date: Tue, 2 Jun 2026 12:04:58 -0700 Subject: [PATCH 7/8] update aria-label to not be empty --- .../components/buttons/RemoveEntityButton.tsx | 2 +- .../__snapshots__/ColorPickerInput.test.tsx.snap | 16 +++++----------- 2 files changed, 6 insertions(+), 12 deletions(-) diff --git a/packages/components/src/internal/components/buttons/RemoveEntityButton.tsx b/packages/components/src/internal/components/buttons/RemoveEntityButton.tsx index c91c414096..0c60f34874 100644 --- a/packages/components/src/internal/components/buttons/RemoveEntityButton.tsx +++ b/packages/components/src/internal/components/buttons/RemoveEntityButton.tsx @@ -33,7 +33,7 @@ export class RemoveEntityButton extends React.Component - diff --git a/packages/components/src/internal/components/forms/input/__snapshots__/ColorPickerInput.test.tsx.snap b/packages/components/src/internal/components/forms/input/__snapshots__/ColorPickerInput.test.tsx.snap index 06959f0fd6..516962580a 100644 --- a/packages/components/src/internal/components/forms/input/__snapshots__/ColorPickerInput.test.tsx.snap +++ b/packages/components/src/internal/components/forms/input/__snapshots__/ColorPickerInput.test.tsx.snap @@ -22,20 +22,14 @@ exports[`ColorPickerInput allowRemove 1`] = ` class="color-picker__remove" >
Date: Tue, 2 Jun 2026 15:49:45 -0700 Subject: [PATCH 8/8] @labkey/components v7.40.1 --- packages/components/package-lock.json | 4 ++-- packages/components/package.json | 2 +- packages/components/releaseNotes/components.md | 4 ++-- 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/components/package-lock.json b/packages/components/package-lock.json index 1866f73712..f131c5476d 100644 --- a/packages/components/package-lock.json +++ b/packages/components/package-lock.json @@ -1,12 +1,12 @@ { "name": "@labkey/components", - "version": "7.40.1-miscAssessibilityFixes.2", + "version": "7.40.1", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@labkey/components", - "version": "7.40.1-miscAssessibilityFixes.2", + "version": "7.40.1", "license": "SEE LICENSE IN LICENSE.txt", "dependencies": { "@hello-pangea/dnd": "18.0.1", diff --git a/packages/components/package.json b/packages/components/package.json index 39cc911ec0..65c8d07ae8 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -1,6 +1,6 @@ { "name": "@labkey/components", - "version": "7.40.1-miscAssessibilityFixes.2", + "version": "7.40.1", "description": "Components, models, actions, and utility functions for LabKey applications and pages", "sideEffects": false, "files": [ diff --git a/packages/components/releaseNotes/components.md b/packages/components/releaseNotes/components.md index 0657d97859..3cf3396e78 100644 --- a/packages/components/releaseNotes/components.md +++ b/packages/components/releaseNotes/components.md @@ -1,8 +1,8 @@ # @labkey/components Components, models, actions, and utility functions for LabKey applications and pages -### version TBD -*Released*: TBD +### version 7.40.1 +*Released*: 2 June 2026 - More misc. accessibility improvements - Fix empty buttons for `ExpandableContainer` and `RemoveEntityButton` - Fix color contrast for `.name-id-setting__prefix-example`, `.container-nav` and `.lk-version-nav`