From 290ebbbfa711ba8a6d9e267b28e10ca3d6b0bcc0 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Thu, 23 Apr 2026 14:12:49 -0700
Subject: [PATCH 01/30] Accessibility improvements: add labels for input
 elements

---
 packages/components/package-lock.json         |  4 +--
 packages/components/package.json              |  2 +-
 .../components/releaseNotes/components.md     |  4 +++
 packages/components/src/index.ts              |  2 ++
 .../src/internal/components/DateInput.tsx     |  7 ++++
 .../chart/ChartBuilderModal.test.tsx          |  8 ++---
 .../components/chart/ChartColorInputs.tsx     | 17 +++++++---
 .../chart/ChartFieldAggregateOptions.tsx      |  5 +--
 .../components/chart/ChartFieldOption.tsx     |  3 +-
 .../components/chart/ChartLabelInput.tsx      |  3 +-
 .../components/chart/ChartSettingsPanel.tsx   |  9 +++--
 .../components/chart/TrendlineOption.tsx      |  8 +++--
 ...IssuesListDefPropertiesPanel.test.tsx.snap |  2 ++
 .../internal/components/editable/Controls.tsx |  3 +-
 .../components/editable/EditableGrid.tsx      |  1 +
 .../entities/EntityMoveConfirmationModal.tsx  |  1 +
 .../forms/input/RadioGroupInput.tsx           |  1 +
 .../components/forms/input/SelectInput.tsx    |  8 ++---
 .../internal/components/search/SearchBox.tsx  |  1 +
 .../components/src/internal/renderers.tsx     |  1 +
 .../src/internal/util/utils.test.ts           | 34 +++++++++++++++++++
 .../components/src/internal/util/utils.ts     | 10 ++++++
 .../src/public/QueryModel/GridPanel.tsx       |  1 +
 .../src/public/QueryModel/SearchBox.tsx       |  1 +
 24 files changed, 111 insertions(+), 25 deletions(-)

diff --git a/packages/components/package-lock.json b/packages/components/package-lock.json
index 20d3c73ad6..a5c841ae87 100644
--- a/packages/components/package-lock.json
+++ b/packages/components/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@labkey/components",
-  "version": "7.31.2",
+  "version": "7.31.3-develop.1",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@labkey/components",
-      "version": "7.31.2",
+      "version": "7.31.3-develop.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 e1456d220b..2187ee7eb6 100644
--- a/packages/components/package.json
+++ b/packages/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@labkey/components",
-  "version": "7.31.2",
+  "version": "7.31.3-develop.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 99801d41c1..54cc043984 100644
--- a/packages/components/releaseNotes/components.md
+++ b/packages/components/releaseNotes/components.md
@@ -1,6 +1,10 @@
 # @labkey/components
 Components, models, actions, and utility functions for LabKey applications and pages
 
+### version TBD
+*Released*: TBD
+- Accessibility improvements: add labels or aria-labels to input elements
+
 ### version 7.31.1
 *Released*: 23 April 2026
 - GitHub Issue 911: Fix overflow for field filtering modal
diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts
index 3fa5e576c2..a08517780f 100644
--- a/packages/components/src/index.ts
+++ b/packages/components/src/index.ts
@@ -73,6 +73,7 @@ import {
     quoteValueWithDelimiters,
     setIsTestEnv,
     splitMultiValueForImport,
+    stringToHtmlId,
     uncapitalizeFirstChar,
     valueIsEmpty,
     withTransformedKeys,
@@ -1334,6 +1335,7 @@ export {
     genCellKey,
     GENERAL_ASSAY_PROVIDER_NAME,
     generateId,
+    stringToHtmlId,
     generateNameWithTimestamp,
     getActionErrorMessage,
     getActionValuesForFilterProps,
diff --git a/packages/components/src/internal/components/DateInput.tsx b/packages/components/src/internal/components/DateInput.tsx
index c7754e9102..7bafa0f195 100644
--- a/packages/components/src/internal/components/DateInput.tsx
+++ b/packages/components/src/internal/components/DateInput.tsx
@@ -4,6 +4,7 @@ import DatePicker, { DatePickerProps } from 'react-datepicker';
 import { getDateFNSDateFormat, parseDateFNSTimeFormat } from '../util/Date';
 
 import { Container } from './base/models/Container';
+import { stringToHtmlId } from '../util/utils';
 
 export interface DateInputProps {
     container?: Container;
@@ -33,9 +34,12 @@ export const DateInput: FC<DateInputProps & DatePickerProps> = memo(props => {
         [onSelect]
     );
 
+    const id = stringToHtmlId(pickerProps.name) ?? 'date-input';
+
     return (
         <span className="input-group date-input">
             <DatePicker
+                ariaLabelledBy={id}
                 autoComplete="off"
                 className="form-control"
                 wrapperClassName="form-control"
@@ -46,6 +50,9 @@ export const DateInput: FC<DateInputProps & DatePickerProps> = memo(props => {
                 ref={input}
                 onSelect={onSelect_}
             />
+            <span className="sr-only" id={id}>
+                {pickerProps.placeholderText}
+            </span>
             <span className="input-group-addon" onClick={onIconClick}>
                 <i className="fa fa-calendar" />
             </span>
diff --git a/packages/components/src/internal/components/chart/ChartBuilderModal.test.tsx b/packages/components/src/internal/components/chart/ChartBuilderModal.test.tsx
index 031644ac82..0638a6751a 100644
--- a/packages/components/src/internal/components/chart/ChartBuilderModal.test.tsx
+++ b/packages/components/src/internal/components/chart/ChartBuilderModal.test.tsx
@@ -346,7 +346,7 @@ describe('ChartBuilderModal', () => {
         expect(document.querySelectorAll('input')).toHaveLength(21);
         expect(document.querySelector('input[value=automatic]').hasAttribute('checked')).toBe(true);
         expect(document.querySelector('input[value=manual]').hasAttribute('checked')).toBe(false);
-        expect(document.querySelector('input[name=aggregate-method]').getAttribute('value')).toBe('SUM');
+        expect(document.querySelector('input[name=aggregateMethod]').getAttribute('value')).toBe('SUM');
         expect(document.querySelectorAll('input[name=error-bar-method]')).toHaveLength(3);
         expect(document.querySelector('input[value=SD]').hasAttribute('checked')).toBe(false);
         expect(document.querySelector('input[value=SEM]').hasAttribute('checked')).toBe(false);
@@ -388,7 +388,7 @@ describe('ChartBuilderModal', () => {
         expect(document.querySelectorAll('input')).toHaveLength(21);
         expect(document.querySelector('input[value=automatic]').hasAttribute('checked')).toBe(true);
         expect(document.querySelector('input[value=manual]').hasAttribute('checked')).toBe(false);
-        expect(document.querySelector('input[name=aggregate-method]').getAttribute('value')).toBe('MEAN');
+        expect(document.querySelector('input[name=aggregateMethod]').getAttribute('value')).toBe('MEAN');
         expect(document.querySelectorAll('input[name=error-bar-method]')).toHaveLength(3);
         expect(document.querySelector('input[value=SD]').hasAttribute('checked')).toBe(false);
         expect(document.querySelector('input[value=SEM]').hasAttribute('checked')).toBe(true);
@@ -424,7 +424,7 @@ describe('ChartBuilderModal', () => {
         expect(document.querySelectorAll('input')).toHaveLength(19);
         expect(document.querySelector('input[name=x]').getAttribute('value')).toBe('field1');
         expect(document.querySelector('input[name=y]').getAttribute('value')).toBe('field2');
-        expect(document.querySelectorAll('input[name=aggregate-method]')).toHaveLength(0);
+        expect(document.querySelectorAll('input[name=aggregateMethod]')).toHaveLength(0);
         expect(document.querySelector('input[name=trendlineType]').getAttribute('value')).toBe('option1');
         expect(document.querySelectorAll('input[name=trendlineAsymptoteMin]')).toHaveLength(0);
         expect(document.querySelectorAll('input[name=trendlineAsymptoteMax]')).toHaveLength(0);
@@ -462,7 +462,7 @@ describe('ChartBuilderModal', () => {
         expect(document.querySelectorAll('input')).toHaveLength(19);
         expect(document.querySelector('input[name=x]').getAttribute('value')).toBe('field1');
         expect(document.querySelector('input[name=y]').getAttribute('value')).toBe('field2');
-        expect(document.querySelectorAll('input[name=aggregate-method]')).toHaveLength(0);
+        expect(document.querySelectorAll('input[name=aggregateMethod]')).toHaveLength(0);
         expect(document.querySelectorAll('input[name=trendlineType]')).toHaveLength(1);
         expect(document.querySelectorAll('.field-option-icon')).toHaveLength(2); // gear icon for x and y axis
 
diff --git a/packages/components/src/internal/components/chart/ChartColorInputs.tsx b/packages/components/src/internal/components/chart/ChartColorInputs.tsx
index 757a3c8cf7..44839a88ae 100644
--- a/packages/components/src/internal/components/chart/ChartColorInputs.tsx
+++ b/packages/components/src/internal/components/chart/ChartColorInputs.tsx
@@ -270,11 +270,12 @@ export const ChartColorInputs: FC<ChartColorInputsProps> = memo(({ chartConfig,
             {showColorPaletteScale && (
                 <div className="form-group row">
                     <div className="col-xs-12">
-                        <label>Color Palette</label>
+                        <label htmlFor="color-palette">Color Palette</label>
                         <SelectInput
                             clearable={false}
                             containerClass="row"
                             inputClass="col-xs-12"
+                            inputId="color-palette"
                             name={COLOR_OPTIONS.COLOR_PALETTE_SCALE}
                             onChange={onColorPaletteChange}
                             options={COLOR_PALETTE_OPTIONS}
@@ -418,11 +419,13 @@ const SeriesLineStyleInput: FC<SeriesLineStyleInputProps> = memo(({ chartConfig,
         <>
             <div className="form-group row">
                 <div className="col-xs-12">
-                    <label>Line Color and Style</label>
+                    <label htmlFor="line-color-and-style">Line Color and Style</label>
                     <SelectInput
                         containerClass="row"
                         inputClass="col-xs-12"
+                        inputId="line-color-and-style"
                         menuPlacement="top"
+                        name="lineColorAndStyle"
                         onChange={onSeriesSelectChange}
                         optionRenderer={seriesValueRenderer}
                         options={distinctSeriesOptions}
@@ -447,12 +450,16 @@ const SeriesLineStyleInput: FC<SeriesLineStyleInputProps> = memo(({ chartConfig,
                     </div>
                     {!chartConfig.geomOptions?.hideDataPoints && (
                         <div className="chart-color-input">
-                            <label className="label-weight-normal">Shape</label>
+                            <label className="label-weight-normal" htmlFor="shape">
+                                Shape
+                            </label>
                             <SelectInput
                                 clearable={false}
                                 containerClass="inline-block"
                                 inputClass=""
+                                inputId="shape"
                                 menuPlacement="top"
+                                name="shape"
                                 onChange={onSeriesShapeChange}
                                 optionRenderer={shapeOptionRenderer}
                                 options={SHAPE_OPTIONS}
@@ -466,12 +473,14 @@ const SeriesLineStyleInput: FC<SeriesLineStyleInputProps> = memo(({ chartConfig,
                         </div>
                     )}
                     <div className="chart-color-input">
-                        <label className="label-weight-normal">Line Type</label>
+                        <label className="label-weight-normal" htmlFor="line-type">Line Type</label>
                         <SelectInput
                             clearable={false}
                             containerClass="inline-block"
+                            id="line-type"
                             inputClass=""
                             menuPlacement="top"
+                            name="lineType"
                             onChange={onSeriesLineTypeChange}
                             optionRenderer={lineTypeOptionRenderer}
                             options={LINE_TYPE_OPTIONS}
diff --git a/packages/components/src/internal/components/chart/ChartFieldAggregateOptions.tsx b/packages/components/src/internal/components/chart/ChartFieldAggregateOptions.tsx
index cc5d82a7be..6f1af9d333 100644
--- a/packages/components/src/internal/components/chart/ChartFieldAggregateOptions.tsx
+++ b/packages/components/src/internal/components/chart/ChartFieldAggregateOptions.tsx
@@ -84,13 +84,14 @@ export const ChartFieldAggregateOptions: FC<OwnProps> = memo(props => {
     return (
         <>
             <div>
-                <label>
+                <label htmlFor="aggregate-method">
                     Aggregate Method <LabelOverlay placement="right">{BAR_CHART_AGGREGATE_METHOD_TIP}</LabelOverlay>
                 </label>
                 <SelectInput
                     clearable={false}
                     inputClass="col-xs-12"
-                    name="aggregate-method"
+                    inputId="aggregate-method"
+                    name="aggregateMethod"
                     onChange={onAggregateChange}
                     options={aggregateOptions}
                     placeholder="Select aggregate method"
diff --git a/packages/components/src/internal/components/chart/ChartFieldOption.tsx b/packages/components/src/internal/components/chart/ChartFieldOption.tsx
index 20f3bc8f83..4de8ad171b 100644
--- a/packages/components/src/internal/components/chart/ChartFieldOption.tsx
+++ b/packages/components/src/internal/components/chart/ChartFieldOption.tsx
@@ -98,7 +98,7 @@ export const ChartFieldOption: FC<OwnProps> = memo(props => {
 
     return (
         <div>
-            <label>
+            <label htmlFor={field.name}>
                 {field.label}
                 {field.required && ' *'}
             </label>
@@ -106,6 +106,7 @@ export const ChartFieldOption: FC<OwnProps> = memo(props => {
                 <SelectInput
                     containerClass=""
                     inputClass={showAdditionalOptions ? 'col-xs-11' : 'col-xs-12'}
+                    inputId={field.name}
                     labelKey="caption"
                     name={field.name}
                     onChange={onSelectChange}
diff --git a/packages/components/src/internal/components/chart/ChartLabelInput.tsx b/packages/components/src/internal/components/chart/ChartLabelInput.tsx
index 205f44857b..f45fd004fc 100644
--- a/packages/components/src/internal/components/chart/ChartLabelInput.tsx
+++ b/packages/components/src/internal/components/chart/ChartLabelInput.tsx
@@ -23,9 +23,10 @@ export const ChartLabelInput: FC<Props> = memo(({ label, name, onChange, value }
     return (
         <div className="form-group row">
             <div className="col-xs-12">
-                <label>{label}</label>
+                <label htmlFor={inputName}>{label}</label>
                 <input
                     className="form-control"
+                    id={inputName}
                     name={inputName}
                     onBlur={onBlur}
                     onChange={onChange_}
diff --git a/packages/components/src/internal/components/chart/ChartSettingsPanel.tsx b/packages/components/src/internal/components/chart/ChartSettingsPanel.tsx
index dd2364b07a..b2d42a531d 100644
--- a/packages/components/src/internal/components/chart/ChartSettingsPanel.tsx
+++ b/packages/components/src/internal/components/chart/ChartSettingsPanel.tsx
@@ -89,10 +89,11 @@ const NumberInput: FC<NumberInputProps> = memo(({ disabled, label, name, onBlur,
 
     return (
         <div>
-            <label>{label}</label>
+            <label htmlFor={name}>{label}</label>
             <input
                 className="form-control is-invalid"
                 disabled={disabled}
+                id={name}
                 name={name}
                 onBlur={onBlur}
                 onChange={onInputChange}
@@ -233,12 +234,13 @@ const ChartTypeDropdown: FC<ChartTypeDropdownProps> = memo(({ onChange, selected
 
     return (
         <div className="chart-settings__chart-type">
-            <label>Chart Type</label>
+            <label htmlFor="chart-type">Chart Type</label>
             <div className="form-group row">
                 <SelectInput
                     clearable={false}
                     containerClass=""
                     inputClass="col-xs-12"
+                    inputId="chart-type"
                     labelKey="title"
                     name="chartType"
                     onChange={onChange_}
@@ -370,9 +372,10 @@ export const ChartSettingsPanel: FC<Props> = memo(props => {
             {error && <Alert>{error}</Alert>}
             <h4>Settings</h4>
             <div>
-                <label>Name *</label>
+                <label htmlFor="chartName">Name *</label>
                 <input
                     className="form-control"
+                    id="chartName"
                     name="name"
                     onChange={onNameChange}
                     placeholder="Enter a name"
diff --git a/packages/components/src/internal/components/chart/TrendlineOption.tsx b/packages/components/src/internal/components/chart/TrendlineOption.tsx
index 1a4720977c..ea4fb2cf71 100644
--- a/packages/components/src/internal/components/chart/TrendlineOption.tsx
+++ b/packages/components/src/internal/components/chart/TrendlineOption.tsx
@@ -128,7 +128,7 @@ export const TrendlineOption: FC<TrendlineOptionProps> = memo(props => {
 
     return (
         <div className="trendline-option">
-            <label>
+            <label htmlFor="trendline-type">
                 Trendline{' '}
                 <LabelOverlay placement="right">
                     {trendlineOptions
@@ -148,6 +148,7 @@ export const TrendlineOption: FC<TrendlineOptionProps> = memo(props => {
                     clearable={false}
                     containerClass=""
                     inputClass={showFieldOptions ? 'col-xs-11' : 'col-xs-12'}
+                    inputId="trendline-type"
                     name="trendlineType"
                     onChange={onTrendlineFieldChange}
                     options={trendlineOptions}
@@ -268,6 +269,7 @@ const TrendlineOptionPopover: FC<TrendlineOptionPopoverProps> = props => {
                         <div className="chart-builder-asymptote-inputs">
                             {selectedTrendlineType?.showMin && (
                                 <input
+                                    aria-label="Min"
                                     className="chart-builder-field-footer-input"
                                     name="trendlineAsymptoteMin"
                                     onBlur={applyTrendlineAsymptote}
@@ -280,6 +282,7 @@ const TrendlineOptionPopover: FC<TrendlineOptionPopoverProps> = props => {
                             {selectedTrendlineType?.showMin && selectedTrendlineType?.showMax && <span> -</span>}
                             {selectedTrendlineType?.showMax && (
                                 <input
+                                    aria-label="Max"
                                     className="chart-builder-field-footer-input"
                                     name="trendlineAsymptoteMax"
                                     onBlur={applyTrendlineAsymptote}
@@ -295,7 +298,7 @@ const TrendlineOptionPopover: FC<TrendlineOptionPopoverProps> = props => {
                 </>
             )}
             <div className="margin-top">
-                <label>
+                <label htmlFor="trendline-parameters">
                     Provided Parameters{' '}
                     <LabelOverlay placement="right">
                         Select the field in the data which has the already computed / saved curve fit parameters object
@@ -305,6 +308,7 @@ const TrendlineOptionPopover: FC<TrendlineOptionPopoverProps> = props => {
                 </label>
                 <SelectInput
                     inputClass="col-xs-12"
+                    inputId="trendline-parameters"
                     labelKey="caption"
                     name="trendlineParameters"
                     onChange={onParameterFieldChange}
diff --git a/packages/components/src/internal/components/domainproperties/issues/__snapshots__/IssuesListDefPropertiesPanel.test.tsx.snap b/packages/components/src/internal/components/domainproperties/issues/__snapshots__/IssuesListDefPropertiesPanel.test.tsx.snap
index 1067480a65..d457cec29f 100644
--- a/packages/components/src/internal/components/domainproperties/issues/__snapshots__/IssuesListDefPropertiesPanel.test.tsx.snap
+++ b/packages/components/src/internal/components/domainproperties/issues/__snapshots__/IssuesListDefPropertiesPanel.test.tsx.snap
@@ -126,6 +126,7 @@ exports[`IssuesListDefPropertiesPanel new Issue Def 1`] = `
                                     aria-autocomplete="list"
                                     aria-expanded="false"
                                     aria-haspopup="true"
+                                    aria-label="Select commentSortDirection"
                                     autocapitalize="none"
                                     autocomplete="off"
                                     autocorrect="off"
@@ -531,6 +532,7 @@ exports[`IssuesListDefPropertiesPanel new Issue Def 1`] = `
                                   aria-autocomplete="list"
                                   aria-expanded="false"
                                   aria-haspopup="true"
+                                  aria-label="Select commentSortDirection"
                                   autocapitalize="none"
                                   autocomplete="off"
                                   autocorrect="off"
diff --git a/packages/components/src/internal/components/editable/Controls.tsx b/packages/components/src/internal/components/editable/Controls.tsx
index f70837b7a3..d6cd1a147e 100644
--- a/packages/components/src/internal/components/editable/Controls.tsx
+++ b/packages/components/src/internal/components/editable/Controls.tsx
@@ -156,10 +156,11 @@ export class AddRowsControl extends React.Component<AddRowsControlProps, AddRows
             <div className={wrapperClasses}>
                 <span className="input-group input-group-align">
                     <input
+                        aria-label="Number of rows to add"
                         className="form-control"
+                        disabled={disable}
                         max={disable ? undefined : maxToAdd}
                         min={disable ? undefined : minCount}
-                        disabled={disable}
                         name="addCount"
                         onBlur={this.onBlur}
                         onChange={this.onChange}
diff --git a/packages/components/src/internal/components/editable/EditableGrid.tsx b/packages/components/src/internal/components/editable/EditableGrid.tsx
index 241a67c06b..aa3308a4c2 100644
--- a/packages/components/src/internal/components/editable/EditableGrid.tsx
+++ b/packages/components/src/internal/components/editable/EditableGrid.tsx
@@ -831,6 +831,7 @@ export class EditableGrid extends PureComponent<EditableGridProps, EditableGridS
                 title: '&nbsp;',
                 cell: (selected: boolean, row) => (
                     <input
+                        aria-label="Select all rows on page"
                         checked={this.state.selected.contains(row.get(GRID_EDIT_INDEX))}
                         className="grid-panel__checkbox"
                         onChange={this.select.bind(this, row)}
diff --git a/packages/components/src/internal/components/entities/EntityMoveConfirmationModal.tsx b/packages/components/src/internal/components/entities/EntityMoveConfirmationModal.tsx
index e96a046f14..6f21beedef 100644
--- a/packages/components/src/internal/components/entities/EntityMoveConfirmationModal.tsx
+++ b/packages/components/src/internal/components/entities/EntityMoveConfirmationModal.tsx
@@ -168,6 +168,7 @@ export const EntityMoveConfirmationModal: FC<EntityMoveConfirmationModalProps> =
                 <SelectInput
                     helpTipRenderer="NONE"
                     label="Move to"
+                    name="destinationFolder"
                     onChange={onContainerChange}
                     options={containerOptions}
                     required
diff --git a/packages/components/src/internal/components/forms/input/RadioGroupInput.tsx b/packages/components/src/internal/components/forms/input/RadioGroupInput.tsx
index 78870a88de..971f59ecd6 100644
--- a/packages/components/src/internal/components/forms/input/RadioGroupInput.tsx
+++ b/packages/components/src/internal/components/forms/input/RadioGroupInput.tsx
@@ -38,6 +38,7 @@ const RadioGroupOption: FC<RadioGroupOptionImplProps> = memo(props => {
     return (
         <div className="radio-input-wrapper">
             <input
+                aria-label={option.value ?? 'null'}
                 checked={isSelected && !option.disabled}
                 className="radioinput-input"
                 disabled={option.disabled}
diff --git a/packages/components/src/internal/components/forms/input/SelectInput.tsx b/packages/components/src/internal/components/forms/input/SelectInput.tsx
index 5b9d9a0a9a..fe0cb587f3 100644
--- a/packages/components/src/internal/components/forms/input/SelectInput.tsx
+++ b/packages/components/src/internal/components/forms/input/SelectInput.tsx
@@ -746,15 +746,15 @@ export class SelectInputImpl extends Component<SelectInputImplProps, State> {
             };
 
             if (this.isCreatable()) {
-                return <AsyncCreatableSelect {...asyncProps} />;
+                return <AsyncCreatableSelect aria-label={'Select ' + name} {...asyncProps} />;
             }
 
-            return <AsyncSelect {...asyncProps} />;
+            return <AsyncSelect aria-label={'Select ' + name} {...asyncProps} />;
         } else if (this.isCreatable()) {
-            return <CreatableSelect {...selectProps} />;
+            return <CreatableSelect aria-label={'Select ' + name} {...selectProps} />;
         }
 
-        return <ReactSelect {...selectProps} />;
+        return <ReactSelect aria-label={'Select ' + name} {...selectProps} />;
     };
 
     render() {
diff --git a/packages/components/src/internal/components/search/SearchBox.tsx b/packages/components/src/internal/components/search/SearchBox.tsx
index 78fb0949f6..c40449ea28 100644
--- a/packages/components/src/internal/components/search/SearchBox.tsx
+++ b/packages/components/src/internal/components/search/SearchBox.tsx
@@ -55,6 +55,7 @@ export const SearchBox: FC<Props> = memo(props => {
                 <i className="fa fa-search navbar__search-icon" />
                 <span className={'navbar__input-group ' + (showFindByIds ? 'input-group' : '')}>
                     <input
+                        aria-label="Search in project"
                         className="form-control navbar__search-input"
                         onChange={onChange}
                         placeholder={placeholder ?? 'Enter Search Terms'}
diff --git a/packages/components/src/internal/renderers.tsx b/packages/components/src/internal/renderers.tsx
index 2aa40d0064..71061f7484 100644
--- a/packages/components/src/internal/renderers.tsx
+++ b/packages/components/src/internal/renderers.tsx
@@ -478,6 +478,7 @@ export const HeaderSelectionCell: FC<HeaderSelectionCellProps> = memo(props => {
 
     return (
         <input
+            aria-label="Select all rows on page"
             checked={selectedState === GRID_CHECKBOX_OPTIONS.ALL}
             className={className}
             disabled={disabled}
diff --git a/packages/components/src/internal/util/utils.test.ts b/packages/components/src/internal/util/utils.test.ts
index 574b4cd350..188da9f0ba 100644
--- a/packages/components/src/internal/util/utils.test.ts
+++ b/packages/components/src/internal/util/utils.test.ts
@@ -54,6 +54,7 @@ import {
     pronoun,
     quoteValueWithDelimiters,
     splitMultiValueForImport,
+    stringToHtmlId,
     styleStringToObj,
     toLowerSafe,
     uncapitalizeFirstChar,
@@ -2078,3 +2079,36 @@ describe('isBlankValue', () => {
         expect(isBlankValue(new Date())).toBe(false);
     });
 });
+
+describe('stringToHtmlId', () => {
+    test('empty string', () => {
+        expect(stringToHtmlId('')).toBe('');
+    });
+    test('undefined', () => {
+        expect(stringToHtmlId(undefined)).toBe(undefined);
+    });
+    test('replaces spaces with hyphens', () => {
+        expect(stringToHtmlId('hello world')).toBe('hello-world');
+    });
+
+    test('collapses consecutive non-alphanumeric characters into one hyphen', () => {
+        expect(stringToHtmlId('hello   world')).toBe('hello-world');
+        expect(stringToHtmlId('foo!@#bar')).toBe('foo-bar');
+    });
+
+    test('strips leading and trailing hyphens', () => {
+        expect(stringToHtmlId('  hello  ')).toBe('hello');
+        expect(stringToHtmlId('!hello!')).toBe('hello');
+    });
+
+    test('preserves alphanumeric characters', () => {
+        expect(stringToHtmlId('MyField123')).toBe('MyField123');
+    });
+
+    test('handles mixed case and numbers', () => {
+        expect(stringToHtmlId('Sample Type 1')).toBe('Sample-Type-1');
+    });
+    test('preserved valid id', () => {
+        expect(stringToHtmlId('my-id')).toBe('my-id');
+    });
+});
diff --git a/packages/components/src/internal/util/utils.ts b/packages/components/src/internal/util/utils.ts
index 9885a16695..9ed1f4b1f7 100644
--- a/packages/components/src/internal/util/utils.ts
+++ b/packages/components/src/internal/util/utils.ts
@@ -152,6 +152,16 @@ export function generateId(prefix?: string): string {
     return (prefix ? prefix : DOM_PREFIX) + DOM_COUNT++;
 }
 
+// Convert an arbitrary string to a value safe for use as an HTML element id.
+// Replaces sequences of non-alphanumeric characters with a single hyphen and
+// strips leading/trailing hyphens.
+export function stringToHtmlId(value: string): string {
+    if (!value) {
+        return value;
+    }
+    return value.replace(/[^a-zA-Z0-9]+/g, '-').replace(/^-+|-+$/g, '');
+}
+
 // http://davidwalsh.name/javascript-debounce-function
 export function debounce(func, wait, immediate?: boolean): () => void {
     let timeout: number;
diff --git a/packages/components/src/public/QueryModel/GridPanel.tsx b/packages/components/src/public/QueryModel/GridPanel.tsx
index d53625f525..b72ec7ef1b 100644
--- a/packages/components/src/public/QueryModel/GridPanel.tsx
+++ b/packages/components/src/public/QueryModel/GridPanel.tsx
@@ -971,6 +971,7 @@ export class GridPanel<T = {}> extends PureComponent<Props<T>, State> {
                 cell: (selected: boolean, row: Map<string, any>): ReactNode => {
                     return (
                         <input
+                            aria-label="Select a row"
                             checked={selected === true}
                             className="grid-panel__row-checkbox"
                             disabled={isLoading || isLoadingSelections}
diff --git a/packages/components/src/public/QueryModel/SearchBox.tsx b/packages/components/src/public/QueryModel/SearchBox.tsx
index 8d453adfcd..fccbc03c29 100644
--- a/packages/components/src/public/QueryModel/SearchBox.tsx
+++ b/packages/components/src/public/QueryModel/SearchBox.tsx
@@ -52,6 +52,7 @@ export const SearchBox: FC<Props> = memo(props => {
                         <i className="fa fa-search" />
                     </span>
                     <input
+                        aria-label="Search in grid"
                         className="form-control grid-panel__search-input"
                         onChange={onChange}
                         placeholder="Search..."

From 042341a1d83003ba27eecceee3c393abd35f4974 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Fri, 24 Apr 2026 16:02:57 -0700
Subject: [PATCH 02/30] Many more inputs without labels now have them

---
 .../src/internal/DropdownSection.tsx          |  1 +
 .../internal/announcements/ThreadEditor.tsx   |  2 ++
 .../components/ColumnSelectionModal.tsx       | 10 ++++--
 .../internal/components/EditInlineField.tsx   |  2 ++
 .../components/buttons/ToggleButtons.tsx      | 15 +++++++--
 .../chart/ChartFieldRangeScaleOptions.tsx     |  2 ++
 .../domainproperties/BooleanFieldOptions.tsx  |  2 ++
 .../CalculatedFieldOptions.tsx                |  8 ++++-
 .../domainproperties/DateTimeFieldOptions.tsx |  3 +-
 .../domainproperties/DomainFieldLabel.tsx     |  5 +--
 .../domainproperties/DomainForm.tsx           |  5 ++-
 .../components/domainproperties/DomainRow.tsx | 10 ++++--
 .../ImportDataFilePreview.tsx                 |  5 ++-
 .../domainproperties/Lookup/Fields.tsx        | 16 ++++++---
 .../domainproperties/LookupFieldOptions.tsx   | 13 ++++++--
 .../NameAndLinkingOptions.tsx                 | 16 ++++++---
 .../NameExpressionGenIdBanner.tsx             |  1 +
 .../domainproperties/NumericFieldOptions.tsx  |  6 ++--
 .../domainproperties/ParentAliasRow.tsx       |  2 ++
 .../domainproperties/ScannableOption.tsx      |  3 +-
 .../domainproperties/SectionHeading.tsx       |  3 +-
 .../domainproperties/SystemFields.tsx         |  2 ++
 .../domainproperties/TextFieldOptions.tsx     |  7 ++--
 .../assay/AssayPropertiesInput.tsx            | 33 ++++++++++++++++---
 .../DatasetPropertiesAdvancedSettings.tsx     |  1 +
 .../entities/EntityDetailsForm.tsx            |  7 ++--
 ...suesListDefPropertiesPanelFormElements.tsx | 11 ++++++-
 .../list/ListPropertiesAdvancedSettings.tsx   |  4 ++-
 .../list/ListPropertiesPanelFormElements.tsx  |  2 ++
 .../samples/SampleTypePropertiesPanel.tsx     |  4 +++
 .../validation/ConditionalFormatOptions.tsx   |  1 +
 .../domainproperties/validation/Filters.tsx   |  4 +++
 .../validation/RangeValidationOptions.tsx     |  3 +-
 .../validation/RegexValidationOptions.tsx     |  3 +-
 .../components/entities/DataTypeSelector.tsx  |  1 +
 .../components/forms/QueryFormInputs.tsx      | 11 +++++--
 .../components/forms/QueryInfoQuantity.tsx    |  2 +-
 .../forms/input/AmountUnitInput.tsx           | 12 +++++--
 .../components/forms/input/CheckboxInput.tsx  |  1 +
 .../forms/input/RadioGroupInput.tsx           | 10 +++++-
 .../labelPrinting/BarTenderSettingsForm.tsx   |  3 +-
 .../LabelsConfigurationPanel.tsx              |  9 +++--
 .../labelPrinting/PrintLabelsModal.tsx        |  7 ++--
 .../components/lineage/LineageSettings.tsx    | 23 +++++++++----
 .../ontology/OntologyLookupOptions.tsx        | 13 +++++---
 .../ontology/OntologyTreeSearchContainer.tsx  |  1 +
 .../picklist/ChoosePicklistModal.tsx          |  1 +
 .../components/picklist/PicklistEditModal.tsx |  8 +++--
 .../samples/DiscardConsumedSamplesPanel.tsx   |  3 +-
 .../samples/ManageSampleStatusesPanel.tsx     |  3 +-
 .../components/samples/StorageAmountInput.tsx |  1 +
 .../search/FilterExpressionView.tsx           |  4 +++
 .../search/FilterFacetedSelector.tsx          |  2 ++
 .../components/search/QueryFilterPanel.tsx    |  6 ++--
 .../internal/components/search/SearchBox.tsx  |  2 +-
 .../components/search/SearchPanel.tsx         |  1 +
 .../components/settings/NameIdSettings.tsx    | 14 ++++++--
 .../internal/components/user/APIKeysPanel.tsx |  5 +--
 .../components/src/internal/renderers.tsx     |  1 +
 .../src/public/QueryModel/SaveViewModal.tsx   | 11 +++++--
 60 files changed, 288 insertions(+), 79 deletions(-)

diff --git a/packages/components/src/internal/DropdownSection.tsx b/packages/components/src/internal/DropdownSection.tsx
index de2e4f4588..9997ee6bc3 100644
--- a/packages/components/src/internal/DropdownSection.tsx
+++ b/packages/components/src/internal/DropdownSection.tsx
@@ -63,6 +63,7 @@ export const DropdownSection: FC<MenuSectionProps> = ({ items, showDivider = fal
             {expanded && items.length > SHOW_FILTER_CUTOFF && (
                 <MenuItem>
                     <input
+                        aria-label="Filter selection options"
                         onChange={onFilterChange}
                         onClick={onFilterClick}
                         placeholder="Filter..."
diff --git a/packages/components/src/internal/announcements/ThreadEditor.tsx b/packages/components/src/internal/announcements/ThreadEditor.tsx
index 0dd6bef6ce..799b332e86 100644
--- a/packages/components/src/internal/announcements/ThreadEditor.tsx
+++ b/packages/components/src/internal/announcements/ThreadEditor.tsx
@@ -480,6 +480,7 @@ export const ThreadEditor: FC<ThreadEditorProps> = props => {
             {view === EditorView.edit && (
                 <div className={classNames('form-group', { 'has-error': hasError })}>
                     <textarea
+                        aria-label="Comment"
                         autoFocus
                         className="thread-editor__input form-control"
                         name="body"
@@ -516,6 +517,7 @@ export const ThreadEditor: FC<ThreadEditorProps> = props => {
 
             <label className="thread-editor__attachment-input btn btn-default">
                 <span className="fa fa-paperclip" />
+                <span className="sr-only">Attach files</span>
                 <input multiple onChange={onFileInputChange} type="file" />
             </label>
 
diff --git a/packages/components/src/internal/components/ColumnSelectionModal.tsx b/packages/components/src/internal/components/ColumnSelectionModal.tsx
index 24d87ad273..7e03435c26 100644
--- a/packages/components/src/internal/components/ColumnSelectionModal.tsx
+++ b/packages/components/src/internal/components/ColumnSelectionModal.tsx
@@ -62,6 +62,7 @@ export const FieldLabelDisplay: FC<FieldLabelDisplayProps> = memo(props => {
     if (editing) {
         return (
             <input
+                aria-label="Field label"
                 autoFocus
                 className="form-control"
                 defaultValue={title}
@@ -551,8 +552,13 @@ export const ColumnSelectionModal: FC<ColumnSelectionModalProps> = memo(props =>
                         </div>
                         {allowShowAll && (
                             <div className="field-modal__footer" key="toggleAll">
-                                <input checked={showAllColumns} onChange={onToggleShowAll} type="checkbox" />
-                                &nbsp;Show all system and user-defined fields
+                                <input
+                                    aria-labelledby="show-all-label"
+                                    checked={showAllColumns}
+                                    onChange={onToggleShowAll}
+                                    type="checkbox"
+                                />
+                                &nbsp;<span id="show-all-label">Show all system and user-defined fields</span>
                             </div>
                         )}
                     </div>
diff --git a/packages/components/src/internal/components/EditInlineField.tsx b/packages/components/src/internal/components/EditInlineField.tsx
index 38fcc55044..d3a9ad8023 100644
--- a/packages/components/src/internal/components/EditInlineField.tsx
+++ b/packages/components/src/internal/components/EditInlineField.tsx
@@ -257,6 +257,7 @@ export const EditInlineField: FC<Props> = memo(props => {
             {state.editing && isTextArea && (
                 <span className="input-group">
                     <textarea
+                        aria-label={label ?? name}
                         autoFocus
                         className="form-control"
                         cols={100}
@@ -281,6 +282,7 @@ export const EditInlineField: FC<Props> = memo(props => {
             {state.editing && !column && isText && (
                 <span className="input-group input-sizer">
                     <input
+                        aria-label={label ?? name}
                         autoFocus
                         className="form-control"
                         defaultValue={_value}
diff --git a/packages/components/src/internal/components/buttons/ToggleButtons.tsx b/packages/components/src/internal/components/buttons/ToggleButtons.tsx
index d0627c622e..5687c6d107 100644
--- a/packages/components/src/internal/components/buttons/ToggleButtons.tsx
+++ b/packages/components/src/internal/components/buttons/ToggleButtons.tsx
@@ -3,6 +3,7 @@ import classNames from 'classnames';
 
 import { FormsyInput } from '../forms/input/FormsyReactComponents';
 import { LabelHelpTip } from '../base/LabelHelpTip';
+import { stringToHtmlId } from '../../util/utils';
 
 interface Props {
     active: string;
@@ -51,7 +52,12 @@ export const ToggleButtons: FC<Props> = memo(props => {
     return (
         <>
             {inputFieldName && (
-                <FormsyInput name={inputFieldName} type="hidden" value={active === first ? 'true' : 'false'} />
+                <FormsyInput
+                    id={stringToHtmlId(inputFieldName)}
+                    name={inputFieldName}
+                    type="hidden"
+                    value={active === first ? 'true' : 'false'}
+                />
             )}
             <div
                 className={classNames('toggle', 'btn-group', {
@@ -106,7 +112,12 @@ export const ToggleIcon: FC<Props> = memo(props => {
     return (
         <>
             {inputFieldName && (
-                <FormsyInput name={inputFieldName} type="hidden" value={active === first ? 'true' : 'false'} />
+                <FormsyInput
+                    id={stringToHtmlId(inputFieldName)}
+                    name={inputFieldName}
+                    type="hidden"
+                    value={active === first ? 'true' : 'false'}
+                />
             )}
             <div
                 className={classNames('toggle', 'toggle-group-icon', 'btn-group', {
diff --git a/packages/components/src/internal/components/chart/ChartFieldRangeScaleOptions.tsx b/packages/components/src/internal/components/chart/ChartFieldRangeScaleOptions.tsx
index 2baba4493a..30b23dc33a 100644
--- a/packages/components/src/internal/components/chart/ChartFieldRangeScaleOptions.tsx
+++ b/packages/components/src/internal/components/chart/ChartFieldRangeScaleOptions.tsx
@@ -102,6 +102,7 @@ export const ChartFieldRangeScaleOptions: FC<Props> = memo(props => {
             {scale.type === 'manual' && (
                 <div className="chart-builder-scale-range-inputs">
                     <input
+                        aria-label="Scale minimum"
                         className="chart-builder-field-footer-input"
                         name="scaleMin"
                         onBlur={onScaleRangeBlur}
@@ -112,6 +113,7 @@ export const ChartFieldRangeScaleOptions: FC<Props> = memo(props => {
                     />
                     <span className="chart-builder-field-footer-input">-</span>
                     <input
+                        aria-label="Scale maximum"
                         className="chart-builder-field-footer-input"
                         name="scaleMax"
                         onBlur={onScaleRangeBlur}
diff --git a/packages/components/src/internal/components/domainproperties/BooleanFieldOptions.tsx b/packages/components/src/internal/components/domainproperties/BooleanFieldOptions.tsx
index e7abbad32c..1f31b69cdf 100644
--- a/packages/components/src/internal/components/domainproperties/BooleanFieldOptions.tsx
+++ b/packages/components/src/internal/components/domainproperties/BooleanFieldOptions.tsx
@@ -43,6 +43,7 @@ export class BooleanFieldOptions extends PureComponent<BooleanFieldProps> {
                     <div className="col-xs-12">
                         <div className="domain-field-label">
                             <DomainFieldLabel
+                                id="boolean-format-label"
                                 label="Format for Boolean Values"
                                 helpTipBody={this.getFormatHelpText()}
                             />
@@ -52,6 +53,7 @@ export class BooleanFieldOptions extends PureComponent<BooleanFieldProps> {
                 <div className="row">
                     <div className="col-xs-3">
                         <input
+                            aria-labelledby="boolean-format-label"
                             className="form-control"
                             type="text"
                             value={format || ''}
diff --git a/packages/components/src/internal/components/domainproperties/CalculatedFieldOptions.tsx b/packages/components/src/internal/components/domainproperties/CalculatedFieldOptions.tsx
index 46dcb839c2..991a21a54c 100644
--- a/packages/components/src/internal/components/domainproperties/CalculatedFieldOptions.tsx
+++ b/packages/components/src/internal/components/domainproperties/CalculatedFieldOptions.tsx
@@ -163,8 +163,14 @@ export const CalculatedFieldOptions: FC<Props> = memo(props => {
         >
             <div className="row">
                 <div className="col-xs-12 col-md-6">
-                    <SectionHeading cls="bottom-padding" helpTipBody={HELP_TIP_BODY} title="Expression" />
+                    <SectionHeading
+                        cls="bottom-padding"
+                        helpTipBody={HELP_TIP_BODY}
+                        id="expression-label"
+                        title="Expression"
+                    />
                     <textarea
+                        aria-labelledby="expression-label"
                         className="form-control"
                         disabled={
                             isFieldPartiallyLocked(field.lockType) ||
diff --git a/packages/components/src/internal/components/domainproperties/DateTimeFieldOptions.tsx b/packages/components/src/internal/components/domainproperties/DateTimeFieldOptions.tsx
index 64a9e4c02a..7a5111092e 100644
--- a/packages/components/src/internal/components/domainproperties/DateTimeFieldOptions.tsx
+++ b/packages/components/src/internal/components/domainproperties/DateTimeFieldOptions.tsx
@@ -194,9 +194,10 @@ export const DateTimeFieldOptions: FC<DateTimeFieldProps> = memo(props => {
                 </div>
             </div>
             <div className="row">
-                <div className="col-xs-3">Use Default</div>
+                <div className="col-xs-3" id="use-default-label">Use Default</div>
                 <div className="col-xs-9">
                     <input
+                        aria-labelledby="use-default-label"
                         checked={setting.inherited}
                         onChange={onToggleInherited}
                         disabled={isFieldFullyLocked(lockType)}
diff --git a/packages/components/src/internal/components/domainproperties/DomainFieldLabel.tsx b/packages/components/src/internal/components/domainproperties/DomainFieldLabel.tsx
index 003493e43e..25a0b94058 100644
--- a/packages/components/src/internal/components/domainproperties/DomainFieldLabel.tsx
+++ b/packages/components/src/internal/components/domainproperties/DomainFieldLabel.tsx
@@ -6,12 +6,13 @@ import { getSplitSentence } from './actions';
 
 export interface DomainFieldLabelProps {
     helpTipBody?: ReactNode;
+    id?: string;
     label: string;
     required?: boolean;
 }
 
 export const DomainFieldLabel: FC<DomainFieldLabelProps> = memo(props => (
-    <>
+    <span id={props.id}>
         {getSplitSentence(props.label, false)}
         <span className="domain-no-wrap">
             {getSplitSentence(props.label, true)}
@@ -22,7 +23,7 @@ export const DomainFieldLabel: FC<DomainFieldLabelProps> = memo(props => (
             )}
             {props.required ? ' *' : ''}
         </span>
-    </>
+    </span>
 ));
 
 DomainFieldLabel.displayName = 'DomainFieldLabel';
diff --git a/packages/components/src/internal/components/domainproperties/DomainForm.tsx b/packages/components/src/internal/components/domainproperties/DomainForm.tsx
index 7ee58ffd56..c03116960f 100644
--- a/packages/components/src/internal/components/domainproperties/DomainForm.tsx
+++ b/packages/components/src/internal/components/domainproperties/DomainForm.tsx
@@ -182,6 +182,7 @@ const DomainFormToolbar: FC<DomainFormToolbarProps> = memo(props => {
                         </span>
                     )}
                     <input
+                        aria-label={'Search domain ' + domainIndex}
                         className="form-control domain-search-input"
                         id={'domain-search-name-' + domainIndex}
                         onChange={onSearchChange}
@@ -1230,7 +1231,9 @@ export class DomainFormImpl extends React.PureComponent<DomainFormProps, State>
                                 id="domain-select-all-checkbox"
                                 name="domain-select-all-checkbox"
                                 onChange={this.toggleSelectAll}
-                            />
+                            >
+                                <span className="sr-only">Select all fields</span>
+                            </CheckboxLK>
                         </div>
                         <div>
                             <div className="col-xs-3">
diff --git a/packages/components/src/internal/components/domainproperties/DomainRow.tsx b/packages/components/src/internal/components/domainproperties/DomainRow.tsx
index 22cf654073..e601e1d45f 100644
--- a/packages/components/src/internal/components/domainproperties/DomainRow.tsx
+++ b/packages/components/src/internal/components/domainproperties/DomainRow.tsx
@@ -457,7 +457,9 @@ export class DomainRow extends React.PureComponent<DomainRowProps, DomainRowStat
                                     id={createFormInputId(DOMAIN_FIELD_SELECTED, domainIndex, index)}
                                     name={createFormInputName(DOMAIN_FIELD_SELECTED)}
                                     onChange={this.onFieldChange}
-                                />
+                                >
+                                    <span className="sr-only">Select field</span>
+                                </DomainDesignerCheckbox>
                                 <FieldExpansionToggle
                                     cls="domain-field-expand-icon"
                                     collapsedTitle="Show additional field properties"
@@ -472,6 +474,7 @@ export class DomainRow extends React.PureComponent<DomainRowProps, DomainRowStat
                                     <div id={createFormInputId(DOMAIN_FIELD_ROW, domainIndex, index)} ref={this.ref}>
                                         <div className="col-xs-6">
                                             <input
+                                                aria-label="Field name"
                                                 className="form-control"
                                                 disabled={this.disableNameInput(field)}
                                                 id={createFormInputId(DOMAIN_FIELD_NAME, domainIndex, index)}
@@ -483,6 +486,7 @@ export class DomainRow extends React.PureComponent<DomainRowProps, DomainRowStat
                                         </div>
                                         <div className="col-xs-4">
                                             <select
+                                                aria-label="Field type"
                                                 className="form-control"
                                                 disabled={this.disableTypeInput(field)}
                                                 id={createFormInputId(DOMAIN_FIELD_TYPE, domainIndex, index)}
@@ -530,7 +534,9 @@ export class DomainRow extends React.PureComponent<DomainRowProps, DomainRowStat
                                                             )}
                                                             name={createFormInputName(DOMAIN_FIELD_REQUIRED)}
                                                             onChange={this.onFieldChange}
-                                                        />
+                                                        >
+                                                            <span className="sr-only">Required</span>
+                                                        </DomainDesignerCheckbox>
                                                     )}
                                             </div>
                                         </div>
diff --git a/packages/components/src/internal/components/domainproperties/ImportDataFilePreview.tsx b/packages/components/src/internal/components/domainproperties/ImportDataFilePreview.tsx
index 5511501b5f..ce4eca4bc4 100644
--- a/packages/components/src/internal/components/domainproperties/ImportDataFilePreview.tsx
+++ b/packages/components/src/internal/components/domainproperties/ImportDataFilePreview.tsx
@@ -47,9 +47,12 @@ export class ImportDataFilePreview extends PureComponent<Props, State> {
 
         return (
             <div className="domain-form__file-preview">
-                <div className="domain-form__file-preview__text">Import data from this file upon {noun} creation? </div>
+                <div className="domain-form__file-preview__text" id="import-data-file-label">
+                    Import data from this file upon {noun} creation?
+                </div>
                 <div className="domain-form__file-preview__toggle">
                     <input
+                        aria-labelledby="import-data-file-label"
                         type="checkbox"
                         id="domain__import-data__file-enabled"
                         checked={shouldImportData}
diff --git a/packages/components/src/internal/components/domainproperties/Lookup/Fields.tsx b/packages/components/src/internal/components/domainproperties/Lookup/Fields.tsx
index 1f99ba355a..2f0c6a96e0 100644
--- a/packages/components/src/internal/components/domainproperties/Lookup/Fields.tsx
+++ b/packages/components/src/internal/components/domainproperties/Lookup/Fields.tsx
@@ -18,6 +18,7 @@ interface ILookupProps {
 }
 
 interface IFolderSelectProps {
+    ariaLabelledBy?: string;
     disabled?: boolean;
     id: string;
     onChange: (any) => any;
@@ -73,11 +74,11 @@ class FolderSelectImpl extends React.Component<FolderSelectProps, IFolderSelectI
     }
 
     render() {
-        const { context } = this.props;
+        const { context, ariaLabelledBy } = this.props;
         const { containers } = this.state;
 
         return (
-            <select {...this.props} className="form-control">
+            <select {...this.props} aria-labelledby={ariaLabelledBy} className="form-control">
                 {context.activeContainer && (
                     <option key="_current" value="">
                         Current {context.activeContainer.type.toLowerCase() === 'project' ? 'Project' : 'Folder'}
@@ -96,6 +97,7 @@ class FolderSelectImpl extends React.Component<FolderSelectProps, IFolderSelectI
 }
 
 interface ITargetTableSelectProps {
+    ariaLabelledBy?: string;
     containerPath: string;
     disabled?: boolean;
     id: string;
@@ -232,7 +234,7 @@ class TargetTableSelectImpl extends React.Component<TargetTableSelectProps, ITar
     }
 
     render() {
-        const { id, onChange, value, name, disabled, lookupIsValid, shouldDisableNonExists } = this.props;
+        const { ariaLabelledBy, id, onChange, value, name, disabled, lookupIsValid, shouldDisableNonExists } = this.props;
         const { loading, queries, initialQueryName, initialQueryInvalid } = this.state;
 
         const isEmpty = queries?.length === 0;
@@ -247,12 +249,13 @@ class TargetTableSelectImpl extends React.Component<TargetTableSelectProps, ITar
 
         return (
             <select
+                aria-labelledby={ariaLabelledBy}
                 className="form-control"
                 disabled={loading || disabledField}
-                value={value}
                 id={id}
                 name={name}
                 onChange={onChange}
+                value={value}
             >
                 {value && disabledField && (
                     <option key="_disabled" value={value}>
@@ -297,6 +300,7 @@ class TargetTableSelectImpl extends React.Component<TargetTableSelectProps, ITar
 }
 
 interface ISchemaSelectProps {
+    ariaLabelledBy?: string;
     containerPath: string;
     disabled?: boolean;
     id: string;
@@ -323,6 +327,7 @@ export class SchemaSelect extends React.PureComponent<ISchemaSelectProps, any> {
 export type SchemaSelectProps = ISchemaSelectProps & ILookupProps;
 
 export interface ISchemaSelectImplState {
+    ariaLabelledBy?: string;
     containerPath?: string;
     loading?: boolean;
     prevPath?: string;
@@ -401,7 +406,7 @@ class SchemaSelectImpl extends React.Component<SchemaSelectProps, ISchemaSelectI
     }
 
     render() {
-        const { id, onChange, value, name, disabled } = this.props;
+        const { ariaLabelledBy, id, onChange, value, name, disabled } = this.props;
         const { schemas, loading } = this.state;
 
         const isEmpty = schemas?.length === 0;
@@ -410,6 +415,7 @@ class SchemaSelectImpl extends React.Component<SchemaSelectProps, ISchemaSelectI
 
         return (
             <select
+                aria-labelledby={ariaLabelledBy}
                 className="form-control"
                 disabled={disabled}
                 value={value}
diff --git a/packages/components/src/internal/components/domainproperties/LookupFieldOptions.tsx b/packages/components/src/internal/components/domainproperties/LookupFieldOptions.tsx
index 6853a28f97..cdbdf96ddf 100644
--- a/packages/components/src/internal/components/domainproperties/LookupFieldOptions.tsx
+++ b/packages/components/src/internal/components/domainproperties/LookupFieldOptions.tsx
@@ -90,8 +90,11 @@ export class LookupFieldOptions extends React.PureComponent<LookupFieldProps, an
                 </div>
                 <div className="row">
                     <div className="col-xs-2">
-                        <div className="domain-field-label">Target Folder</div>
+                        <div className="domain-field-label" id={'target-folder-' + index}>
+                            Target Folder
+                        </div>
                         <FolderSelect
+                            ariaLabelledBy={'target-folder-' + index}
                             id={createFormInputId(DOMAIN_FIELD_LOOKUP_CONTAINER, domainIndex, index)}
                             key={createFormInputId(DOMAIN_FIELD_LOOKUP_CONTAINER, domainIndex, index)}
                             disabled={disabled}
@@ -100,8 +103,11 @@ export class LookupFieldOptions extends React.PureComponent<LookupFieldProps, an
                         />
                     </div>
                     <div className="col-xs-2">
-                        <div className="domain-field-label">Target Schema</div>
+                        <div className="domain-field-label" id={'target-schema-label-' + index}>
+                            Target Schema
+                        </div>
                         <SchemaSelect
+                            ariaLabelledBy={'target-schema-label-' + index}
                             containerPath={lookupContainer}
                             id={createFormInputId(DOMAIN_FIELD_LOOKUP_SCHEMA, domainIndex, index)}
                             key={createFormInputId(DOMAIN_FIELD_LOOKUP_SCHEMA, domainIndex, index)}
@@ -111,8 +117,9 @@ export class LookupFieldOptions extends React.PureComponent<LookupFieldProps, an
                         />
                     </div>
                     <div className="col-xs-2">
-                        <div className="domain-field-label">Target Table</div>
+                        <div className="domain-field-label" id={'target-table-label-' + index}>Target Table</div>
                         <TargetTableSelect
+                            ariaLabelledBy={'target-table-label-' + index}
                             containerPath={lookupContainer}
                             id={createFormInputId(DOMAIN_FIELD_LOOKUP_QUERY, domainIndex, index)}
                             key={createFormInputId(DOMAIN_FIELD_LOOKUP_QUERY, domainIndex, index)}
diff --git a/packages/components/src/internal/components/domainproperties/NameAndLinkingOptions.tsx b/packages/components/src/internal/components/domainproperties/NameAndLinkingOptions.tsx
index ec229081c1..ef27225028 100644
--- a/packages/components/src/internal/components/domainproperties/NameAndLinkingOptions.tsx
+++ b/packages/components/src/internal/components/domainproperties/NameAndLinkingOptions.tsx
@@ -103,8 +103,9 @@ export class NameAndLinkingOptions extends PureComponent<NameAndLinkingProps> {
                 </div>
                 <div className="row">
                     <div className="col-xs-5">
-                        <div className="domain-field-label">Description</div>
+                        <div className="domain-field-label" id="description-label">Description</div>
                         <textarea
+                            aria-labelledby="description-label"
                             className="form-control"
                             disabled={isFieldFullyLocked(field.lockType)}
                             id={createFormInputId(DOMAIN_FIELD_DESCRIPTION, domainIndex, index)}
@@ -115,8 +116,11 @@ export class NameAndLinkingOptions extends PureComponent<NameAndLinkingProps> {
                         />
                     </div>
                     <div className="col-xs-3">
-                        <div className="domain-field-label">Label</div>
+                        <div className="domain-field-label" id="label-label">
+                            Label
+                        </div>
                         <input
+                            aria-labelledby="label-label"
                             className="form-control"
                             disabled={isFieldFullyLocked(field.lockType)}
                             id={createFormInputId(DOMAIN_FIELD_LABEL, domainIndex, index)}
@@ -132,10 +136,12 @@ export class NameAndLinkingOptions extends PureComponent<NameAndLinkingProps> {
                                     <div className="domain-field-label">
                                         <DomainFieldLabel
                                             helpTipBody={this.getImportAliasHelpText()}
+                                            id="import-aliases-label"
                                             label="Import Aliases"
                                         />
                                     </div>
                                     <input
+                                        aria-labelledby="import-aliases-label"
                                         className="form-control"
                                         disabled={isFieldFullyLocked(field.lockType)}
                                         id={createFormInputId(DOMAIN_FIELD_IMPORTALIASES, domainIndex, index)}
@@ -164,9 +170,10 @@ export class NameAndLinkingOptions extends PureComponent<NameAndLinkingProps> {
                                     />
                                 )}
                             <div className="domain-field-label">
-                                <DomainFieldLabel helpTipBody={this.getURLHelpText()} label="URL" />
+                                <DomainFieldLabel helpTipBody={this.getURLHelpText()} id="url-label" label="URL" />
                             </div>
                             <input
+                                aria-labelledby="url-label"
                                 className="form-control"
                                 disabled={isFieldFullyLocked(field.lockType)}
                                 id={createFormInputId(DOMAIN_FIELD_URL, domainIndex, index)}
@@ -178,6 +185,7 @@ export class NameAndLinkingOptions extends PureComponent<NameAndLinkingProps> {
                             {/*GitHub Issue 503: Field editor URL option to set target window (i.e. _blank)*/}
                             <div className="domain-text-options-col">
                                 <input
+                                    aria-labelledby="new-window-label"
                                     checked={field.isTargetBlank}
                                     className="form-control domain-text-option-istargetblank"
                                     disabled={isFieldFullyLocked(field.lockType) || isEmptyString(field.URL)}
@@ -186,7 +194,7 @@ export class NameAndLinkingOptions extends PureComponent<NameAndLinkingProps> {
                                     onChange={this.handleURLTargetChange}
                                     type="checkbox"
                                 />
-                                <span>Open links in a new tab</span>
+                                <span id="new-window-label">Open links in a new tab</span>
                             </div>
                         </div>
                     )}
diff --git a/packages/components/src/internal/components/domainproperties/NameExpressionGenIdBanner.tsx b/packages/components/src/internal/components/domainproperties/NameExpressionGenIdBanner.tsx
index 41510b2767..e775805543 100644
--- a/packages/components/src/internal/components/domainproperties/NameExpressionGenIdBanner.tsx
+++ b/packages/components/src/internal/components/domainproperties/NameExpressionGenIdBanner.tsx
@@ -174,6 +174,7 @@ export const NameExpressionGenIdBanner: FC<NameExpressionGenIdProps> = props =>
                     <div className="row margin-top">
                         <div className="col-xs-5">
                             <input
+                                aria-label="GenId value"
                                 className="form-control update-genId-input "
                                 min={minNewGenId}
                                 step={1}
diff --git a/packages/components/src/internal/components/domainproperties/NumericFieldOptions.tsx b/packages/components/src/internal/components/domainproperties/NumericFieldOptions.tsx
index 4707fa598f..f7c1045edf 100644
--- a/packages/components/src/internal/components/domainproperties/NumericFieldOptions.tsx
+++ b/packages/components/src/internal/components/domainproperties/NumericFieldOptions.tsx
@@ -52,16 +52,17 @@ export class NumericFieldOptions extends React.PureComponent<NumericFieldProps>
                 <div className="row">
                     <div className="col-xs-3">
                         <div className="domain-field-label">
-                            <DomainFieldLabel label="Format for Numbers" helpTipBody={this.getFormatHelpText()} />
+                            <DomainFieldLabel helpTipBody={this.getFormatHelpText()} id="number-format-label" label="Format for Numbers"/>
                         </div>
                     </div>
                     <div className="col-xs-2">
-                        <div className="domain-field-label">Default Scale Type</div>
+                        <div className="domain-field-label" id="default-scale-label">Default Scale Type</div>
                     </div>
                 </div>
                 <div className="row">
                     <div className="col-xs-3">
                         <input
+                            aria-labelledby="number-format-label"
                             className="form-control"
                             type="text"
                             value={format || ''}
@@ -73,6 +74,7 @@ export class NumericFieldOptions extends React.PureComponent<NumericFieldProps>
                     </div>
                     <div className="col-xs-2">
                         <select
+                            aria-labelledby="default-scale-label"
                             className="form-control"
                             id={createFormInputId(DOMAIN_FIELD_DEFAULT_SCALE, domainIndex, index)}
                             disabled={isFieldFullyLocked(lockType)}
diff --git a/packages/components/src/internal/components/domainproperties/ParentAliasRow.tsx b/packages/components/src/internal/components/domainproperties/ParentAliasRow.tsx
index da35042e73..95e91e9bb3 100644
--- a/packages/components/src/internal/components/domainproperties/ParentAliasRow.tsx
+++ b/packages/components/src/internal/components/domainproperties/ParentAliasRow.tsx
@@ -119,6 +119,7 @@ export class ParentAliasRow extends React.Component<IParentAliasRow> {
                             })}
                         >
                             <input
+                                aria-label="Lineage import alias"
                                 className="form-control"
                                 ref={this.nameInput}
                                 name="alias"
@@ -132,6 +133,7 @@ export class ParentAliasRow extends React.Component<IParentAliasRow> {
                         <div className="col-xs-4 domain-field-alias--input">
                             {!hideRequiredCheck && (
                                 <input
+                                    aria-label="Lineage required"
                                     checked={required}
                                     disabled={false}
                                     name="required"
diff --git a/packages/components/src/internal/components/domainproperties/ScannableOption.tsx b/packages/components/src/internal/components/domainproperties/ScannableOption.tsx
index db500bc21f..26dc0375ad 100644
--- a/packages/components/src/internal/components/domainproperties/ScannableOption.tsx
+++ b/packages/components/src/internal/components/domainproperties/ScannableOption.tsx
@@ -41,6 +41,7 @@ export const ScannableOption: FC<ScannableProps> = memo(props => {
             <div className="row">
                 <div className="col-xs-12 domain-text-options-col">
                     <input
+                        aria-labelledby="barcode-field-label"
                         type="checkbox"
                         id={createFormInputId(DOMAIN_FIELD_SCANNABLE_OPTION, domainIndex, index)}
                         name={createFormInputName(DOMAIN_FIELD_SCANNABLE_OPTION)}
@@ -49,7 +50,7 @@ export const ScannableOption: FC<ScannableProps> = memo(props => {
                         disabled={isFieldFullyLocked(lockType)}
                         checked={scannable}
                     />
-                    <span>Search this field when scanning samples</span>
+                    <span id="barcode-field-label">Search this field when scanning samples</span>
                 </div>
             </div>
         </>
diff --git a/packages/components/src/internal/components/domainproperties/SectionHeading.tsx b/packages/components/src/internal/components/domainproperties/SectionHeading.tsx
index 5fc6547e54..cd0044cd1b 100644
--- a/packages/components/src/internal/components/domainproperties/SectionHeading.tsx
+++ b/packages/components/src/internal/components/domainproperties/SectionHeading.tsx
@@ -5,11 +5,12 @@ import { LabelHelpTip } from '../base/LabelHelpTip';
 interface Props {
     cls?: string;
     helpTipBody?: ReactNode;
+    id?: string;
     title: string;
 }
 
 export const SectionHeading: FC<Props> = memo(props => (
-    <div className={'domain-field-section-heading' + (props.cls ? ' ' + props.cls : '')}>
+    <div className={'domain-field-section-heading' + (props.cls ? ' ' + props.cls : '')} id={props.id}>
         {props.title}
         {props.helpTipBody && <LabelHelpTip title={props.title}>{props.helpTipBody}</LabelHelpTip>}
     </div>
diff --git a/packages/components/src/internal/components/domainproperties/SystemFields.tsx b/packages/components/src/internal/components/domainproperties/SystemFields.tsx
index 9b9fa8ee84..d8c567ea57 100644
--- a/packages/components/src/internal/components/domainproperties/SystemFields.tsx
+++ b/packages/components/src/internal/components/domainproperties/SystemFields.tsx
@@ -36,6 +36,7 @@ const SYSTEM_FIELD_GRID_COLS = [
             return (
                 // eslint-disable-next-line react/jsx-no-bind
                 <input
+                    aria-label="Required"
                     className="grid-panel__row-checkbox"
                     type="checkbox"
                     disabled={true}
@@ -85,6 +86,7 @@ export const SystemFields: FC<Props> = memo(({ fields, disabledSystemFields, onS
                 return (
                     // eslint-disable-next-line react/jsx-no-bind
                     <input
+                        aria-label="Disableable"
                         className="grid-panel__row-checkbox"
                         type="checkbox"
                         disabled={!row.get('Disableable')}
diff --git a/packages/components/src/internal/components/domainproperties/TextFieldOptions.tsx b/packages/components/src/internal/components/domainproperties/TextFieldOptions.tsx
index c3e279cbc2..f2fab9a480 100644
--- a/packages/components/src/internal/components/domainproperties/TextFieldOptions.tsx
+++ b/packages/components/src/internal/components/domainproperties/TextFieldOptions.tsx
@@ -77,6 +77,7 @@ export class TextFieldOptions extends React.PureComponent<TextFieldProps, TextFi
         const { radio } = this.state;
         const textOptionsFormControl = (
             <input
+                aria-label="Maximum Text Length"
                 type="number"
                 id={createFormInputId(DOMAIN_FIELD_SCALE, domainIndex, index)}
                 name={createFormInputName(DOMAIN_FIELD_SCALE)}
@@ -104,6 +105,7 @@ export class TextFieldOptions extends React.PureComponent<TextFieldProps, TextFi
                 <div className="row">
                     <div className="col-xs-12 domain-text-options-col">
                         <input
+                            aria-labelledby="unlimited-length-label"
                             type="radio"
                             className="form-control domain-text-options-radio1 domain-field-float-left"
                             value={DOMAIN_FIELD_MAX_LENGTH}
@@ -112,12 +114,13 @@ export class TextFieldOptions extends React.PureComponent<TextFieldProps, TextFi
                             id={createFormInputId(DOMAIN_FIELD_MAX_LENGTH, domainIndex, index)}
                             disabled={isFieldFullyLocked(lockType)}
                         />
-                        <div>Unlimited</div>
+                        <div id="unlimited-length-label">Unlimited</div>
                     </div>
                 </div>
                 <div className="row">
                     <div className="col-xs-12">
                         <input
+                            aria-labelledby="custom-length-label"
                             type="radio"
                             className="form-control domain-text-options-radio2 domain-field-float-left"
                             value={DOMAIN_FIELD_CUSTOM_LENGTH}
@@ -125,7 +128,7 @@ export class TextFieldOptions extends React.PureComponent<TextFieldProps, TextFi
                             onChange={this.handleChange}
                             id={createFormInputId(DOMAIN_FIELD_CUSTOM_LENGTH, domainIndex, index)}
                         />
-                        <span className="domain-text-options-length domain-field-float-left">
+                        <span className="domain-text-options-length domain-field-float-left" id="custom-length-label">
                             No longer than {textOptionsFormControl} characters
                         </span>
                     </div>
diff --git a/packages/components/src/internal/components/domainproperties/assay/AssayPropertiesInput.tsx b/packages/components/src/internal/components/domainproperties/assay/AssayPropertiesInput.tsx
index 245e68a69f..e33cb0bcc3 100644
--- a/packages/components/src/internal/components/domainproperties/assay/AssayPropertiesInput.tsx
+++ b/packages/components/src/internal/components/domainproperties/assay/AssayPropertiesInput.tsx
@@ -78,6 +78,7 @@ interface InputProps {
 export const NameInput: FC<InputProps> = memo(props => (
     <AssayPropertiesInput hideAdvancedProperties={props.hideAdvancedProperties} label="Name" required={true}>
         <input
+            aria-label="Name"
             className="form-control"
             disabled={!props.model.isNew() && !props.canRename}
             id={FORM_IDS.ASSAY_NAME}
@@ -98,6 +99,7 @@ export const DescriptionInput: FC<InputProps> = memo(props => (
         label="Description"
     >
         <textarea
+            aria-label="Description"
             className="form-control"
             id={FORM_IDS.ASSAY_DESCRIPTION}
             onChange={props.onChange}
@@ -117,7 +119,7 @@ export const QCStatesInput: FC<InputProps> = memo(props => (
         }
         label="QC States"
     >
-        <input checked={props.model.qcEnabled} id={FORM_IDS.QC_ENABLED} onChange={props.onChange} type="checkbox" />
+        <input aria-label="QC States" checked={props.model.qcEnabled} id={FORM_IDS.QC_ENABLED} onChange={props.onChange} type="checkbox" />
     </AssayPropertiesInput>
 ));
 QCStatesInput.displayName = 'QCStatesInput';
@@ -225,7 +227,7 @@ export const AssayStatusInput: FC<InputProps> = memo(props => (
         hideAdvancedProperties={props.hideAdvancedProperties}
         label="Active"
     >
-        <input checked={props.model.isActive()} id={FORM_IDS.STATUS} onChange={props.onChange} type="checkbox" />
+        <input aria-label="Active" checked={props.model.isActive()} id={FORM_IDS.STATUS} onChange={props.onChange} type="checkbox" />
     </AssayPropertiesInput>
 ));
 AssayStatusInput.displayName = 'AssayStatusInput';
@@ -242,6 +244,7 @@ export const EditableRunsInput: FC<InputProps> = memo((props: InputProps) => (
         label="Editable Runs"
     >
         <input
+            aria-label="Editable Runs"
             checked={props.model.editableRuns}
             id={FORM_IDS.EDITABLE_RUNS}
             onChange={props.onChange}
@@ -271,6 +274,7 @@ export const EditableResultsInput: FC<InputProps> = memo(props => (
         label="Editable Results"
     >
         <input
+            aria-label="Editable Results"
             checked={props.model.editableResults}
             id={FORM_IDS.EDITABLE_RESULTS}
             onChange={props.onChange}
@@ -291,6 +295,7 @@ export const BackgroundUploadInput: FC<InputProps> = memo(props => (
         label="Import in Background"
     >
         <input
+            aria-label="Import in Background"
             checked={props.model.backgroundUpload}
             id={FORM_IDS.BACKGROUND_UPLOAD}
             onChange={props.onChange}
@@ -371,6 +376,7 @@ export const AutoLinkCategoryInput: FC<InputProps> = memo(({ model, onChange })
         label="Linked Dataset Category"
     >
         <input
+            aria-label="Linked Dataset Category"
             className="form-control"
             id={FORM_IDS.AUTO_LINK_CATEGORY}
             onChange={onChange}
@@ -630,6 +636,7 @@ export class TransformScriptsInput extends React.PureComponent<TransformScriptsI
                                     <div className="margin-bottom small-margin-top">
                                         <span className="margin-right-more">
                                             <input
+                                                aria-label="Run on Import"
                                                 checked={attachment.runOnImport}
                                                 id={FORM_IDS.PROTOCOL_TRANSFORM_SCRIPTS + i}
                                                 onChange={this.onCheckRunOnImport}
@@ -640,6 +647,7 @@ export class TransformScriptsInput extends React.PureComponent<TransformScriptsI
 
                                         <span>
                                             <input
+                                                aria-label="Run on Edit"
                                                 checked={attachment.runOnEdit}
                                                 disabled={!model.editableResults}
                                                 id={FORM_IDS.PROTOCOL_TRANSFORM_SCRIPTS + i}
@@ -663,6 +671,7 @@ export class TransformScriptsInput extends React.PureComponent<TransformScriptsI
                         )}
                         <div className="col col-xs-8 col-lg-8">
                             <input
+                                aria-labelledby="transform-script-file-label"
                                 checked={addingScript === AddingScriptType.file}
                                 className="transform-script-add--radio"
                                 name="transformScriptAddType"
@@ -673,11 +682,13 @@ export class TransformScriptsInput extends React.PureComponent<TransformScriptsI
                             <div
                                 className="transform-script-add--label"
                                 data-value="file"
+                                id="transform-script-file-label"
                                 onClick={this.onChangeAddingScriptType}
                             >
                                 Upload file
                             </div>
                             <input
+                                aria-labelledby="transform-script-path-label"
                                 checked={addingScript === AddingScriptType.path}
                                 className="transform-script-add--radio"
                                 name="transformScriptAddType"
@@ -688,6 +699,7 @@ export class TransformScriptsInput extends React.PureComponent<TransformScriptsI
                             <div
                                 className="transform-script-add--label"
                                 data-value="path"
+                                id="transform-script-path-label"
                                 onClick={this.onChangeAddingScriptType}
                             >
                                 Enter file path
@@ -708,6 +720,7 @@ export class TransformScriptsInput extends React.PureComponent<TransformScriptsI
                             {addingScript === AddingScriptType.path && (
                                 <div className="transform-script-add--path">
                                     <input
+                                        aria-label="Script path"
                                         className="form-control"
                                         onChange={this.onScriptPathChange}
                                         type="text"
@@ -777,7 +790,13 @@ export const SaveScriptDataInput: FC<InputProps> = memo(({ model, onChange }) =>
         }
         label="Save Script Data for Debugging"
     >
-        <input checked={model.saveScriptFiles} id={FORM_IDS.SAVE_SCRIPT_FILES} onChange={onChange} type="checkbox" />
+        <input
+            aria-label="Save Script Data for Debugging"
+            checked={model.saveScriptFiles}
+            id={FORM_IDS.SAVE_SCRIPT_FILES}
+            onChange={onChange}
+            type="checkbox"
+        />
         {!model.isNew() && (
             <div className="transform-script--download-link">
                 <a
@@ -806,7 +825,13 @@ export const PlateMetadataInput: FC<InputProps> = memo(({ model, onChange }) =>
         }
         label="Plate Metadata"
     >
-        <input checked={model.plateMetadata} id={FORM_IDS.PLATE_METADATA} onChange={onChange} type="checkbox" />
+        <input
+            aria-label="Plate Metadata"
+            checked={model.plateMetadata}
+            id={FORM_IDS.PLATE_METADATA}
+            onChange={onChange}
+            type="checkbox"
+        />
     </AssayPropertiesInput>
 ));
 PlateMetadataInput.displayName = 'PlateMetadataInput';
diff --git a/packages/components/src/internal/components/domainproperties/dataset/DatasetPropertiesAdvancedSettings.tsx b/packages/components/src/internal/components/domainproperties/dataset/DatasetPropertiesAdvancedSettings.tsx
index bb990f2c7e..80fdf0cf43 100644
--- a/packages/components/src/internal/components/domainproperties/dataset/DatasetPropertiesAdvancedSettings.tsx
+++ b/packages/components/src/internal/components/domainproperties/dataset/DatasetPropertiesAdvancedSettings.tsx
@@ -101,6 +101,7 @@ export class DatasetSettingsInput extends React.PureComponent<DatasetSettingsInp
 
                 <div className="col-xs-7">
                     <input
+                        aria-label={label}
                         className="form-control"
                         id={name}
                         type="text"
diff --git a/packages/components/src/internal/components/domainproperties/entities/EntityDetailsForm.tsx b/packages/components/src/internal/components/domainproperties/entities/EntityDetailsForm.tsx
index 8c189e1cb5..9cf9d050f4 100644
--- a/packages/components/src/internal/components/domainproperties/entities/EntityDetailsForm.tsx
+++ b/packages/components/src/internal/components/domainproperties/entities/EntityDetailsForm.tsx
@@ -66,6 +66,7 @@ export class EntityDetailsForm extends React.PureComponent<EntityDetailsProps> {
                     </div>
                     <div className="col-xs-10">
                         <input
+                            aria-label="Name"
                             className="form-control"
                             id={ENTITY_FORM_IDS.NAME}
                             type="text"
@@ -91,6 +92,7 @@ export class EntityDetailsForm extends React.PureComponent<EntityDetailsProps> {
                     </div>
                     <div className="col-xs-10">
                         <textarea
+                            aria-label="Description"
                             className="form-control"
                             id={ENTITY_FORM_IDS.DESCRIPTION}
                             onChange={onFormChange}
@@ -128,14 +130,15 @@ export class EntityDetailsForm extends React.PureComponent<EntityDetailsProps> {
                     </div>
                     <div className="col-xs-10">
                         <input
+                            aria-label="Naming Pattern"
                             className={classNames('form-control', {
                                 'naming-pattern-border-warning':
                                     warning !== undefined && !warning.startsWith('Aliquot'),
                             })}
                             id={ENTITY_FORM_IDS.NAME_EXPRESSION}
-                            type="text"
-                            placeholder={nameExpressionPlaceholder}
                             onChange={onFormChange}
+                            placeholder={nameExpressionPlaceholder}
+                            type="text"
                             value={getEntityNameExpressionValue(formValues, data)}
                         />
                     </div>
diff --git a/packages/components/src/internal/components/domainproperties/issues/IssuesListDefPropertiesPanelFormElements.tsx b/packages/components/src/internal/components/domainproperties/issues/IssuesListDefPropertiesPanelFormElements.tsx
index fd4c2caa6f..ea39a90f11 100644
--- a/packages/components/src/internal/components/domainproperties/issues/IssuesListDefPropertiesPanelFormElements.tsx
+++ b/packages/components/src/internal/components/domainproperties/issues/IssuesListDefPropertiesPanelFormElements.tsx
@@ -149,6 +149,7 @@ export class SingularItemNameInput extends PureComponent<IssuesListDefBasicPrope
             <div className="row margin-top">
                 <div className="col-xs-3 col-lg-4">
                     <DomainFieldLabel
+                        id="singular-item-name-label"
                         label="Singular Item Name"
                         helpTipBody={ISSUES_LIST_DEF_SINGULAR_PLURAL_TIP}
                         required={false}
@@ -157,6 +158,7 @@ export class SingularItemNameInput extends PureComponent<IssuesListDefBasicPrope
 
                 <div className="col-xs-9 col-lg-8">
                     <input
+                        aria-labelledby="singular-item-name-label"
                         className="form-control"
                         id="singularItemName"
                         type="text"
@@ -177,6 +179,7 @@ export class PluralItemNameInput extends PureComponent<IssuesListDefBasicPropert
             <div className="row margin-top">
                 <div className="col-xs-3 col-lg-4">
                     <DomainFieldLabel
+                        id="plural-items-name-label"
                         label="Plural Items Name"
                         helpTipBody={ISSUES_LIST_DEF_SINGULAR_PLURAL_TIP}
                         required={false}
@@ -185,6 +188,7 @@ export class PluralItemNameInput extends PureComponent<IssuesListDefBasicPropert
 
                 <div className="col-xs-9 col-lg-8">
                     <input
+                        aria-labelledby="plural-items-name-label"
                         className="form-control"
                         id="pluralItemName"
                         type="text"
@@ -361,10 +365,15 @@ export class RestrictedIssueInput extends PureComponent<RestrictedOptionsProps>
         return (
             <div className="row margin-top">
                 <div className="col-xs-3 col-lg-4">
-                    <DomainFieldLabel label="Restrict Issue List" helpTipBody={ISSUES_LIST_RESTRICTED_TRACKER_TIP} />
+                    <DomainFieldLabel
+                        id="restrict-issue-list-label"
+                        label="Restrict Issue List"
+                        helpTipBody={ISSUES_LIST_RESTRICTED_TRACKER_TIP}
+                    />
                 </div>
                 <div className="col-xs-9 col-lg-8">
                     <input
+                        aria-labelledby="restrict-issue-list-label"
                         type="checkbox"
                         name="restrictedIssueList"
                         checked={model.restrictedIssueList}
diff --git a/packages/components/src/internal/components/domainproperties/list/ListPropertiesAdvancedSettings.tsx b/packages/components/src/internal/components/domainproperties/list/ListPropertiesAdvancedSettings.tsx
index 082687613d..67f7a23b7c 100644
--- a/packages/components/src/internal/components/domainproperties/list/ListPropertiesAdvancedSettings.tsx
+++ b/packages/components/src/internal/components/domainproperties/list/ListPropertiesAdvancedSettings.tsx
@@ -72,9 +72,10 @@ interface TitleIndexFieldProps {
 
 const TitleIndexField: FC<TitleIndexFieldProps> = memo(({ name, titleTemplate, onInputChange }) => (
     <div>
-        <DomainFieldLabel label="Document title" helpTipBody={DOCUMENT_TITLE_TIP} />
+        <DomainFieldLabel id="document-title-label" label="Document title" helpTipBody={DOCUMENT_TITLE_TIP} />
         <span>
             <input
+                aria-describedby="document-title-label"
                 className="form-control list__advanced-settings-modal__text-field"
                 id={name}
                 type="text"
@@ -144,6 +145,7 @@ export const IndexField: FC<IndexFieldProps> = memo(props => {
 
             {bodySetting === 2 && (
                 <input
+                    aria-label="Custom index template"
                     id={id}
                     type="text"
                     value={bodyTemplate}
diff --git a/packages/components/src/internal/components/domainproperties/list/ListPropertiesPanelFormElements.tsx b/packages/components/src/internal/components/domainproperties/list/ListPropertiesPanelFormElements.tsx
index 9d2ed68cc5..63105014e1 100644
--- a/packages/components/src/internal/components/domainproperties/list/ListPropertiesPanelFormElements.tsx
+++ b/packages/components/src/internal/components/domainproperties/list/ListPropertiesPanelFormElements.tsx
@@ -14,6 +14,7 @@ export const NameInput: FC<BasicPropertiesInputsProps> = memo(({ model, onInputC
     <div className="row margin-top">
         <div className="col-xs-3 col-lg-2">
             <DomainFieldLabel
+                id="name-label"
                 label="Name"
                 required={true}
                 helpTipBody="The name for this list. Note that this can be changed after list creation."
@@ -22,6 +23,7 @@ export const NameInput: FC<BasicPropertiesInputsProps> = memo(({ model, onInputC
 
         <div className="col-xs-9 col-lg-8">
             <input
+                aria-labelledby="name-label"
                 className="form-control"
                 id="name"
                 type="text"
diff --git a/packages/components/src/internal/components/domainproperties/samples/SampleTypePropertiesPanel.tsx b/packages/components/src/internal/components/domainproperties/samples/SampleTypePropertiesPanel.tsx
index 71fbbe9c22..fdb01af8da 100644
--- a/packages/components/src/internal/components/domainproperties/samples/SampleTypePropertiesPanel.tsx
+++ b/packages/components/src/internal/components/domainproperties/samples/SampleTypePropertiesPanel.tsx
@@ -492,12 +492,14 @@ class SampleTypePropertiesPanelImpl extends PureComponent<InjectedDomainProperti
                                             </p>
                                         </>
                                     }
+                                    id="aliquot-name-expression-label"
                                     label="Aliquot Naming Pattern"
                                 />
                             </div>
                         </div>
                         <div className="col-xs-10">
                             <input
+                                aria-labelledby="aliquot-name-expression-label"
                                 className={classNames('form-control', {
                                     'naming-pattern-border-warning': warning?.startsWith('Aliquot'),
                                 })}
@@ -561,6 +563,7 @@ class SampleTypePropertiesPanelImpl extends PureComponent<InjectedDomainProperti
                         <div className="row margin-top">
                             <div className="col-xs-2">
                                 <DomainFieldLabel
+                                    id="linked-dataset-category-label"
                                     helpTipBody={<LinkedDatasetCategoryHelpTip />}
                                     label="Linked Dataset Category"
                                 />
@@ -568,6 +571,7 @@ class SampleTypePropertiesPanelImpl extends PureComponent<InjectedDomainProperti
 
                             <div className="col-xs-5">
                                 <input
+                                    aria-labelledby="linked-dataset-category-label"
                                     className="form-control"
                                     id={ENTITY_FORM_IDS.AUTO_LINK_CATEGORY}
                                     onChange={this.onFormChange}
diff --git a/packages/components/src/internal/components/domainproperties/validation/ConditionalFormatOptions.tsx b/packages/components/src/internal/components/domainproperties/validation/ConditionalFormatOptions.tsx
index efe079f6dc..88a5493082 100644
--- a/packages/components/src/internal/components/domainproperties/validation/ConditionalFormatOptions.tsx
+++ b/packages/components/src/internal/components/domainproperties/validation/ConditionalFormatOptions.tsx
@@ -132,6 +132,7 @@ export class ConditionalFormatOptions extends PureComponent<ConditionalFormatOpt
                 </div>
                 <div className="col-xs-3">
                     <input
+                        aria-label="Preview text"
                         className="form-control"
                         defaultValue="Preview Text"
                         id={'domain-validator-preview-' + validatorIndex}
diff --git a/packages/components/src/internal/components/domainproperties/validation/Filters.tsx b/packages/components/src/internal/components/domainproperties/validation/Filters.tsx
index 13b8d2df16..8a6f8b2a54 100644
--- a/packages/components/src/internal/components/domainproperties/validation/Filters.tsx
+++ b/packages/components/src/internal/components/domainproperties/validation/Filters.tsx
@@ -319,6 +319,7 @@ export class Filters extends React.PureComponent<FiltersProps, FiltersState> {
                     <div className="col-xs-8">
                         <div>
                             <select
+                                aria-labelledby="domain-filter-type-label-1"
                                 className="form-control"
                                 id={createFormInputId(DOMAIN_FIRST_FILTER_TYPE, domainIndex, validatorIndex)}
                                 name={createFormInputName(DOMAIN_FIRST_FILTER_TYPE)}
@@ -350,6 +351,7 @@ export class Filters extends React.PureComponent<FiltersProps, FiltersState> {
                     <div className="col-xs-8">
                         <div>
                             <input
+                                aria-labelledby="domain-filter-value-label-1"
                                 className="form-control"
                                 type={this.getFormControlType()}
                                 id={createFormInputId(DOMAIN_FIRST_FILTER_VALUE, domainIndex, validatorIndex)}
@@ -372,6 +374,7 @@ export class Filters extends React.PureComponent<FiltersProps, FiltersState> {
                     <div className="col-xs-8">
                         <div>
                             <select
+                                aria-labelledby="domain-filter-type-label-2"
                                 className="form-control"
                                 id={createFormInputId(DOMAIN_SECOND_FILTER_TYPE, domainIndex, validatorIndex)}
                                 name={createFormInputName(DOMAIN_SECOND_FILTER_TYPE)}
@@ -396,6 +399,7 @@ export class Filters extends React.PureComponent<FiltersProps, FiltersState> {
                     <div className="col-xs-8">
                         <div>
                             <input
+                                aria-labelledby="domain-filter-value-label-2"
                                 className="form-control"
                                 type={this.getFormControlType()}
                                 id={createFormInputId(DOMAIN_SECOND_FILTER_VALUE, domainIndex, validatorIndex)}
diff --git a/packages/components/src/internal/components/domainproperties/validation/RangeValidationOptions.tsx b/packages/components/src/internal/components/domainproperties/validation/RangeValidationOptions.tsx
index 50f8b27af9..e40b414d61 100644
--- a/packages/components/src/internal/components/domainproperties/validation/RangeValidationOptions.tsx
+++ b/packages/components/src/internal/components/domainproperties/validation/RangeValidationOptions.tsx
@@ -126,11 +126,12 @@ export class RangeValidationOptions extends PureComponent<RangeValidationOptions
                         {this.renderRowTextbox('Error Message', DOMAIN_VALIDATOR_ERRORMESSAGE, validator.errorMessage)}
 
                         <div className="row">
-                            <div className="col-xs-4">
+                            <div className="col-xs-4" id="name-label">
                                 <div>Name *</div>
                             </div>
                             <div className="col-xs-8">
                                 <input
+                                    aria-labelledby="name-label"
                                     className="form-control"
                                     type="text"
                                     id={createFormInputId(DOMAIN_VALIDATOR_NAME, domainIndex, validatorIndex)}
diff --git a/packages/components/src/internal/components/domainproperties/validation/RegexValidationOptions.tsx b/packages/components/src/internal/components/domainproperties/validation/RegexValidationOptions.tsx
index 7079102155..0469cb31a4 100644
--- a/packages/components/src/internal/components/domainproperties/validation/RegexValidationOptions.tsx
+++ b/packages/components/src/internal/components/domainproperties/validation/RegexValidationOptions.tsx
@@ -149,11 +149,12 @@ export class RegexValidationOptions extends React.PureComponent<RegexValidationO
                             </div>
                         </div>
                         <div className="row">
-                            <div className="col-xs-4">
+                            <div className="col-xs-4" id="name-label">
                                 <div>Name *</div>
                             </div>
                             <div className="col-xs-8">
                                 <input
+                                    aria-labelledby="name-label"
                                     className="form-control"
                                     type="text"
                                     id={createFormInputId(DOMAIN_VALIDATOR_NAME, domainIndex, validatorIndex)}
diff --git a/packages/components/src/internal/components/entities/DataTypeSelector.tsx b/packages/components/src/internal/components/entities/DataTypeSelector.tsx
index 841a9b4881..7222e06067 100644
--- a/packages/components/src/internal/components/entities/DataTypeSelector.tsx
+++ b/packages/components/src/internal/components/entities/DataTypeSelector.tsx
@@ -107,6 +107,7 @@ export const DataTypeSelectorItem: FC<DataTypeSelectorItemProps> = memo(props =>
         <li key={entityId} className="folder-faceted-data-type">
             <div className="form-check">
                 <input
+                    aria-label={dataType.label}
                     className="form-check-input filter-faceted__checkbox"
                     type="checkbox"
                     name={'field-value-' + index}
diff --git a/packages/components/src/internal/components/forms/QueryFormInputs.tsx b/packages/components/src/internal/components/forms/QueryFormInputs.tsx
index 93649a3ddb..37c232afbd 100644
--- a/packages/components/src/internal/components/forms/QueryFormInputs.tsx
+++ b/packages/components/src/internal/components/forms/QueryFormInputs.tsx
@@ -23,7 +23,7 @@ import { insertColumnFilter, Operation, QueryColumn } from '../../../public/Quer
 
 import { QueryInfo } from '../../../public/QueryInfo';
 
-import { caseInsensitive } from '../../util/utils';
+import { caseInsensitive, stringToHtmlId } from '../../util/utils';
 
 import { getContainerFilterForLookups } from '../../query/api';
 
@@ -157,7 +157,14 @@ export class QueryFormInputs extends React.Component<QueryFormInputsProps, State
 
         if (includeLabelField) {
             const fieldName = getQueryFormLabelFieldName(col.name);
-            return <FormsyInput name={fieldName} type="hidden" value={this.state.labels[fieldName]} />;
+            return (
+                <FormsyInput
+                    id={stringToHtmlId(col.name)}
+                    name={fieldName}
+                    type="hidden"
+                    value={this.state.labels[fieldName]}
+                />
+            );
         }
 
         return null;
diff --git a/packages/components/src/internal/components/forms/QueryInfoQuantity.tsx b/packages/components/src/internal/components/forms/QueryInfoQuantity.tsx
index fb58b73f1a..693eb4a2b6 100644
--- a/packages/components/src/internal/components/forms/QueryInfoQuantity.tsx
+++ b/packages/components/src/internal/components/forms/QueryInfoQuantity.tsx
@@ -89,9 +89,9 @@ export class QueryInfoQuantity extends PureComponent<Props, State> {
                         id="numItems"
                         label={text}
                         labelClassName="control-label text-left"
-                        name="numItems"
                         max={maxCount}
                         min={1}
+                        name="numItems"
                         onChange={this.onCountChange}
                         required
                         step="1"
diff --git a/packages/components/src/internal/components/forms/input/AmountUnitInput.tsx b/packages/components/src/internal/components/forms/input/AmountUnitInput.tsx
index 71ad895c8c..597397cc31 100644
--- a/packages/components/src/internal/components/forms/input/AmountUnitInput.tsx
+++ b/packages/components/src/internal/components/forms/input/AmountUnitInput.tsx
@@ -6,7 +6,7 @@ import { QuerySelect } from '../QuerySelect';
 import { getContainerFilterForLookups } from '../../../query/api';
 import { FieldLabel } from '../FieldLabel';
 import { InputRendererProps } from './types';
-import { caseInsensitive, generateId, getInvalidSampleAmountMessage } from '../../../util/utils';
+import { caseInsensitive, generateId, getInvalidSampleAmountMessage, stringToHtmlId } from '../../../util/utils';
 import { FormsyInput } from './FormsyReactComponents';
 import { Operation } from '../../../../public/QueryColumn';
 import { STORED_AMOUNT_FIELDS } from '../../samples/constants';
@@ -58,6 +58,7 @@ export const AmountUnitInput: FC<InputRendererProps> = memo(props => {
         return null;
     }
 
+    // TODO this still results in an empty form label
     return (
         <>
             <div className="form-group row">
@@ -66,7 +67,6 @@ export const AmountUnitInput: FC<InputRendererProps> = memo(props => {
                     id={id}
                     isDisabled={disabled}
                     labelOverlayProps={{
-                        inputId: amountCol.name,
                         description: 'The amount and units of this sample currently on hand.',
                         label: 'Amount and Units',
                         isFormsy: false,
@@ -78,6 +78,7 @@ export const AmountUnitInput: FC<InputRendererProps> = memo(props => {
                     }}
                 />
                 <TextInput
+                    aria-label="Amount"
                     disableInput={disabled}
                     elementWrapperClassName=""
                     hasMixedValue={hasMixedAmountValue}
@@ -113,7 +114,12 @@ export const AmountUnitInput: FC<InputRendererProps> = memo(props => {
                     valueColumn={unitCol.lookup.keyColumn}
                 />
                 {allowFieldDisable && (
-                    <FormsyInput name={unitCol.name + '::enabled'} type="hidden" value={disabled ? 'false' : 'true'} />
+                    <FormsyInput
+                        id={stringToHtmlId(unitCol.name)}
+                        name={unitCol.name + '::enabled'}
+                        type="hidden"
+                        value={disabled ? 'false' : 'true'}
+                    />
                 )}
             </div>
             <Alert>{amountError}</Alert>
diff --git a/packages/components/src/internal/components/forms/input/CheckboxInput.tsx b/packages/components/src/internal/components/forms/input/CheckboxInput.tsx
index e777b4cebc..65dea1ccdd 100644
--- a/packages/components/src/internal/components/forms/input/CheckboxInput.tsx
+++ b/packages/components/src/internal/components/forms/input/CheckboxInput.tsx
@@ -146,6 +146,7 @@ class CheckboxInputImpl extends DisableableInput<CheckboxInputImplProps, Checkbo
                         />
                     ) : (
                         <input
+                            aria-label={label}
                             checked={checked}
                             disabled={isDisabled}
                             id={queryColumn.fieldKey}
diff --git a/packages/components/src/internal/components/forms/input/RadioGroupInput.tsx b/packages/components/src/internal/components/forms/input/RadioGroupInput.tsx
index 971f59ecd6..279a1c63e3 100644
--- a/packages/components/src/internal/components/forms/input/RadioGroupInput.tsx
+++ b/packages/components/src/internal/components/forms/input/RadioGroupInput.tsx
@@ -102,7 +102,15 @@ const RadioGroupInputImpl: FC<RadioGroupInputProps> = memo(props => {
     if (options?.length === 1) {
         return (
             <div className="radio-input-wrapper" key={options[0].value}>
-                <input checked hidden name={name} onChange={onValueChange_} type="radio" value={options[0].value} />
+                <input
+                    aria-label={options[0].value ?? 'null'}
+                    checked
+                    hidden
+                    name={name}
+                    onChange={onValueChange_}
+                    type="radio"
+                    value={options[0].value}
+                />
             </div>
         );
     }
diff --git a/packages/components/src/internal/components/labelPrinting/BarTenderSettingsForm.tsx b/packages/components/src/internal/components/labelPrinting/BarTenderSettingsForm.tsx
index 8e2d63f942..64d81dd502 100644
--- a/packages/components/src/internal/components/labelPrinting/BarTenderSettingsForm.tsx
+++ b/packages/components/src/internal/components/labelPrinting/BarTenderSettingsForm.tsx
@@ -49,7 +49,7 @@ const SettingsInput: FC<SettingsInputProps> = memo(({ children, description, lab
         <div className="form-group">
             <div>
                 {children}
-                <div>
+                <div id="settings-label">
                     {label}{' '}
                     <LabelHelpTip title={label}>
                         <p>{description}</p>
@@ -58,6 +58,7 @@ const SettingsInput: FC<SettingsInputProps> = memo(({ children, description, lab
             </div>
             <div>
                 <input
+                    aria-labelledby="settings-label"
                     className="form-control"
                     id={name}
                     name={name}
diff --git a/packages/components/src/internal/components/labelPrinting/LabelsConfigurationPanel.tsx b/packages/components/src/internal/components/labelPrinting/LabelsConfigurationPanel.tsx
index 254dc5b910..4a81cb20e9 100644
--- a/packages/components/src/internal/components/labelPrinting/LabelsConfigurationPanel.tsx
+++ b/packages/components/src/internal/components/labelPrinting/LabelsConfigurationPanel.tsx
@@ -242,10 +242,11 @@ export const LabelTemplateDetails: FC<LabelTemplateDetailsProps> = memo(props =>
                     {error && <Alert>{error}</Alert>}
                     <div className="form-group">
                         <div className="col-sm-4">
-                            <DomainFieldLabel label="Name" required />
+                            <DomainFieldLabel id="name-label" label="Name" required />
                         </div>
                         <div className="col-sm-8">
                             <input
+                                aria-labelledby="name-label"
                                 className="form-control"
                                 name="name"
                                 onChange={onFormChange}
@@ -272,7 +273,7 @@ export const LabelTemplateDetails: FC<LabelTemplateDetailsProps> = memo(props =>
                     </div>
                     <div className="form-group">
                         <div className="col-sm-4">
-                            <DomainFieldLabel label="File Path" required />
+                            <DomainFieldLabel id="file-path-label" label="File Path" required />
                             <LabelHelpTip title="BarTender Label Template">
                                 <p>
                                     Provide the label template to use with BarTender. The path should be relative to the
@@ -282,6 +283,7 @@ export const LabelTemplateDetails: FC<LabelTemplateDetailsProps> = memo(props =>
                         </div>
                         <div className="col-sm-8">
                             <input
+                                aria-labelledby="file-path-label"
                                 className="form-control"
                                 name="path"
                                 onChange={onFormChange}
@@ -295,9 +297,10 @@ export const LabelTemplateDetails: FC<LabelTemplateDetailsProps> = memo(props =>
                     {isDefaultable && (
                         <div className="form-group">
                             <div className="col-sm-4">
-                                <DomainFieldLabel label="Default Template" />
+                                <DomainFieldLabel id="default-template-label" label="Default Template" />
                             </div>
                             <input
+                                aria-labelledby="default-template-label"
                                 style={{ margin: '0 15px' }}
                                 name="isDefault"
                                 checked={isDefault}
diff --git a/packages/components/src/internal/components/labelPrinting/PrintLabelsModal.tsx b/packages/components/src/internal/components/labelPrinting/PrintLabelsModal.tsx
index eebe63387d..b514a599ab 100644
--- a/packages/components/src/internal/components/labelPrinting/PrintLabelsModal.tsx
+++ b/packages/components/src/internal/components/labelPrinting/PrintLabelsModal.tsx
@@ -223,9 +223,10 @@ export class PrintLabelsModalImpl extends PureComponent<PrintModalProps & Inject
                 <>
                     <div className="bottom-padding">{message}</div>
                     <div>
-                        <label>Number of copies</label>
+                        <label htmlFor="num-copies">Number of copies</label>
                         <input
                             className="form-control label-printing--copies"
+                            id="num-copies"
                             min={1}
                             name="numCopies"
                             onChange={this.onCopyCountChange}
@@ -234,7 +235,7 @@ export class PrintLabelsModalImpl extends PureComponent<PrintModalProps & Inject
                         />
                         {showSelection && (
                             <div className="top-padding">
-                                <label>Selected samples to print</label>
+                                <label htmlFor="label-samples">Selected samples to print</label>
                                 <QuerySelect
                                     formsy={false}
                                     fireQSChangeOnInit={true}
@@ -254,7 +255,7 @@ export class PrintLabelsModalImpl extends PureComponent<PrintModalProps & Inject
                             </div>
                         )}
                         <div className="top-padding">
-                            <label>Label template</label>
+                            <label htmlFor="label-template">Label template</label>
                             <QuerySelect
                                 formsy={false}
                                 fireQSChangeOnInit
diff --git a/packages/components/src/internal/components/lineage/LineageSettings.tsx b/packages/components/src/internal/components/lineage/LineageSettings.tsx
index 73c53c82c5..9f2d19d697 100644
--- a/packages/components/src/internal/components/lineage/LineageSettings.tsx
+++ b/packages/components/src/internal/components/lineage/LineageSettings.tsx
@@ -144,7 +144,7 @@ export const LineageSettings: FC<Props> = memo(props => {
                     value={options.grouping?.generations ?? DEFAULT_GROUPING_OPTIONS.generations}
                 />
 
-                <label>
+                <label htmlFor="child-generations">
                     Child Generations
                     <LabelHelpTip placement="top" title="Child Generations">
                         <div className="lineage-settings__tip-body">
@@ -157,8 +157,9 @@ export const LineageSettings: FC<Props> = memo(props => {
                     </LabelHelpTip>
                 </label>
                 <input
-                    defaultValue={options.grouping?.childDepth ?? DEFAULT_GROUPING_OPTIONS.childDepth}
                     className="form-control"
+                    defaultValue={options.grouping?.childDepth ?? DEFAULT_GROUPING_OPTIONS.childDepth}
+                    id="child-generations"
                     max={DEFAULT_GROUPING_OPTIONS.childDepth * 2}
                     min={0}
                     name="childDepth"
@@ -166,7 +167,7 @@ export const LineageSettings: FC<Props> = memo(props => {
                     type="number"
                 />
 
-                <label>
+                <label htmlFor="parent-generations">
                     Parent Generations
                     <LabelHelpTip placement="top" title="Parent Generations">
                         <div className="lineage-settings__tip-body">
@@ -179,8 +180,9 @@ export const LineageSettings: FC<Props> = memo(props => {
                     </LabelHelpTip>
                 </label>
                 <input
-                    defaultValue={options.grouping?.parentDepth ?? DEFAULT_GROUPING_OPTIONS.parentDepth}
                     className="form-control"
+                    defaultValue={options.grouping?.parentDepth ?? DEFAULT_GROUPING_OPTIONS.parentDepth}
+                    id="parent-generations"
                     max={DEFAULT_GROUPING_OPTIONS.parentDepth * 2}
                     min={0}
                     name="parentDepth"
@@ -188,7 +190,7 @@ export const LineageSettings: FC<Props> = memo(props => {
                     type="number"
                 />
 
-                <label>
+                <label htmlFor="combine-threshold">
                     Combine Generation Threshold
                     <LabelHelpTip placement="top" title="Combine Generation Threshold">
                         <div className="lineage-settings__tip-body">
@@ -202,8 +204,9 @@ export const LineageSettings: FC<Props> = memo(props => {
                     </LabelHelpTip>
                 </label>
                 <input
-                    defaultValue={options.grouping?.combineSize ?? DEFAULT_GROUPING_OPTIONS.combineSize}
                     className="form-control"
+                    defaultValue={options.grouping?.combineSize ?? DEFAULT_GROUPING_OPTIONS.combineSize}
+                    id="combine-threshold"
                     min={GROUPING_COMBINED_SIZE_MIN}
                     name="combineSize"
                     onChange={onGroupingChange}
@@ -224,7 +227,13 @@ export const LineageSettings: FC<Props> = memo(props => {
 
                 {options.originalFilters.map(filter => (
                     <div key={filter.field}>
-                        <input defaultChecked onChange={onFilterChange} name={filter.field}  aria-label={filter.field} type="checkbox" />
+                        <input
+                            aria-label={filter.field}
+                            defaultChecked
+                            name={filter.field}
+                            onChange={onFilterChange}
+                            type="checkbox"
+                        />
                         <span className="lineage-settings__filter-label">
                             {filter.field} = {filter.value.join(' OR ')}
                         </span>
diff --git a/packages/components/src/internal/components/ontology/OntologyLookupOptions.tsx b/packages/components/src/internal/components/ontology/OntologyLookupOptions.tsx
index d8869d74fa..9201d8cc52 100644
--- a/packages/components/src/internal/components/ontology/OntologyLookupOptions.tsx
+++ b/packages/components/src/internal/components/ontology/OntologyLookupOptions.tsx
@@ -155,7 +155,7 @@ export class OntologyLookupOptions extends PureComponent<Props, State> {
                 </div>
                 <div className="row">
                     <div className="col-xs-5">
-                        <div className="domain-field-label">
+                        <div className="domain-field-label" id="ontology-label">
                             Choose an Ontology
                             <LabelHelpTip title="Choose an Ontology">
                                 <>
@@ -171,7 +171,7 @@ export class OntologyLookupOptions extends PureComponent<Props, State> {
                         </div>
                     </div>
                     <div className="col-xs-3">
-                        <div className="domain-field-label">
+                        <div className="domain-field-label" id="import-field-label">
                             Choose an Import Field
                             <LabelHelpTip title="Choose an Import Field">
                                 <p>
@@ -182,7 +182,7 @@ export class OntologyLookupOptions extends PureComponent<Props, State> {
                         </div>
                     </div>
                     <div className="col-xs-3">
-                        <div className="domain-field-label">
+                        <div className="domain-field-label" id="label-field-label">
                             Choose a Label Field
                             <LabelHelpTip title="Choose a Label Field">
                                 <p>Choose which text field to store the preferred name of the concept.</p>
@@ -194,6 +194,7 @@ export class OntologyLookupOptions extends PureComponent<Props, State> {
                 <div className="row">
                     <div className="col-xs-5">
                         <select
+                            aria-labelledby="ontology-label"
                             className="form-control"
                             id={sourceId}
                             key={sourceId}
@@ -235,6 +236,7 @@ export class OntologyLookupOptions extends PureComponent<Props, State> {
                     </div>
                     <div className="col-xs-3">
                         <OntologyTextDomainFieldSelect
+                            ariaLabelledBy="import-field-label"
                             field={field}
                             domainFields={domainFields}
                             lockType={lockType}
@@ -246,6 +248,7 @@ export class OntologyLookupOptions extends PureComponent<Props, State> {
                     </div>
                     <div className="col-xs-3">
                         <OntologyTextDomainFieldSelect
+                            ariaLabelledBy="label-field-label"
                             field={field}
                             domainFields={domainFields}
                             lockType={lockType}
@@ -262,6 +265,7 @@ export class OntologyLookupOptions extends PureComponent<Props, State> {
 }
 
 interface OntologyTextDomainFieldSelectProps {
+    ariaLabelledBy?: string;
     domainFields: List<DomainField>;
     field: DomainField;
     filterValue: string;
@@ -272,10 +276,11 @@ interface OntologyTextDomainFieldSelectProps {
 }
 
 const OntologyTextDomainFieldSelect: FC<OntologyTextDomainFieldSelectProps> = memo(props => {
-    const { domainFields, lockType, field, id, value, filterValue, onFieldChange } = props;
+    const { ariaLabelledBy, domainFields, lockType, field, id, value, filterValue, onFieldChange } = props;
 
     return (
         <select
+            aria-labelledby={ariaLabelledBy}
             className="form-control"
             id={id}
             key={id}
diff --git a/packages/components/src/internal/components/ontology/OntologyTreeSearchContainer.tsx b/packages/components/src/internal/components/ontology/OntologyTreeSearchContainer.tsx
index b7eeae8553..df59c8c1b6 100644
--- a/packages/components/src/internal/components/ontology/OntologyTreeSearchContainer.tsx
+++ b/packages/components/src/internal/components/ontology/OntologyTreeSearchContainer.tsx
@@ -121,6 +121,7 @@ export const OntologyTreeSearchContainer: FC<OntologyTreeSearchContainerProps> =
     return (
         <div className="concept-search-container">
             <input
+                aria-label={'Search ' + ontology.abbreviation}
                 type="text"
                 className={className}
                 name={inputName}
diff --git a/packages/components/src/internal/components/picklist/ChoosePicklistModal.tsx b/packages/components/src/internal/components/picklist/ChoosePicklistModal.tsx
index 35dbe3afc0..897558f0e1 100644
--- a/packages/components/src/internal/components/picklist/ChoosePicklistModal.tsx
+++ b/packages/components/src/internal/components/picklist/ChoosePicklistModal.tsx
@@ -332,6 +332,7 @@ export const ChoosePicklistModalDisplay: FC<ChoosePicklistModalDisplayProps & Ch
                     <div className="row">
                         <div className="col-md-6">
                             <input
+                                aria-label="Search for a picklist"
                                 autoFocus
                                 className="form-control"
                                 onChange={onSearchChange}
diff --git a/packages/components/src/internal/components/picklist/PicklistEditModal.tsx b/packages/components/src/internal/components/picklist/PicklistEditModal.tsx
index e90cc1bddd..60761419d5 100644
--- a/packages/components/src/internal/components/picklist/PicklistEditModal.tsx
+++ b/packages/components/src/internal/components/picklist/PicklistEditModal.tsx
@@ -165,10 +165,13 @@ export const PicklistEditModal: FC<PicklistEditModalProps> = memo(props => {
             {showForm && (
                 <form>
                     <div className="form-group">
-                        <label className="control-label">Name *</label>
+                        <label className="control-label" htmlFor="picklist-name">
+                            Name *
+                        </label>
 
                         <input
                             className="form-control"
+                            id="picklist-name"
                             onChange={onNameChange}
                             placeholder="Give this list a name"
                             type="text"
@@ -176,10 +179,11 @@ export const PicklistEditModal: FC<PicklistEditModalProps> = memo(props => {
                         />
                     </div>
                     <div className="form-group">
-                        <label className="control-label">Description</label>
+                        <label className="control-label" htmlFor="picklist-description">Description</label>
 
                         <textarea
                             className="form-control"
+                            id="picklist-description"
                             onChange={onDescriptionChange}
                             placeholder="Add a description"
                             value={description}
diff --git a/packages/components/src/internal/components/samples/DiscardConsumedSamplesPanel.tsx b/packages/components/src/internal/components/samples/DiscardConsumedSamplesPanel.tsx
index ee5b60ce96..12ff4e994c 100644
--- a/packages/components/src/internal/components/samples/DiscardConsumedSamplesPanel.tsx
+++ b/packages/components/src/internal/components/samples/DiscardConsumedSamplesPanel.tsx
@@ -29,6 +29,7 @@ export const DiscardConsumedSamplesPanel: FC<Props> = memo(props => {
             <div className="form-group">
                 <label className="form-check">
                     <input
+                        aria-labelledby="discard-consumed-label"
                         className="form-check-input"
                         type="checkbox"
                         id={DISCARD_CONSUMED_CHECKBOX_FIELD}
@@ -36,7 +37,7 @@ export const DiscardConsumedSamplesPanel: FC<Props> = memo(props => {
                         onChange={toggleShouldDiscard}
                         checked={shouldDiscard}
                     />
-                    <span className="discard-consumed-title"> {discardTitle}</span>
+                    <span className="discard-consumed-title" id="discard-consumed-label"> {discardTitle}</span>
                 </label>
             </div>
             {onCommentChange && (
diff --git a/packages/components/src/internal/components/samples/ManageSampleStatusesPanel.tsx b/packages/components/src/internal/components/samples/ManageSampleStatusesPanel.tsx
index c429244a6b..d473ee30e5 100644
--- a/packages/components/src/internal/components/samples/ManageSampleStatusesPanel.tsx
+++ b/packages/components/src/internal/components/samples/ManageSampleStatusesPanel.tsx
@@ -220,10 +220,11 @@ export const SampleStatusDetail: FC<SampleStatusDetailProps> = memo(props => {
                     {error && <Alert>{error}</Alert>}
                     <div className="form-group">
                         <div className="col-sm-4">
-                            <DomainFieldLabel label="Label" required />
+                            <DomainFieldLabel id="status-label-label" label="Label" required />
                         </div>
                         <div className="col-sm-8">
                             <input
+                                aria-labelledby="status-label-label"
                                 className="form-control"
                                 disabled={saving || !updatedState.isLocal}
                                 name="label"
diff --git a/packages/components/src/internal/components/samples/StorageAmountInput.tsx b/packages/components/src/internal/components/samples/StorageAmountInput.tsx
index fcdac7565e..d5a0f8c9fc 100644
--- a/packages/components/src/internal/components/samples/StorageAmountInput.tsx
+++ b/packages/components/src/internal/components/samples/StorageAmountInput.tsx
@@ -49,6 +49,7 @@ export const StorageAmountInput: FC<Props> = memo(props => {
     else if (unitText && !getMeasurementUnit(unitText)) {
         unitDisplay = (
             <input
+                aria-label="Units"
                 className="form-control checkin-unit-input"
                 onChange={(evt: any) => unitsChangedHandler(evt.target.value)}
                 placeholder="Enter volume units..."
diff --git a/packages/components/src/internal/components/search/FilterExpressionView.tsx b/packages/components/src/internal/components/search/FilterExpressionView.tsx
index 3c75f28f8d..aa9f7c8f45 100644
--- a/packages/components/src/internal/components/search/FilterExpressionView.tsx
+++ b/packages/components/src/internal/components/search/FilterExpressionView.tsx
@@ -292,6 +292,7 @@ export const FilterExpressionView: FC<Props> = memo(props => {
 
                 return (
                     <textarea
+                        aria-label={'Filter ' + filterIndex + ' value ' + (isSecondInput ? '2' : '1')}
                         className="form-control filter-expression__textarea"
                         defaultValue={value}
                         name={'field-value-text' + suffix}
@@ -306,6 +307,7 @@ export const FilterExpressionView: FC<Props> = memo(props => {
             if (!isMultiValueInput && (jsonType === 'int' || jsonType === 'float')) {
                 return (
                     <input
+                        aria-label={'Filter ' + filterIndex + ' value ' + (isSecondInput ? '2' : '1')}
                         className="form-control filter-expression__input"
                         disabled={disabled}
                         name={'field-value-text' + suffix}
@@ -322,6 +324,7 @@ export const FilterExpressionView: FC<Props> = memo(props => {
 
             const textInput = (
                 <input
+                    aria-label={'Filter ' + filterIndex + ' value ' + (isSecondInput ? '2' : '1')}
                     className="form-control filter-expression__input"
                     disabled={disabled}
                     name={'field-value-text' + suffix}
@@ -443,3 +446,4 @@ export const FilterExpressionView: FC<Props> = memo(props => {
         </div>
     );
 });
+FilterExpressionView.displayName = 'FilterExpressionView';
diff --git a/packages/components/src/internal/components/search/FilterFacetedSelector.tsx b/packages/components/src/internal/components/search/FilterFacetedSelector.tsx
index 98fe4d004b..cc5090409f 100644
--- a/packages/components/src/internal/components/search/FilterFacetedSelector.tsx
+++ b/packages/components/src/internal/components/search/FilterFacetedSelector.tsx
@@ -294,6 +294,7 @@ export const FilterFacetedSelector: FC<Props> = memo(props => {
                 {(fieldDistinctValues?.length > showSearchLength || searchStr) && (
                     <div>
                         <input
+                            aria-label="Search for options"
                             className="form-control filter-faceted__typeahead-input"
                             disabled={disabled}
                             id="filter-faceted__typeahead-input"
@@ -327,6 +328,7 @@ export const FilterFacetedSelector: FC<Props> = memo(props => {
                                         <li className="filter-faceted__li" key={index}>
                                             <div className="form-check">
                                                 <input
+                                                    aria-label={'Select ' + displayValue}
                                                     checked={checkedValues.indexOf(value) > -1}
                                                     className="form-check-input filter-faceted__checkbox"
                                                     disabled={disabled}
diff --git a/packages/components/src/internal/components/search/QueryFilterPanel.tsx b/packages/components/src/internal/components/search/QueryFilterPanel.tsx
index faf1858096..dd47ee3ee2 100644
--- a/packages/components/src/internal/components/search/QueryFilterPanel.tsx
+++ b/packages/components/src/internal/components/search/QueryFilterPanel.tsx
@@ -282,13 +282,14 @@ export const QueryFilterPanel: FC<Props> = memo(props => {
                             altQueryName !== SAMPLE_PROPERTY_ALL_SAMPLE_TYPE.query && (
                                 <div className="form-check list-group-item">
                                     <input
+                                        aria-labelledby="all-data-label"
                                         checked={hasAllValuesInQuery}
                                         className="form-check-input filter-faceted__checkbox"
                                         name="field-value-allvalues-check"
                                         onChange={event => onAllValuesInQueryChange(event.target.checked)}
                                         type="checkbox"
                                     />
-                                    <div className="filter-modal__fields-col-any-msg">
+                                    <div className="filter-modal__fields-col-any-msg" id="all-data-label">
                                         {allInQueryFilterLabel ?? 'All data'}
                                     </div>
                                 </div>
@@ -296,13 +297,14 @@ export const QueryFilterPanel: FC<Props> = memo(props => {
                         {entityDataType?.supportHasNoValueInQuery && (
                             <div className="form-check list-group-item">
                                 <input
+                                    aria-labelledby="without-data-label"
                                     checked={hasNotInQueryFilter}
                                     className="form-check-input filter-faceted__checkbox"
                                     name="field-value-nodata-check"
                                     onChange={event => onHasNoValueInQueryChange(event.target.checked)}
                                     type="checkbox"
                                 />
-                                <div className="filter-modal__fields-col-nodata-msg">
+                                <div className="filter-modal__fields-col-nodata-msg" id="without-data-label">
                                     {hasNotInQueryFilterLabel ?? 'Without data from this type'}
                                 </div>
                             </div>
diff --git a/packages/components/src/internal/components/search/SearchBox.tsx b/packages/components/src/internal/components/search/SearchBox.tsx
index c40449ea28..9c5e2d8f64 100644
--- a/packages/components/src/internal/components/search/SearchBox.tsx
+++ b/packages/components/src/internal/components/search/SearchBox.tsx
@@ -55,7 +55,7 @@ export const SearchBox: FC<Props> = memo(props => {
                 <i className="fa fa-search navbar__search-icon" />
                 <span className={'navbar__input-group ' + (showFindByIds ? 'input-group' : '')}>
                     <input
-                        aria-label="Search in project"
+                        aria-label="Search in application"
                         className="form-control navbar__search-input"
                         onChange={onChange}
                         placeholder={placeholder ?? 'Enter Search Terms'}
diff --git a/packages/components/src/internal/components/search/SearchPanel.tsx b/packages/components/src/internal/components/search/SearchPanel.tsx
index 6a51c519b1..81097225f2 100644
--- a/packages/components/src/internal/components/search/SearchPanel.tsx
+++ b/packages/components/src/internal/components/search/SearchPanel.tsx
@@ -106,6 +106,7 @@ export const SearchPanelImpl: FC<SearchPanelImplProps> = memo(props => {
                             <i className="fa fa-search search-icon" />
                         </span>
                         <input
+                            aria-label="Search"
                             className="form-control search-input"
                             onChange={onSearchChange}
                             placeholder="Search"
diff --git a/packages/components/src/internal/components/settings/NameIdSettings.tsx b/packages/components/src/internal/components/settings/NameIdSettings.tsx
index 69786b874d..831fbcc884 100644
--- a/packages/components/src/internal/components/settings/NameIdSettings.tsx
+++ b/packages/components/src/internal/components/settings/NameIdSettings.tsx
@@ -334,10 +334,14 @@ export const NameIdSettingsForm: FC<NameIdSettingsFormProps> = props => {
                         {!loadingNamingOptions && (
                             <>
                                 <div className="name-id-setting__prefix">
-                                    <div className="name-id-setting__prefix-label"> Prefix: </div>
+                                    <div className="name-id-setting__prefix-label" id="name-id-settings-label">
+                                        {' '}
+                                        Prefix:{' '}
+                                    </div>
 
                                     <div className="name-id-setting__prefix-field">
                                         <input
+                                            aria-labelledby="name-id-settings-label"
                                             className="form-control"
                                             name="prefix"
                                             onChange={prefixOnChange}
@@ -398,11 +402,12 @@ export const NameIdSettingsForm: FC<NameIdSettingsFormProps> = props => {
                         {!loadingCounters && (
                             <div>
                                 <div className="row margin-top">
-                                    <div className="col-sm-2">
+                                    <div className="col-sm-2" id="sampleCount-label">
                                         <div className="sample-counter__prefix-label">sampleCount</div>
                                     </div>
                                     <div className="col-sm-2">
                                         <input
+                                            aria-labelledby="sampleCount-label"
                                             className="form-control update-samplecount-input"
                                             min={sampleCount}
                                             name="newSampleCount"
@@ -440,10 +445,13 @@ export const NameIdSettingsForm: FC<NameIdSettingsFormProps> = props => {
                                 </div>
                                 <div className="row margin-top">
                                     <div className="col-sm-2">
-                                        <div className="sample-counter__prefix-label">rootSampleCount</div>
+                                        <div className="sample-counter__prefix-label" id="rootSampleCount-label">
+                                            rootSampleCount
+                                        </div>
                                     </div>
                                     <div className="col-sm-2">
                                         <input
+                                            aria-labelledby="rootSampleCount-label"
                                             className="form-control update-samplecount-input"
                                             min={rootSampleCount}
                                             name="newRootSampleCount"
diff --git a/packages/components/src/internal/components/user/APIKeysPanel.tsx b/packages/components/src/internal/components/user/APIKeysPanel.tsx
index 6c9c8dca9d..effb34d29b 100644
--- a/packages/components/src/internal/components/user/APIKeysPanel.tsx
+++ b/packages/components/src/internal/components/user/APIKeysPanel.tsx
@@ -164,10 +164,11 @@ export const KeyGeneratorModal: FC<ModalProps> = props => {
                     <div className="api-key__description">{description}</div>
                     <div className="top-padding form-group">
                         <input
-                            disabled
-                            type="text"
+                            aria-label={type + ' value'}
                             className="form-control api-key__input"
+                            disabled
                             name={type + '_token'}
+                            type="text"
                             value={keyValue}
                         />
                         <button
diff --git a/packages/components/src/internal/renderers.tsx b/packages/components/src/internal/renderers.tsx
index 71061f7484..14d59a8fa6 100644
--- a/packages/components/src/internal/renderers.tsx
+++ b/packages/components/src/internal/renderers.tsx
@@ -108,6 +108,7 @@ export const EditableColumnTitle: FC<EditableColumnTitleProps> = memo(props => {
     if (editing) {
         return (
             <input
+                aria-label="Column label"
                 autoFocus
                 defaultValue={title}
                 onBlur={onEditFinish}
diff --git a/packages/components/src/public/QueryModel/SaveViewModal.tsx b/packages/components/src/public/QueryModel/SaveViewModal.tsx
index 9668e7d554..eabe46a4b1 100644
--- a/packages/components/src/public/QueryModel/SaveViewModal.tsx
+++ b/packages/components/src/public/QueryModel/SaveViewModal.tsx
@@ -94,6 +94,7 @@ export const ViewNameInput: FC<ViewNameInputProps> = memo(props => {
     return (
         <>
             <input
+                aria-label="Grid view name"
                 autoFocus={autoFocus}
                 name="gridViewName"
                 defaultValue={defaultValue}
@@ -226,13 +227,16 @@ export const SaveViewModal: FC<Props> = memo(props => {
                     {!isDefaultView && canEditShared && (
                         <div className="form-check">
                             <input
+                                aria-labelledby="shared-to-users-label"
                                 className="form-check-input"
                                 type="checkbox"
                                 name="setShared"
                                 onChange={toggleShared}
                                 checked={isShared}
                             />
-                            <span className="margin-left">Make this grid view available to all users</span>
+                            <span className="margin-left" id="shared-to-users-label">
+                                Make this grid view available to all users
+                            </span>
                         </div>
                     )}
                     {isProductFoldersEnabled(moduleContext) &&
@@ -240,13 +244,16 @@ export const SaveViewModal: FC<Props> = memo(props => {
                         canEditShared && (
                             <div className="form-check">
                                 <input
+                                    aria-labelledby="shared-to-folders-label"
                                     className="form-check-input"
                                     type="checkbox"
                                     name="setInherit"
                                     onChange={toggleInherit}
                                     checked={canInherit}
                                 />
-                                <span className="margin-left">Make this grid view available in all Folders</span>
+                                <span className="margin-left" id="shared-to-folders-label">
+                                    Make this grid view available in all Folders
+                                </span>
                             </div>
                         )}
                     <div className="top-padding">

From fba23cdf4f17823e850516ff631348fcd311812b Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Fri, 24 Apr 2026 16:12:16 -0700
Subject: [PATCH 03/30] Update tests

---
 .../domainproperties/DomainForm.test.tsx      |   2 +-
 ...ionalFormattingAndValidation.test.tsx.snap | 140 +++---
 .../DomainFieldLabel.test.tsx.snap            |  84 ++--
 .../NameAndLinkingOptions.test.tsx.snap       |  61 ++-
 .../NumericFieldOptions.test.tsx.snap         |  29 +-
 .../EntityDetailsForm.test.tsx.snap           | 345 +++++++------
 ...IssuesListDefPropertiesPanel.test.tsx.snap | 332 +++++++------
 .../ListPropertiesPanel.test.tsx.snap         | 222 +++++----
 ...tPropertiesPanelFormElements.test.tsx.snap |  74 +--
 .../SetKeyFieldNamePanel.test.tsx.snap        |  90 ++--
 .../SampleTypePropertiesPanel.test.tsx.snap   | 470 ++++++++++--------
 .../__snapshots__/Filters.test.tsx.snap       |   8 +
 12 files changed, 1054 insertions(+), 803 deletions(-)

diff --git a/packages/components/src/internal/components/domainproperties/DomainForm.test.tsx b/packages/components/src/internal/components/domainproperties/DomainForm.test.tsx
index 0aae4493ec..10d3eddfc1 100644
--- a/packages/components/src/internal/components/domainproperties/DomainForm.test.tsx
+++ b/packages/components/src/internal/components/domainproperties/DomainForm.test.tsx
@@ -567,7 +567,7 @@ describe('DomainForm', () => {
         });
 
         const rows = document.getElementsByClassName('domain-row-container');
-        expect(rows[0].textContent).toBe('Name *Data Type *Details'); // no Required
+        expect(rows[0].textContent).toBe('Select all fieldsName *Data Type *Details'); // no Required
     });
 
     test('domain form with hide add fields button', async () => {
diff --git a/packages/components/src/internal/components/domainproperties/__snapshots__/ConditionalFormattingAndValidation.test.tsx.snap b/packages/components/src/internal/components/domainproperties/__snapshots__/ConditionalFormattingAndValidation.test.tsx.snap
index 7c80c3b3cc..7b48721a72 100644
--- a/packages/components/src/internal/components/domainproperties/__snapshots__/ConditionalFormattingAndValidation.test.tsx.snap
+++ b/packages/components/src/internal/components/domainproperties/__snapshots__/ConditionalFormattingAndValidation.test.tsx.snap
@@ -28,22 +28,24 @@ exports[`ConditionalFormattingAndValidation Multiple validators or formats, cond
           <div
             class="domain-field-label domain-no-wrap"
           >
-            Create Conditional Format 
-            <span
-              class="domain-no-wrap"
-            >
-              Criteria
-              <div
-                class="overlay-trigger"
+            <span>
+              Create Conditional Format 
+              <span
+                class="domain-no-wrap"
               >
-                <span
-                  class="label-help-target"
+                Criteria
+                <div
+                  class="overlay-trigger"
                 >
                   <span
-                    class="label-help-icon fa fa-question-circle"
-                  />
-                </span>
-              </div>
+                    class="label-help-target"
+                  >
+                    <span
+                      class="label-help-icon fa fa-question-circle"
+                    />
+                  </span>
+                </div>
+              </span>
             </span>
           </div>
           <div>
@@ -68,22 +70,24 @@ exports[`ConditionalFormattingAndValidation Multiple validators or formats, cond
           <div
             class="domain-field-label domain-no-wrap"
           >
-            Create Regular Expression 
-            <span
-              class="domain-no-wrap"
-            >
-              Validator
-              <div
-                class="overlay-trigger"
+            <span>
+              Create Regular Expression 
+              <span
+                class="domain-no-wrap"
               >
-                <span
-                  class="label-help-target"
+                Validator
+                <div
+                  class="overlay-trigger"
                 >
                   <span
-                    class="label-help-icon fa fa-question-circle"
-                  />
-                </span>
-              </div>
+                    class="label-help-target"
+                  >
+                    <span
+                      class="label-help-icon fa fa-question-circle"
+                    />
+                  </span>
+                </div>
+              </span>
             </span>
           </div>
           <div>
@@ -136,22 +140,24 @@ exports[`ConditionalFormattingAndValidation No validators 1`] = `
           <div
             class="domain-field-label domain-no-wrap"
           >
-            Create Conditional Format 
-            <span
-              class="domain-no-wrap"
-            >
-              Criteria
-              <div
-                class="overlay-trigger"
+            <span>
+              Create Conditional Format 
+              <span
+                class="domain-no-wrap"
               >
-                <span
-                  class="label-help-target"
+                Criteria
+                <div
+                  class="overlay-trigger"
                 >
                   <span
-                    class="label-help-icon fa fa-question-circle"
-                  />
-                </span>
-              </div>
+                    class="label-help-target"
+                  >
+                    <span
+                      class="label-help-icon fa fa-question-circle"
+                    />
+                  </span>
+                </div>
+              </span>
             </span>
           </div>
           <div>
@@ -204,22 +210,24 @@ exports[`ConditionalFormattingAndValidation string field 1`] = `
           <div
             class="domain-field-label domain-no-wrap"
           >
-            Create Conditional Format 
-            <span
-              class="domain-no-wrap"
-            >
-              Criteria
-              <div
-                class="overlay-trigger"
+            <span>
+              Create Conditional Format 
+              <span
+                class="domain-no-wrap"
               >
-                <span
-                  class="label-help-target"
+                Criteria
+                <div
+                  class="overlay-trigger"
                 >
                   <span
-                    class="label-help-icon fa fa-question-circle"
-                  />
-                </span>
-              </div>
+                    class="label-help-target"
+                  >
+                    <span
+                      class="label-help-icon fa fa-question-circle"
+                    />
+                  </span>
+                </div>
+              </span>
             </span>
           </div>
           <div>
@@ -244,22 +252,24 @@ exports[`ConditionalFormattingAndValidation string field 1`] = `
           <div
             class="domain-field-label domain-no-wrap"
           >
-            Create Regular Expression 
-            <span
-              class="domain-no-wrap"
-            >
-              Validator
-              <div
-                class="overlay-trigger"
+            <span>
+              Create Regular Expression 
+              <span
+                class="domain-no-wrap"
               >
-                <span
-                  class="label-help-target"
+                Validator
+                <div
+                  class="overlay-trigger"
                 >
                   <span
-                    class="label-help-icon fa fa-question-circle"
-                  />
-                </span>
-              </div>
+                    class="label-help-target"
+                  >
+                    <span
+                      class="label-help-icon fa fa-question-circle"
+                    />
+                  </span>
+                </div>
+              </span>
             </span>
           </div>
           <div>
diff --git a/packages/components/src/internal/components/domainproperties/__snapshots__/DomainFieldLabel.test.tsx.snap b/packages/components/src/internal/components/domainproperties/__snapshots__/DomainFieldLabel.test.tsx.snap
index 387b4abdfa..d0789e9a3f 100644
--- a/packages/components/src/internal/components/domainproperties/__snapshots__/DomainFieldLabel.test.tsx.snap
+++ b/packages/components/src/internal/components/domainproperties/__snapshots__/DomainFieldLabel.test.tsx.snap
@@ -2,68 +2,76 @@
 
 exports[`<DomainFieldLabel/> label and helpTip 1`] = `
 <div>
-  Field 
-  <span
-    class="domain-no-wrap"
-  >
-    Label
-    <div
-      class="overlay-trigger"
+  <span>
+    Field 
+    <span
+      class="domain-no-wrap"
     >
-      <span
-        class="label-help-target"
+      Label
+      <div
+        class="overlay-trigger"
       >
         <span
-          class="label-help-icon fa fa-question-circle"
-        />
-      </span>
-    </div>
+          class="label-help-target"
+        >
+          <span
+            class="label-help-icon fa fa-question-circle"
+          />
+        </span>
+      </div>
+    </span>
   </span>
 </div>
 `;
 
 exports[`<DomainFieldLabel/> label and required 1`] = `
 <div>
-  Field 
-  <span
-    class="domain-no-wrap"
-  >
-    Label
-     *
+  <span>
+    Field 
+    <span
+      class="domain-no-wrap"
+    >
+      Label
+       *
+    </span>
   </span>
 </div>
 `;
 
 exports[`<DomainFieldLabel/> label only 1`] = `
 <div>
-  Field 
-  <span
-    class="domain-no-wrap"
-  >
-    Label
+  <span>
+    Field 
+    <span
+      class="domain-no-wrap"
+    >
+      Label
+    </span>
   </span>
 </div>
 `;
 
 exports[`<DomainFieldLabel/> label, required, and helpTip 1`] = `
 <div>
-  Field 
-  <span
-    class="domain-no-wrap"
-  >
-    Label
-    <div
-      class="overlay-trigger"
+  <span>
+    Field 
+    <span
+      class="domain-no-wrap"
     >
-      <span
-        class="label-help-target"
+      Label
+      <div
+        class="overlay-trigger"
       >
         <span
-          class="label-help-icon fa fa-question-circle"
-        />
-      </span>
-    </div>
-     *
+          class="label-help-target"
+        >
+          <span
+            class="label-help-icon fa fa-question-circle"
+          />
+        </span>
+      </div>
+       *
+    </span>
   </span>
 </div>
 `;
diff --git a/packages/components/src/internal/components/domainproperties/__snapshots__/NameAndLinkingOptions.test.tsx.snap b/packages/components/src/internal/components/domainproperties/__snapshots__/NameAndLinkingOptions.test.tsx.snap
index cc792456f6..d67b4c157e 100644
--- a/packages/components/src/internal/components/domainproperties/__snapshots__/NameAndLinkingOptions.test.tsx.snap
+++ b/packages/components/src/internal/components/domainproperties/__snapshots__/NameAndLinkingOptions.test.tsx.snap
@@ -24,10 +24,12 @@ exports[`NameAndLinkingOptions Name and Linking options 1`] = `
       >
         <div
           class="domain-field-label"
+          id="description-label"
         >
           Description
         </div>
         <textarea
+          aria-labelledby="description-label"
           class="form-control"
           id="domainpropertiesrow-description-1-1"
           name="domainpropertiesrow-description"
@@ -41,10 +43,12 @@ exports[`NameAndLinkingOptions Name and Linking options 1`] = `
       >
         <div
           class="domain-field-label"
+          id="label-label"
         >
           Label
         </div>
         <input
+          aria-labelledby="label-label"
           class="form-control"
           id="domainpropertiesrow-label-1-1"
           name="domainpropertiesrow-label"
@@ -54,25 +58,30 @@ exports[`NameAndLinkingOptions Name and Linking options 1`] = `
         <div
           class="domain-field-label"
         >
-          Import 
           <span
-            class="domain-no-wrap"
+            id="import-aliases-label"
           >
-            Aliases
-            <div
-              class="overlay-trigger"
+            Import 
+            <span
+              class="domain-no-wrap"
             >
-              <span
-                class="label-help-target"
+              Aliases
+              <div
+                class="overlay-trigger"
               >
                 <span
-                  class="label-help-icon fa fa-question-circle"
-                />
-              </span>
-            </div>
+                  class="label-help-target"
+                >
+                  <span
+                    class="label-help-icon fa fa-question-circle"
+                  />
+                </span>
+              </div>
+            </span>
           </span>
         </div>
         <input
+          aria-labelledby="import-aliases-label"
           class="form-control"
           id="domainpropertiesrow-importAliases-1-1"
           name="domainpropertiesrow-importAliases"
@@ -87,23 +96,28 @@ exports[`NameAndLinkingOptions Name and Linking options 1`] = `
           class="domain-field-label"
         >
           <span
-            class="domain-no-wrap"
+            id="url-label"
           >
-            URL
-            <div
-              class="overlay-trigger"
+            <span
+              class="domain-no-wrap"
             >
-              <span
-                class="label-help-target"
+              URL
+              <div
+                class="overlay-trigger"
               >
                 <span
-                  class="label-help-icon fa fa-question-circle"
-                />
-              </span>
-            </div>
+                  class="label-help-target"
+                >
+                  <span
+                    class="label-help-icon fa fa-question-circle"
+                  />
+                </span>
+              </div>
+            </span>
           </span>
         </div>
         <input
+          aria-labelledby="url-label"
           class="form-control"
           id="domainpropertiesrow-URL-1-1"
           name="domainpropertiesrow-URL"
@@ -114,13 +128,16 @@ exports[`NameAndLinkingOptions Name and Linking options 1`] = `
           class="domain-text-options-col"
         >
           <input
+            aria-labelledby="new-window-label"
             checked=""
             class="form-control domain-text-option-istargetblank"
             id="domainpropertiesrow-isTargetBlank-1-1"
             name="domainpropertiesrow-isTargetBlank"
             type="checkbox"
           />
-          <span>
+          <span
+            id="new-window-label"
+          >
             Open links in a new tab
           </span>
         </div>
diff --git a/packages/components/src/internal/components/domainproperties/__snapshots__/NumericFieldOptions.test.tsx.snap b/packages/components/src/internal/components/domainproperties/__snapshots__/NumericFieldOptions.test.tsx.snap
index 19f0e6e5d4..073afc8078 100644
--- a/packages/components/src/internal/components/domainproperties/__snapshots__/NumericFieldOptions.test.tsx.snap
+++ b/packages/components/src/internal/components/domainproperties/__snapshots__/NumericFieldOptions.test.tsx.snap
@@ -25,22 +25,26 @@ exports[`NumericFieldOptions Numeric data type 1`] = `
         <div
           class="domain-field-label"
         >
-          Format for 
           <span
-            class="domain-no-wrap"
+            id="number-format-label"
           >
-            Numbers
-            <div
-              class="overlay-trigger"
+            Format for 
+            <span
+              class="domain-no-wrap"
             >
-              <span
-                class="label-help-target"
+              Numbers
+              <div
+                class="overlay-trigger"
               >
                 <span
-                  class="label-help-icon fa fa-question-circle"
-                />
-              </span>
-            </div>
+                  class="label-help-target"
+                >
+                  <span
+                    class="label-help-icon fa fa-question-circle"
+                  />
+                </span>
+              </div>
+            </span>
           </span>
         </div>
       </div>
@@ -49,6 +53,7 @@ exports[`NumericFieldOptions Numeric data type 1`] = `
       >
         <div
           class="domain-field-label"
+          id="default-scale-label"
         >
           Default Scale Type
         </div>
@@ -61,6 +66,7 @@ exports[`NumericFieldOptions Numeric data type 1`] = `
         class="col-xs-3"
       >
         <input
+          aria-labelledby="number-format-label"
           class="form-control"
           id="domainpropertiesrow-format-1-1"
           name="domainpropertiesrow-format"
@@ -72,6 +78,7 @@ exports[`NumericFieldOptions Numeric data type 1`] = `
         class="col-xs-2"
       >
         <select
+          aria-labelledby="default-scale-label"
           class="form-control"
           id="domainpropertiesrow-defaultScale-1-1"
           name="domainpropertiesrow-defaultScale"
diff --git a/packages/components/src/internal/components/domainproperties/entities/__snapshots__/EntityDetailsForm.test.tsx.snap b/packages/components/src/internal/components/domainproperties/entities/__snapshots__/EntityDetailsForm.test.tsx.snap
index 0b34e61899..69aa3407d8 100644
--- a/packages/components/src/internal/components/domainproperties/entities/__snapshots__/EntityDetailsForm.test.tsx.snap
+++ b/packages/components/src/internal/components/domainproperties/entities/__snapshots__/EntityDetailsForm.test.tsx.snap
@@ -9,17 +9,20 @@ exports[`<EntityDetailsForm/> default properties 1`] = `
       <div
         class="col-xs-2"
       >
-        <span
-          class="domain-no-wrap"
-        >
-          Name
-           *
+        <span>
+          <span
+            class="domain-no-wrap"
+          >
+            Name
+             *
+          </span>
         </span>
       </div>
       <div
         class="col-xs-10"
       >
         <input
+          aria-label="Name"
           class="form-control"
           id="entity-name"
           placeholder="Enter a name for this entity"
@@ -42,27 +45,30 @@ exports[`<EntityDetailsForm/> default properties 1`] = `
       <div
         class="col-xs-2"
       >
-        <span
-          class="domain-no-wrap"
-        >
-          Description
-          <div
-            class="overlay-trigger"
+        <span>
+          <span
+            class="domain-no-wrap"
           >
-            <span
-              class="label-help-target"
+            Description
+            <div
+              class="overlay-trigger"
             >
               <span
-                class="label-help-icon fa fa-question-circle"
-              />
-            </span>
-          </div>
+                class="label-help-target"
+              >
+                <span
+                  class="label-help-icon fa fa-question-circle"
+                />
+              </span>
+            </div>
+          </span>
         </span>
       </div>
       <div
         class="col-xs-10"
       >
         <textarea
+          aria-label="Description"
           class="form-control"
           id="entity-description"
         />
@@ -77,22 +83,24 @@ exports[`<EntityDetailsForm/> default properties 1`] = `
         <div
           class="name-expression-label-div"
         >
-          Naming 
-          <span
-            class="domain-no-wrap"
-          >
-            Pattern
-            <div
-              class="overlay-trigger"
+          <span>
+            Naming 
+            <span
+              class="domain-no-wrap"
             >
-              <span
-                class="label-help-target"
+              Pattern
+              <div
+                class="overlay-trigger"
               >
                 <span
-                  class="label-help-icon fa fa-question-circle"
-                />
-              </span>
-            </div>
+                  class="label-help-target"
+                >
+                  <span
+                    class="label-help-icon fa fa-question-circle"
+                  />
+                </span>
+              </div>
+            </span>
           </span>
         </div>
       </div>
@@ -100,6 +108,7 @@ exports[`<EntityDetailsForm/> default properties 1`] = `
         class="col-xs-10"
       >
         <input
+          aria-label="Naming Pattern"
           class="form-control"
           id="entity-nameExpression"
           type="text"
@@ -120,17 +129,20 @@ exports[`<EntityDetailsForm/> initial data 1`] = `
       <div
         class="col-xs-2"
       >
-        <span
-          class="domain-no-wrap"
-        >
-          Name
-           *
+        <span>
+          <span
+            class="domain-no-wrap"
+          >
+            Name
+             *
+          </span>
         </span>
       </div>
       <div
         class="col-xs-10"
       >
         <input
+          aria-label="Name"
           class="form-control"
           id="entity-name"
           placeholder="Enter a name for this entity"
@@ -153,27 +165,30 @@ exports[`<EntityDetailsForm/> initial data 1`] = `
       <div
         class="col-xs-2"
       >
-        <span
-          class="domain-no-wrap"
-        >
-          Description
-          <div
-            class="overlay-trigger"
+        <span>
+          <span
+            class="domain-no-wrap"
           >
-            <span
-              class="label-help-target"
+            Description
+            <div
+              class="overlay-trigger"
             >
               <span
-                class="label-help-icon fa fa-question-circle"
-              />
-            </span>
-          </div>
+                class="label-help-target"
+              >
+                <span
+                  class="label-help-icon fa fa-question-circle"
+                />
+              </span>
+            </div>
+          </span>
         </span>
       </div>
       <div
         class="col-xs-10"
       >
         <textarea
+          aria-label="Description"
           class="form-control"
           id="entity-description"
         >
@@ -190,22 +205,24 @@ exports[`<EntityDetailsForm/> initial data 1`] = `
         <div
           class="name-expression-label-div"
         >
-          Naming 
-          <span
-            class="domain-no-wrap"
-          >
-            Pattern
-            <div
-              class="overlay-trigger"
+          <span>
+            Naming 
+            <span
+              class="domain-no-wrap"
             >
-              <span
-                class="label-help-target"
+              Pattern
+              <div
+                class="overlay-trigger"
               >
                 <span
-                  class="label-help-icon fa fa-question-circle"
-                />
-              </span>
-            </div>
+                  class="label-help-target"
+                >
+                  <span
+                    class="label-help-icon fa fa-question-circle"
+                  />
+                </span>
+              </div>
+            </span>
           </span>
         </div>
       </div>
@@ -213,6 +230,7 @@ exports[`<EntityDetailsForm/> initial data 1`] = `
         class="col-xs-10"
       >
         <input
+          aria-label="Naming Pattern"
           class="form-control"
           id="entity-nameExpression"
           type="text"
@@ -233,17 +251,20 @@ exports[`<EntityDetailsForm/> nameExpression properties 1`] = `
       <div
         class="col-xs-2"
       >
-        <span
-          class="domain-no-wrap"
-        >
-          Name
-           *
+        <span>
+          <span
+            class="domain-no-wrap"
+          >
+            Name
+             *
+          </span>
         </span>
       </div>
       <div
         class="col-xs-10"
       >
         <input
+          aria-label="Name"
           class="form-control"
           id="entity-name"
           placeholder="Enter a name for this entity"
@@ -266,27 +287,30 @@ exports[`<EntityDetailsForm/> nameExpression properties 1`] = `
       <div
         class="col-xs-2"
       >
-        <span
-          class="domain-no-wrap"
-        >
-          Description
-          <div
-            class="overlay-trigger"
+        <span>
+          <span
+            class="domain-no-wrap"
           >
-            <span
-              class="label-help-target"
+            Description
+            <div
+              class="overlay-trigger"
             >
               <span
-                class="label-help-icon fa fa-question-circle"
-              />
-            </span>
-          </div>
+                class="label-help-target"
+              >
+                <span
+                  class="label-help-icon fa fa-question-circle"
+                />
+              </span>
+            </div>
+          </span>
         </span>
       </div>
       <div
         class="col-xs-10"
       >
         <textarea
+          aria-label="Description"
           class="form-control"
           id="entity-description"
         />
@@ -301,22 +325,24 @@ exports[`<EntityDetailsForm/> nameExpression properties 1`] = `
         <div
           class="name-expression-label-div"
         >
-          Naming 
-          <span
-            class="domain-no-wrap"
-          >
-            Pattern
-            <div
-              class="overlay-trigger"
+          <span>
+            Naming 
+            <span
+              class="domain-no-wrap"
             >
-              <span
-                class="label-help-target"
+              Pattern
+              <div
+                class="overlay-trigger"
               >
                 <span
-                  class="label-help-icon fa fa-question-circle"
-                />
-              </span>
-            </div>
+                  class="label-help-target"
+                >
+                  <span
+                    class="label-help-icon fa fa-question-circle"
+                  />
+                </span>
+              </div>
+            </span>
           </span>
         </div>
       </div>
@@ -324,6 +350,7 @@ exports[`<EntityDetailsForm/> nameExpression properties 1`] = `
         class="col-xs-10"
       >
         <input
+          aria-label="Naming Pattern"
           class="form-control"
           id="entity-nameExpression"
           placeholder="Enter a name expression"
@@ -345,17 +372,20 @@ exports[`<EntityDetailsForm/> with formValues 1`] = `
       <div
         class="col-xs-2"
       >
-        <span
-          class="domain-no-wrap"
-        >
-          Name
-           *
+        <span>
+          <span
+            class="domain-no-wrap"
+          >
+            Name
+             *
+          </span>
         </span>
       </div>
       <div
         class="col-xs-10"
       >
         <input
+          aria-label="Name"
           class="form-control"
           id="entity-name"
           placeholder="Enter a name for this entity"
@@ -378,27 +408,30 @@ exports[`<EntityDetailsForm/> with formValues 1`] = `
       <div
         class="col-xs-2"
       >
-        <span
-          class="domain-no-wrap"
-        >
-          Description
-          <div
-            class="overlay-trigger"
+        <span>
+          <span
+            class="domain-no-wrap"
           >
-            <span
-              class="label-help-target"
+            Description
+            <div
+              class="overlay-trigger"
             >
               <span
-                class="label-help-icon fa fa-question-circle"
-              />
-            </span>
-          </div>
+                class="label-help-target"
+              >
+                <span
+                  class="label-help-icon fa fa-question-circle"
+                />
+              </span>
+            </div>
+          </span>
         </span>
       </div>
       <div
         class="col-xs-10"
       >
         <textarea
+          aria-label="Description"
           class="form-control"
           id="entity-description"
         >
@@ -415,22 +448,24 @@ exports[`<EntityDetailsForm/> with formValues 1`] = `
         <div
           class="name-expression-label-div"
         >
-          Naming 
-          <span
-            class="domain-no-wrap"
-          >
-            Pattern
-            <div
-              class="overlay-trigger"
+          <span>
+            Naming 
+            <span
+              class="domain-no-wrap"
             >
-              <span
-                class="label-help-target"
+              Pattern
+              <div
+                class="overlay-trigger"
               >
                 <span
-                  class="label-help-icon fa fa-question-circle"
-                />
-              </span>
-            </div>
+                  class="label-help-target"
+                >
+                  <span
+                    class="label-help-icon fa fa-question-circle"
+                  />
+                </span>
+              </div>
+            </span>
           </span>
         </div>
       </div>
@@ -438,6 +473,7 @@ exports[`<EntityDetailsForm/> with formValues 1`] = `
         class="col-xs-10"
       >
         <input
+          aria-label="Naming Pattern"
           class="form-control"
           id="entity-nameExpression"
           type="text"
@@ -458,17 +494,20 @@ exports[`<EntityDetailsForm/> with previewName 1`] = `
       <div
         class="col-xs-2"
       >
-        <span
-          class="domain-no-wrap"
-        >
-          Name
-           *
+        <span>
+          <span
+            class="domain-no-wrap"
+          >
+            Name
+             *
+          </span>
         </span>
       </div>
       <div
         class="col-xs-10"
       >
         <input
+          aria-label="Name"
           class="form-control"
           id="entity-name"
           placeholder="Enter a name for this entity"
@@ -491,27 +530,30 @@ exports[`<EntityDetailsForm/> with previewName 1`] = `
       <div
         class="col-xs-2"
       >
-        <span
-          class="domain-no-wrap"
-        >
-          Description
-          <div
-            class="overlay-trigger"
+        <span>
+          <span
+            class="domain-no-wrap"
           >
-            <span
-              class="label-help-target"
+            Description
+            <div
+              class="overlay-trigger"
             >
               <span
-                class="label-help-icon fa fa-question-circle"
-              />
-            </span>
-          </div>
+                class="label-help-target"
+              >
+                <span
+                  class="label-help-icon fa fa-question-circle"
+                />
+              </span>
+            </div>
+          </span>
         </span>
       </div>
       <div
         class="col-xs-10"
       >
         <textarea
+          aria-label="Description"
           class="form-control"
           id="entity-description"
         >
@@ -528,22 +570,24 @@ exports[`<EntityDetailsForm/> with previewName 1`] = `
         <div
           class="name-expression-label-div"
         >
-          Naming 
-          <span
-            class="domain-no-wrap"
-          >
-            Pattern
-            <div
-              class="overlay-trigger"
+          <span>
+            Naming 
+            <span
+              class="domain-no-wrap"
             >
-              <span
-                class="label-help-target"
+              Pattern
+              <div
+                class="overlay-trigger"
               >
                 <span
-                  class="label-help-icon fa fa-question-circle"
-                />
-              </span>
-            </div>
+                  class="label-help-target"
+                >
+                  <span
+                    class="label-help-icon fa fa-question-circle"
+                  />
+                </span>
+              </div>
+            </span>
           </span>
         </div>
       </div>
@@ -551,6 +595,7 @@ exports[`<EntityDetailsForm/> with previewName 1`] = `
         class="col-xs-10"
       >
         <input
+          aria-label="Naming Pattern"
           class="form-control"
           id="entity-nameExpression"
           type="text"
diff --git a/packages/components/src/internal/components/domainproperties/issues/__snapshots__/IssuesListDefPropertiesPanel.test.tsx.snap b/packages/components/src/internal/components/domainproperties/issues/__snapshots__/IssuesListDefPropertiesPanel.test.tsx.snap
index d457cec29f..5d3307e2b0 100644
--- a/packages/components/src/internal/components/domainproperties/issues/__snapshots__/IssuesListDefPropertiesPanel.test.tsx.snap
+++ b/packages/components/src/internal/components/domainproperties/issues/__snapshots__/IssuesListDefPropertiesPanel.test.tsx.snap
@@ -64,22 +64,24 @@ exports[`IssuesListDefPropertiesPanel new Issue Def 1`] = `
                     <div
                       class="col-xs-3 col-lg-4"
                     >
-                      Comment Sort 
-                      <span
-                        class="domain-no-wrap"
-                      >
-                        Direction
-                        <div
-                          class="overlay-trigger"
+                      <span>
+                        Comment Sort 
+                        <span
+                          class="domain-no-wrap"
                         >
-                          <span
-                            class="label-help-target"
+                          Direction
+                          <div
+                            class="overlay-trigger"
                           >
                             <span
-                              class="label-help-icon fa fa-question-circle"
-                            />
-                          </span>
-                        </div>
+                              class="label-help-target"
+                            >
+                              <span
+                                class="label-help-icon fa fa-question-circle"
+                              />
+                            </span>
+                          </div>
+                        </span>
                       </span>
                     </div>
                     <div
@@ -182,28 +184,33 @@ exports[`IssuesListDefPropertiesPanel new Issue Def 1`] = `
                     <div
                       class="col-xs-3 col-lg-4"
                     >
-                      Singular Item 
                       <span
-                        class="domain-no-wrap"
+                        id="singular-item-name-label"
                       >
-                        Name
-                        <div
-                          class="overlay-trigger"
+                        Singular Item 
+                        <span
+                          class="domain-no-wrap"
                         >
-                          <span
-                            class="label-help-target"
+                          Name
+                          <div
+                            class="overlay-trigger"
                           >
                             <span
-                              class="label-help-icon fa fa-question-circle"
-                            />
-                          </span>
-                        </div>
+                              class="label-help-target"
+                            >
+                              <span
+                                class="label-help-icon fa fa-question-circle"
+                              />
+                            </span>
+                          </div>
+                        </span>
                       </span>
                     </div>
                     <div
                       class="col-xs-9 col-lg-8"
                     >
                       <input
+                        aria-labelledby="singular-item-name-label"
                         class="form-control"
                         id="singularItemName"
                         type="text"
@@ -217,28 +224,33 @@ exports[`IssuesListDefPropertiesPanel new Issue Def 1`] = `
                     <div
                       class="col-xs-3 col-lg-4"
                     >
-                      Plural Items 
                       <span
-                        class="domain-no-wrap"
+                        id="plural-items-name-label"
                       >
-                        Name
-                        <div
-                          class="overlay-trigger"
+                        Plural Items 
+                        <span
+                          class="domain-no-wrap"
                         >
-                          <span
-                            class="label-help-target"
+                          Name
+                          <div
+                            class="overlay-trigger"
                           >
                             <span
-                              class="label-help-icon fa fa-question-circle"
-                            />
-                          </span>
-                        </div>
+                              class="label-help-target"
+                            >
+                              <span
+                                class="label-help-icon fa fa-question-circle"
+                              />
+                            </span>
+                          </div>
+                        </span>
                       </span>
                     </div>
                     <div
                       class="col-xs-9 col-lg-8"
                     >
                       <input
+                        aria-labelledby="plural-items-name-label"
                         class="form-control"
                         id="pluralItemName"
                         type="text"
@@ -263,22 +275,24 @@ exports[`IssuesListDefPropertiesPanel new Issue Def 1`] = `
                 <div
                   class="col-xs-3 col-lg-4"
                 >
-                  Populate 'Assigned To' Field 
-                  <span
-                    class="domain-no-wrap"
-                  >
-                    from
-                    <div
-                      class="overlay-trigger"
+                  <span>
+                    Populate 'Assigned To' Field 
+                    <span
+                      class="domain-no-wrap"
                     >
-                      <span
-                        class="label-help-target"
+                      from
+                      <div
+                        class="overlay-trigger"
                       >
                         <span
-                          class="label-help-icon fa fa-question-circle"
-                        />
-                      </span>
-                    </div>
+                          class="label-help-target"
+                        >
+                          <span
+                            class="label-help-icon fa fa-question-circle"
+                          />
+                        </span>
+                      </div>
+                    </span>
                   </span>
                 </div>
                 <div
@@ -302,22 +316,24 @@ exports[`IssuesListDefPropertiesPanel new Issue Def 1`] = `
                 <div
                   class="col-xs-3 col-lg-4"
                 >
-                  Default User 
-                  <span
-                    class="domain-no-wrap"
-                  >
-                    Assignment
-                    <div
-                      class="overlay-trigger"
+                  <span>
+                    Default User 
+                    <span
+                      class="domain-no-wrap"
                     >
-                      <span
-                        class="label-help-target"
+                      Assignment
+                      <div
+                        class="overlay-trigger"
                       >
                         <span
-                          class="label-help-icon fa fa-question-circle"
-                        />
-                      </span>
-                    </div>
+                          class="label-help-target"
+                        >
+                          <span
+                            class="label-help-icon fa fa-question-circle"
+                          />
+                        </span>
+                      </div>
+                    </span>
                   </span>
                 </div>
                 <div
@@ -341,22 +357,24 @@ exports[`IssuesListDefPropertiesPanel new Issue Def 1`] = `
                 <div
                   class="col-xs-3 col-lg-4"
                 >
-                  Default Related Issue 
-                  <span
-                    class="domain-no-wrap"
-                  >
-                    Folder
-                    <div
-                      class="overlay-trigger"
+                  <span>
+                    Default Related Issue 
+                    <span
+                      class="domain-no-wrap"
                     >
-                      <span
-                        class="label-help-target"
+                      Folder
+                      <div
+                        class="overlay-trigger"
                       >
                         <span
-                          class="label-help-icon fa fa-question-circle"
-                        />
-                      </span>
-                    </div>
+                          class="label-help-target"
+                        >
+                          <span
+                            class="label-help-icon fa fa-question-circle"
+                          />
+                        </span>
+                      </div>
+                    </span>
                   </span>
                 </div>
                 <div
@@ -470,22 +488,24 @@ exports[`IssuesListDefPropertiesPanel new Issue Def 1`] = `
                   <div
                     class="col-xs-3 col-lg-4"
                   >
-                    Comment Sort 
-                    <span
-                      class="domain-no-wrap"
-                    >
-                      Direction
-                      <div
-                        class="overlay-trigger"
+                    <span>
+                      Comment Sort 
+                      <span
+                        class="domain-no-wrap"
                       >
-                        <span
-                          class="label-help-target"
+                        Direction
+                        <div
+                          class="overlay-trigger"
                         >
                           <span
-                            class="label-help-icon fa fa-question-circle"
-                          />
-                        </span>
-                      </div>
+                            class="label-help-target"
+                          >
+                            <span
+                              class="label-help-icon fa fa-question-circle"
+                            />
+                          </span>
+                        </div>
+                      </span>
                     </span>
                   </div>
                   <div
@@ -588,28 +608,33 @@ exports[`IssuesListDefPropertiesPanel new Issue Def 1`] = `
                   <div
                     class="col-xs-3 col-lg-4"
                   >
-                    Singular Item 
                     <span
-                      class="domain-no-wrap"
+                      id="singular-item-name-label"
                     >
-                      Name
-                      <div
-                        class="overlay-trigger"
+                      Singular Item 
+                      <span
+                        class="domain-no-wrap"
                       >
-                        <span
-                          class="label-help-target"
+                        Name
+                        <div
+                          class="overlay-trigger"
                         >
                           <span
-                            class="label-help-icon fa fa-question-circle"
-                          />
-                        </span>
-                      </div>
+                            class="label-help-target"
+                          >
+                            <span
+                              class="label-help-icon fa fa-question-circle"
+                            />
+                          </span>
+                        </div>
+                      </span>
                     </span>
                   </div>
                   <div
                     class="col-xs-9 col-lg-8"
                   >
                     <input
+                      aria-labelledby="singular-item-name-label"
                       class="form-control"
                       id="singularItemName"
                       type="text"
@@ -623,28 +648,33 @@ exports[`IssuesListDefPropertiesPanel new Issue Def 1`] = `
                   <div
                     class="col-xs-3 col-lg-4"
                   >
-                    Plural Items 
                     <span
-                      class="domain-no-wrap"
+                      id="plural-items-name-label"
                     >
-                      Name
-                      <div
-                        class="overlay-trigger"
+                      Plural Items 
+                      <span
+                        class="domain-no-wrap"
                       >
-                        <span
-                          class="label-help-target"
+                        Name
+                        <div
+                          class="overlay-trigger"
                         >
                           <span
-                            class="label-help-icon fa fa-question-circle"
-                          />
-                        </span>
-                      </div>
+                            class="label-help-target"
+                          >
+                            <span
+                              class="label-help-icon fa fa-question-circle"
+                            />
+                          </span>
+                        </div>
+                      </span>
                     </span>
                   </div>
                   <div
                     class="col-xs-9 col-lg-8"
                   >
                     <input
+                      aria-labelledby="plural-items-name-label"
                       class="form-control"
                       id="pluralItemName"
                       type="text"
@@ -669,22 +699,24 @@ exports[`IssuesListDefPropertiesPanel new Issue Def 1`] = `
               <div
                 class="col-xs-3 col-lg-4"
               >
-                Populate 'Assigned To' Field 
-                <span
-                  class="domain-no-wrap"
-                >
-                  from
-                  <div
-                    class="overlay-trigger"
+                <span>
+                  Populate 'Assigned To' Field 
+                  <span
+                    class="domain-no-wrap"
                   >
-                    <span
-                      class="label-help-target"
+                    from
+                    <div
+                      class="overlay-trigger"
                     >
                       <span
-                        class="label-help-icon fa fa-question-circle"
-                      />
-                    </span>
-                  </div>
+                        class="label-help-target"
+                      >
+                        <span
+                          class="label-help-icon fa fa-question-circle"
+                        />
+                      </span>
+                    </div>
+                  </span>
                 </span>
               </div>
               <div
@@ -708,22 +740,24 @@ exports[`IssuesListDefPropertiesPanel new Issue Def 1`] = `
               <div
                 class="col-xs-3 col-lg-4"
               >
-                Default User 
-                <span
-                  class="domain-no-wrap"
-                >
-                  Assignment
-                  <div
-                    class="overlay-trigger"
+                <span>
+                  Default User 
+                  <span
+                    class="domain-no-wrap"
                   >
-                    <span
-                      class="label-help-target"
+                    Assignment
+                    <div
+                      class="overlay-trigger"
                     >
                       <span
-                        class="label-help-icon fa fa-question-circle"
-                      />
-                    </span>
-                  </div>
+                        class="label-help-target"
+                      >
+                        <span
+                          class="label-help-icon fa fa-question-circle"
+                        />
+                      </span>
+                    </div>
+                  </span>
                 </span>
               </div>
               <div
@@ -747,22 +781,24 @@ exports[`IssuesListDefPropertiesPanel new Issue Def 1`] = `
               <div
                 class="col-xs-3 col-lg-4"
               >
-                Default Related Issue 
-                <span
-                  class="domain-no-wrap"
-                >
-                  Folder
-                  <div
-                    class="overlay-trigger"
+                <span>
+                  Default Related Issue 
+                  <span
+                    class="domain-no-wrap"
                   >
-                    <span
-                      class="label-help-target"
+                    Folder
+                    <div
+                      class="overlay-trigger"
                     >
                       <span
-                        class="label-help-icon fa fa-question-circle"
-                      />
-                    </span>
-                  </div>
+                        class="label-help-target"
+                      >
+                        <span
+                          class="label-help-icon fa fa-question-circle"
+                        />
+                      </span>
+                    </div>
+                  </span>
                 </span>
               </div>
               <div
diff --git a/packages/components/src/internal/components/domainproperties/list/__snapshots__/ListPropertiesPanel.test.tsx.snap b/packages/components/src/internal/components/domainproperties/list/__snapshots__/ListPropertiesPanel.test.tsx.snap
index 1eee5b6b70..2069e83caa 100644
--- a/packages/components/src/internal/components/domainproperties/list/__snapshots__/ListPropertiesPanel.test.tsx.snap
+++ b/packages/components/src/internal/components/domainproperties/list/__snapshots__/ListPropertiesPanel.test.tsx.snap
@@ -68,27 +68,32 @@ exports[`ListPropertiesPanel existing list 1`] = `
                   class="col-xs-3 col-lg-2"
                 >
                   <span
-                    class="domain-no-wrap"
+                    id="name-label"
                   >
-                    Name
-                    <div
-                      class="overlay-trigger"
+                    <span
+                      class="domain-no-wrap"
                     >
-                      <span
-                        class="label-help-target"
+                      Name
+                      <div
+                        class="overlay-trigger"
                       >
                         <span
-                          class="label-help-icon fa fa-question-circle"
-                        />
-                      </span>
-                    </div>
-                     *
+                          class="label-help-target"
+                        >
+                          <span
+                            class="label-help-icon fa fa-question-circle"
+                          />
+                        </span>
+                      </div>
+                       *
+                    </span>
                   </span>
                 </div>
                 <div
                   class="col-xs-9 col-lg-8"
                 >
                   <input
+                    aria-labelledby="name-label"
                     class="form-control"
                     id="name"
                     placeholder="Enter a name for this list"
@@ -103,10 +108,12 @@ exports[`ListPropertiesPanel existing list 1`] = `
                 <div
                   class="col-xs-3 col-lg-2"
                 >
-                  <span
-                    class="domain-no-wrap"
-                  >
-                    Description
+                  <span>
+                    <span
+                      class="domain-no-wrap"
+                    >
+                      Description
+                    </span>
                   </span>
                 </div>
                 <div
@@ -257,27 +264,32 @@ exports[`ListPropertiesPanel existing list 1`] = `
                 class="col-xs-3 col-lg-2"
               >
                 <span
-                  class="domain-no-wrap"
+                  id="name-label"
                 >
-                  Name
-                  <div
-                    class="overlay-trigger"
+                  <span
+                    class="domain-no-wrap"
                   >
-                    <span
-                      class="label-help-target"
+                    Name
+                    <div
+                      class="overlay-trigger"
                     >
                       <span
-                        class="label-help-icon fa fa-question-circle"
-                      />
-                    </span>
-                  </div>
-                   *
+                        class="label-help-target"
+                      >
+                        <span
+                          class="label-help-icon fa fa-question-circle"
+                        />
+                      </span>
+                    </div>
+                     *
+                  </span>
                 </span>
               </div>
               <div
                 class="col-xs-9 col-lg-8"
               >
                 <input
+                  aria-labelledby="name-label"
                   class="form-control"
                   id="name"
                   placeholder="Enter a name for this list"
@@ -292,10 +304,12 @@ exports[`ListPropertiesPanel existing list 1`] = `
               <div
                 class="col-xs-3 col-lg-2"
               >
-                <span
-                  class="domain-no-wrap"
-                >
-                  Description
+                <span>
+                  <span
+                    class="domain-no-wrap"
+                  >
+                    Description
+                  </span>
                 </span>
               </div>
               <div
@@ -506,27 +520,32 @@ exports[`ListPropertiesPanel list with error 1`] = `
                   class="col-xs-3 col-lg-2"
                 >
                   <span
-                    class="domain-no-wrap"
+                    id="name-label"
                   >
-                    Name
-                    <div
-                      class="overlay-trigger"
+                    <span
+                      class="domain-no-wrap"
                     >
-                      <span
-                        class="label-help-target"
+                      Name
+                      <div
+                        class="overlay-trigger"
                       >
                         <span
-                          class="label-help-icon fa fa-question-circle"
-                        />
-                      </span>
-                    </div>
-                     *
+                          class="label-help-target"
+                        >
+                          <span
+                            class="label-help-icon fa fa-question-circle"
+                          />
+                        </span>
+                      </div>
+                       *
+                    </span>
                   </span>
                 </div>
                 <div
                   class="col-xs-9 col-lg-8"
                 >
                   <input
+                    aria-labelledby="name-label"
                     class="form-control"
                     id="name"
                     placeholder="Enter a name for this list"
@@ -541,10 +560,12 @@ exports[`ListPropertiesPanel list with error 1`] = `
                 <div
                   class="col-xs-3 col-lg-2"
                 >
-                  <span
-                    class="domain-no-wrap"
-                  >
-                    Description
+                  <span>
+                    <span
+                      class="domain-no-wrap"
+                    >
+                      Description
+                    </span>
                   </span>
                 </div>
                 <div
@@ -708,27 +729,32 @@ exports[`ListPropertiesPanel list with error 1`] = `
                 class="col-xs-3 col-lg-2"
               >
                 <span
-                  class="domain-no-wrap"
+                  id="name-label"
                 >
-                  Name
-                  <div
-                    class="overlay-trigger"
+                  <span
+                    class="domain-no-wrap"
                   >
-                    <span
-                      class="label-help-target"
+                    Name
+                    <div
+                      class="overlay-trigger"
                     >
                       <span
-                        class="label-help-icon fa fa-question-circle"
-                      />
-                    </span>
-                  </div>
-                   *
+                        class="label-help-target"
+                      >
+                        <span
+                          class="label-help-icon fa fa-question-circle"
+                        />
+                      </span>
+                    </div>
+                     *
+                  </span>
                 </span>
               </div>
               <div
                 class="col-xs-9 col-lg-8"
               >
                 <input
+                  aria-labelledby="name-label"
                   class="form-control"
                   id="name"
                   placeholder="Enter a name for this list"
@@ -743,10 +769,12 @@ exports[`ListPropertiesPanel list with error 1`] = `
               <div
                 class="col-xs-3 col-lg-2"
               >
-                <span
-                  class="domain-no-wrap"
-                >
-                  Description
+                <span>
+                  <span
+                    class="domain-no-wrap"
+                  >
+                    Description
+                  </span>
                 </span>
               </div>
               <div
@@ -942,27 +970,32 @@ exports[`ListPropertiesPanel new list 1`] = `
                   class="col-xs-3 col-lg-2"
                 >
                   <span
-                    class="domain-no-wrap"
+                    id="name-label"
                   >
-                    Name
-                    <div
-                      class="overlay-trigger"
+                    <span
+                      class="domain-no-wrap"
                     >
-                      <span
-                        class="label-help-target"
+                      Name
+                      <div
+                        class="overlay-trigger"
                       >
                         <span
-                          class="label-help-icon fa fa-question-circle"
-                        />
-                      </span>
-                    </div>
-                     *
+                          class="label-help-target"
+                        >
+                          <span
+                            class="label-help-icon fa fa-question-circle"
+                          />
+                        </span>
+                      </div>
+                       *
+                    </span>
                   </span>
                 </div>
                 <div
                   class="col-xs-9 col-lg-8"
                 >
                   <input
+                    aria-labelledby="name-label"
                     class="form-control"
                     id="name"
                     placeholder="Enter a name for this list"
@@ -977,10 +1010,12 @@ exports[`ListPropertiesPanel new list 1`] = `
                 <div
                   class="col-xs-3 col-lg-2"
                 >
-                  <span
-                    class="domain-no-wrap"
-                  >
-                    Description
+                  <span>
+                    <span
+                      class="domain-no-wrap"
+                    >
+                      Description
+                    </span>
                   </span>
                 </div>
                 <div
@@ -1124,27 +1159,32 @@ exports[`ListPropertiesPanel new list 1`] = `
                 class="col-xs-3 col-lg-2"
               >
                 <span
-                  class="domain-no-wrap"
+                  id="name-label"
                 >
-                  Name
-                  <div
-                    class="overlay-trigger"
+                  <span
+                    class="domain-no-wrap"
                   >
-                    <span
-                      class="label-help-target"
+                    Name
+                    <div
+                      class="overlay-trigger"
                     >
                       <span
-                        class="label-help-icon fa fa-question-circle"
-                      />
-                    </span>
-                  </div>
-                   *
+                        class="label-help-target"
+                      >
+                        <span
+                          class="label-help-icon fa fa-question-circle"
+                        />
+                      </span>
+                    </div>
+                     *
+                  </span>
                 </span>
               </div>
               <div
                 class="col-xs-9 col-lg-8"
               >
                 <input
+                  aria-labelledby="name-label"
                   class="form-control"
                   id="name"
                   placeholder="Enter a name for this list"
@@ -1159,10 +1199,12 @@ exports[`ListPropertiesPanel new list 1`] = `
               <div
                 class="col-xs-3 col-lg-2"
               >
-                <span
-                  class="domain-no-wrap"
-                >
-                  Description
+                <span>
+                  <span
+                    class="domain-no-wrap"
+                  >
+                    Description
+                  </span>
                 </span>
               </div>
               <div
diff --git a/packages/components/src/internal/components/domainproperties/list/__snapshots__/ListPropertiesPanelFormElements.test.tsx.snap b/packages/components/src/internal/components/domainproperties/list/__snapshots__/ListPropertiesPanelFormElements.test.tsx.snap
index c04201255a..501fe58903 100644
--- a/packages/components/src/internal/components/domainproperties/list/__snapshots__/ListPropertiesPanelFormElements.test.tsx.snap
+++ b/packages/components/src/internal/components/domainproperties/list/__snapshots__/ListPropertiesPanelFormElements.test.tsx.snap
@@ -143,27 +143,32 @@ exports[`BasicPropertiesFields existing list, existing properties 1`] = `
         class="col-xs-3 col-lg-2"
       >
         <span
-          class="domain-no-wrap"
+          id="name-label"
         >
-          Name
-          <div
-            class="overlay-trigger"
+          <span
+            class="domain-no-wrap"
           >
-            <span
-              class="label-help-target"
+            Name
+            <div
+              class="overlay-trigger"
             >
               <span
-                class="label-help-icon fa fa-question-circle"
-              />
-            </span>
-          </div>
-           *
+                class="label-help-target"
+              >
+                <span
+                  class="label-help-icon fa fa-question-circle"
+                />
+              </span>
+            </div>
+             *
+          </span>
         </span>
       </div>
       <div
         class="col-xs-9 col-lg-8"
       >
         <input
+          aria-labelledby="name-label"
           class="form-control"
           id="name"
           placeholder="Enter a name for this list"
@@ -178,10 +183,12 @@ exports[`BasicPropertiesFields existing list, existing properties 1`] = `
       <div
         class="col-xs-3 col-lg-2"
       >
-        <span
-          class="domain-no-wrap"
-        >
-          Description
+        <span>
+          <span
+            class="domain-no-wrap"
+          >
+            Description
+          </span>
         </span>
       </div>
       <div
@@ -214,27 +221,32 @@ exports[`BasicPropertiesFields new list, default properties 1`] = `
         class="col-xs-3 col-lg-2"
       >
         <span
-          class="domain-no-wrap"
+          id="name-label"
         >
-          Name
-          <div
-            class="overlay-trigger"
+          <span
+            class="domain-no-wrap"
           >
-            <span
-              class="label-help-target"
+            Name
+            <div
+              class="overlay-trigger"
             >
               <span
-                class="label-help-icon fa fa-question-circle"
-              />
-            </span>
-          </div>
-           *
+                class="label-help-target"
+              >
+                <span
+                  class="label-help-icon fa fa-question-circle"
+                />
+              </span>
+            </div>
+             *
+          </span>
         </span>
       </div>
       <div
         class="col-xs-9 col-lg-8"
       >
         <input
+          aria-labelledby="name-label"
           class="form-control"
           id="name"
           placeholder="Enter a name for this list"
@@ -249,10 +261,12 @@ exports[`BasicPropertiesFields new list, default properties 1`] = `
       <div
         class="col-xs-3 col-lg-2"
       >
-        <span
-          class="domain-no-wrap"
-        >
-          Description
+        <span>
+          <span
+            class="domain-no-wrap"
+          >
+            Description
+          </span>
         </span>
       </div>
       <div
diff --git a/packages/components/src/internal/components/domainproperties/list/__snapshots__/SetKeyFieldNamePanel.test.tsx.snap b/packages/components/src/internal/components/domainproperties/list/__snapshots__/SetKeyFieldNamePanel.test.tsx.snap
index 57976b91d1..95a2be6450 100644
--- a/packages/components/src/internal/components/domainproperties/list/__snapshots__/SetKeyFieldNamePanel.test.tsx.snap
+++ b/packages/components/src/internal/components/domainproperties/list/__snapshots__/SetKeyFieldNamePanel.test.tsx.snap
@@ -17,23 +17,25 @@ exports[`SetKeyFieldNamePanel existing list, given properties 1`] = `
       <div
         class="col-xs-3"
       >
-        Key Field 
-        <span
-          class="domain-no-wrap"
-        >
-          Name
-          <div
-            class="overlay-trigger"
+        <span>
+          Key Field 
+          <span
+            class="domain-no-wrap"
           >
-            <span
-              class="label-help-target"
+            Name
+            <div
+              class="overlay-trigger"
             >
               <span
-                class="label-help-icon fa fa-question-circle"
-              />
-            </span>
-          </div>
-           *
+                class="label-help-target"
+              >
+                <span
+                  class="label-help-icon fa fa-question-circle"
+                />
+              </span>
+            </div>
+             *
+          </span>
         </span>
       </div>
       <div
@@ -107,23 +109,25 @@ exports[`SetKeyFieldNamePanel list with auto integer key 1`] = `
       <div
         class="col-xs-3"
       >
-        Key Field 
-        <span
-          class="domain-no-wrap"
-        >
-          Name
-          <div
-            class="overlay-trigger"
+        <span>
+          Key Field 
+          <span
+            class="domain-no-wrap"
           >
-            <span
-              class="label-help-target"
+            Name
+            <div
+              class="overlay-trigger"
             >
               <span
-                class="label-help-icon fa fa-question-circle"
-              />
-            </span>
-          </div>
-           *
+                class="label-help-target"
+              >
+                <span
+                  class="label-help-icon fa fa-question-circle"
+                />
+              </span>
+            </div>
+             *
+          </span>
         </span>
       </div>
       <div
@@ -197,23 +201,25 @@ exports[`SetKeyFieldNamePanel new list, default properties 1`] = `
       <div
         class="col-xs-3"
       >
-        Key Field 
-        <span
-          class="domain-no-wrap"
-        >
-          Name
-          <div
-            class="overlay-trigger"
+        <span>
+          Key Field 
+          <span
+            class="domain-no-wrap"
           >
-            <span
-              class="label-help-target"
+            Name
+            <div
+              class="overlay-trigger"
             >
               <span
-                class="label-help-icon fa fa-question-circle"
-              />
-            </span>
-          </div>
-           *
+                class="label-help-target"
+              >
+                <span
+                  class="label-help-icon fa fa-question-circle"
+                />
+              </span>
+            </div>
+             *
+          </span>
         </span>
       </div>
       <div
diff --git a/packages/components/src/internal/components/domainproperties/samples/__snapshots__/SampleTypePropertiesPanel.test.tsx.snap b/packages/components/src/internal/components/domainproperties/samples/__snapshots__/SampleTypePropertiesPanel.test.tsx.snap
index c0fbacf3d4..98aca0b420 100644
--- a/packages/components/src/internal/components/domainproperties/samples/__snapshots__/SampleTypePropertiesPanel.test.tsx.snap
+++ b/packages/components/src/internal/components/domainproperties/samples/__snapshots__/SampleTypePropertiesPanel.test.tsx.snap
@@ -57,17 +57,20 @@ exports[`SampleTypePropertiesPanel appPropertiesOnly 1`] = `
               <div
                 class="col-xs-2"
               >
-                <span
-                  class="domain-no-wrap"
-                >
-                  Name
-                   *
+                <span>
+                  <span
+                    class="domain-no-wrap"
+                  >
+                    Name
+                     *
+                  </span>
                 </span>
               </div>
               <div
                 class="col-xs-10"
               >
                 <input
+                  aria-label="Name"
                   class="form-control"
                   id="entity-name"
                   placeholder="Enter a name for this sample type"
@@ -90,27 +93,30 @@ exports[`SampleTypePropertiesPanel appPropertiesOnly 1`] = `
               <div
                 class="col-xs-2"
               >
-                <span
-                  class="domain-no-wrap"
-                >
-                  Description
-                  <div
-                    class="overlay-trigger"
+                <span>
+                  <span
+                    class="domain-no-wrap"
                   >
-                    <span
-                      class="label-help-target"
+                    Description
+                    <div
+                      class="overlay-trigger"
                     >
                       <span
-                        class="label-help-icon fa fa-question-circle"
-                      />
-                    </span>
-                  </div>
+                        class="label-help-target"
+                      >
+                        <span
+                          class="label-help-icon fa fa-question-circle"
+                        />
+                      </span>
+                    </div>
+                  </span>
                 </span>
               </div>
               <div
                 class="col-xs-10"
               >
                 <textarea
+                  aria-label="Description"
                   class="form-control"
                   id="entity-description"
                 />
@@ -125,22 +131,24 @@ exports[`SampleTypePropertiesPanel appPropertiesOnly 1`] = `
                 <div
                   class="name-expression-label-div"
                 >
-                  Naming 
-                  <span
-                    class="domain-no-wrap"
-                  >
-                    Pattern
-                    <div
-                      class="overlay-trigger"
+                  <span>
+                    Naming 
+                    <span
+                      class="domain-no-wrap"
                     >
-                      <span
-                        class="label-help-target"
+                      Pattern
+                      <div
+                        class="overlay-trigger"
                       >
                         <span
-                          class="label-help-icon fa fa-question-circle"
-                        />
-                      </span>
-                    </div>
+                          class="label-help-target"
+                        >
+                          <span
+                            class="label-help-icon fa fa-question-circle"
+                          />
+                        </span>
+                      </div>
+                    </span>
                   </span>
                 </div>
               </div>
@@ -148,6 +156,7 @@ exports[`SampleTypePropertiesPanel appPropertiesOnly 1`] = `
                 class="col-xs-10"
               >
                 <input
+                  aria-label="Naming Pattern"
                   class="form-control naming-pattern-border-warning"
                   id="entity-nameExpression"
                   placeholder="Enter a naming pattern (e.g., S-\${now:date}-\${dailySampleCount})"
@@ -201,22 +210,24 @@ exports[`SampleTypePropertiesPanel appPropertiesOnly 1`] = `
             <div
               class="col-xs-2"
             >
-              Label 
-              <span
-                class="domain-no-wrap"
-              >
-                Color
-                <div
-                  class="overlay-trigger"
+              <span>
+                Label 
+                <span
+                  class="domain-no-wrap"
                 >
-                  <span
-                    class="label-help-target"
+                  Color
+                  <div
+                    class="overlay-trigger"
                   >
                     <span
-                      class="label-help-icon fa fa-question-circle"
-                    />
-                  </span>
-                </div>
+                      class="label-help-target"
+                    >
+                      <span
+                        class="label-help-icon fa fa-question-circle"
+                      />
+                    </span>
+                  </div>
+                </span>
               </span>
             </div>
             <div
@@ -327,17 +338,20 @@ exports[`SampleTypePropertiesPanel appPropertiesOnly 1`] = `
             <div
               class="col-xs-2"
             >
-              <span
-                class="domain-no-wrap"
-              >
-                Name
-                 *
+              <span>
+                <span
+                  class="domain-no-wrap"
+                >
+                  Name
+                   *
+                </span>
               </span>
             </div>
             <div
               class="col-xs-10"
             >
               <input
+                aria-label="Name"
                 class="form-control"
                 id="entity-name"
                 placeholder="Enter a name for this sample type"
@@ -360,27 +374,30 @@ exports[`SampleTypePropertiesPanel appPropertiesOnly 1`] = `
             <div
               class="col-xs-2"
             >
-              <span
-                class="domain-no-wrap"
-              >
-                Description
-                <div
-                  class="overlay-trigger"
+              <span>
+                <span
+                  class="domain-no-wrap"
                 >
-                  <span
-                    class="label-help-target"
+                  Description
+                  <div
+                    class="overlay-trigger"
                   >
                     <span
-                      class="label-help-icon fa fa-question-circle"
-                    />
-                  </span>
-                </div>
+                      class="label-help-target"
+                    >
+                      <span
+                        class="label-help-icon fa fa-question-circle"
+                      />
+                    </span>
+                  </div>
+                </span>
               </span>
             </div>
             <div
               class="col-xs-10"
             >
               <textarea
+                aria-label="Description"
                 class="form-control"
                 id="entity-description"
               />
@@ -395,22 +412,24 @@ exports[`SampleTypePropertiesPanel appPropertiesOnly 1`] = `
               <div
                 class="name-expression-label-div"
               >
-                Naming 
-                <span
-                  class="domain-no-wrap"
-                >
-                  Pattern
-                  <div
-                    class="overlay-trigger"
+                <span>
+                  Naming 
+                  <span
+                    class="domain-no-wrap"
                   >
-                    <span
-                      class="label-help-target"
+                    Pattern
+                    <div
+                      class="overlay-trigger"
                     >
                       <span
-                        class="label-help-icon fa fa-question-circle"
-                      />
-                    </span>
-                  </div>
+                        class="label-help-target"
+                      >
+                        <span
+                          class="label-help-icon fa fa-question-circle"
+                        />
+                      </span>
+                    </div>
+                  </span>
                 </span>
               </div>
             </div>
@@ -418,6 +437,7 @@ exports[`SampleTypePropertiesPanel appPropertiesOnly 1`] = `
               class="col-xs-10"
             >
               <input
+                aria-label="Naming Pattern"
                 class="form-control naming-pattern-border-warning"
                 id="entity-nameExpression"
                 placeholder="Enter a naming pattern (e.g., S-\${now:date}-\${dailySampleCount})"
@@ -471,22 +491,24 @@ exports[`SampleTypePropertiesPanel appPropertiesOnly 1`] = `
           <div
             class="col-xs-2"
           >
-            Label 
-            <span
-              class="domain-no-wrap"
-            >
-              Color
-              <div
-                class="overlay-trigger"
+            <span>
+              Label 
+              <span
+                class="domain-no-wrap"
               >
-                <span
-                  class="label-help-target"
+                Color
+                <div
+                  class="overlay-trigger"
                 >
                   <span
-                    class="label-help-icon fa fa-question-circle"
-                  />
-                </span>
-              </div>
+                    class="label-help-target"
+                  >
+                    <span
+                      class="label-help-icon fa fa-question-circle"
+                    />
+                  </span>
+                </div>
+              </span>
             </span>
           </div>
           <div
@@ -634,17 +656,20 @@ exports[`SampleTypePropertiesPanel default props 1`] = `
               <div
                 class="col-xs-2"
               >
-                <span
-                  class="domain-no-wrap"
-                >
-                  Name
-                   *
+                <span>
+                  <span
+                    class="domain-no-wrap"
+                  >
+                    Name
+                     *
+                  </span>
                 </span>
               </div>
               <div
                 class="col-xs-10"
               >
                 <input
+                  aria-label="Name"
                   class="form-control"
                   id="entity-name"
                   placeholder="Enter a name for this sample type"
@@ -667,27 +692,30 @@ exports[`SampleTypePropertiesPanel default props 1`] = `
               <div
                 class="col-xs-2"
               >
-                <span
-                  class="domain-no-wrap"
-                >
-                  Description
-                  <div
-                    class="overlay-trigger"
+                <span>
+                  <span
+                    class="domain-no-wrap"
                   >
-                    <span
-                      class="label-help-target"
+                    Description
+                    <div
+                      class="overlay-trigger"
                     >
                       <span
-                        class="label-help-icon fa fa-question-circle"
-                      />
-                    </span>
-                  </div>
+                        class="label-help-target"
+                      >
+                        <span
+                          class="label-help-icon fa fa-question-circle"
+                        />
+                      </span>
+                    </div>
+                  </span>
                 </span>
               </div>
               <div
                 class="col-xs-10"
               >
                 <textarea
+                  aria-label="Description"
                   class="form-control"
                   id="entity-description"
                 />
@@ -702,22 +730,24 @@ exports[`SampleTypePropertiesPanel default props 1`] = `
                 <div
                   class="name-expression-label-div"
                 >
-                  Naming 
-                  <span
-                    class="domain-no-wrap"
-                  >
-                    Pattern
-                    <div
-                      class="overlay-trigger"
+                  <span>
+                    Naming 
+                    <span
+                      class="domain-no-wrap"
                     >
-                      <span
-                        class="label-help-target"
+                      Pattern
+                      <div
+                        class="overlay-trigger"
                       >
                         <span
-                          class="label-help-icon fa fa-question-circle"
-                        />
-                      </span>
-                    </div>
+                          class="label-help-target"
+                        >
+                          <span
+                            class="label-help-icon fa fa-question-circle"
+                          />
+                        </span>
+                      </div>
+                    </span>
                   </span>
                 </div>
               </div>
@@ -725,6 +755,7 @@ exports[`SampleTypePropertiesPanel default props 1`] = `
                 class="col-xs-10"
               >
                 <input
+                  aria-label="Naming Pattern"
                   class="form-control naming-pattern-border-warning"
                   id="entity-nameExpression"
                   placeholder="Enter a naming pattern (e.g., S-\${now:date}-\${dailySampleCount})"
@@ -839,17 +870,20 @@ exports[`SampleTypePropertiesPanel default props 1`] = `
             <div
               class="col-xs-2"
             >
-              <span
-                class="domain-no-wrap"
-              >
-                Name
-                 *
+              <span>
+                <span
+                  class="domain-no-wrap"
+                >
+                  Name
+                   *
+                </span>
               </span>
             </div>
             <div
               class="col-xs-10"
             >
               <input
+                aria-label="Name"
                 class="form-control"
                 id="entity-name"
                 placeholder="Enter a name for this sample type"
@@ -872,27 +906,30 @@ exports[`SampleTypePropertiesPanel default props 1`] = `
             <div
               class="col-xs-2"
             >
-              <span
-                class="domain-no-wrap"
-              >
-                Description
-                <div
-                  class="overlay-trigger"
+              <span>
+                <span
+                  class="domain-no-wrap"
                 >
-                  <span
-                    class="label-help-target"
+                  Description
+                  <div
+                    class="overlay-trigger"
                   >
                     <span
-                      class="label-help-icon fa fa-question-circle"
-                    />
-                  </span>
-                </div>
+                      class="label-help-target"
+                    >
+                      <span
+                        class="label-help-icon fa fa-question-circle"
+                      />
+                    </span>
+                  </div>
+                </span>
               </span>
             </div>
             <div
               class="col-xs-10"
             >
               <textarea
+                aria-label="Description"
                 class="form-control"
                 id="entity-description"
               />
@@ -907,22 +944,24 @@ exports[`SampleTypePropertiesPanel default props 1`] = `
               <div
                 class="name-expression-label-div"
               >
-                Naming 
-                <span
-                  class="domain-no-wrap"
-                >
-                  Pattern
-                  <div
-                    class="overlay-trigger"
+                <span>
+                  Naming 
+                  <span
+                    class="domain-no-wrap"
                   >
-                    <span
-                      class="label-help-target"
+                    Pattern
+                    <div
+                      class="overlay-trigger"
                     >
                       <span
-                        class="label-help-icon fa fa-question-circle"
-                      />
-                    </span>
-                  </div>
+                        class="label-help-target"
+                      >
+                        <span
+                          class="label-help-icon fa fa-question-circle"
+                        />
+                      </span>
+                    </div>
+                  </span>
                 </span>
               </div>
             </div>
@@ -930,6 +969,7 @@ exports[`SampleTypePropertiesPanel default props 1`] = `
               class="col-xs-10"
             >
               <input
+                aria-label="Naming Pattern"
                 class="form-control naming-pattern-border-warning"
                 id="entity-nameExpression"
                 placeholder="Enter a naming pattern (e.g., S-\${now:date}-\${dailySampleCount})"
@@ -1091,17 +1131,20 @@ exports[`SampleTypePropertiesPanel include dataclass and use custom labels 1`] =
               <div
                 class="col-xs-2"
               >
-                <span
-                  class="domain-no-wrap"
-                >
-                  Name
-                   *
+                <span>
+                  <span
+                    class="domain-no-wrap"
+                  >
+                    Name
+                     *
+                  </span>
                 </span>
               </div>
               <div
                 class="col-xs-10"
               >
                 <input
+                  aria-label="Name"
                   class="form-control"
                   id="entity-name"
                   placeholder="Enter a name for this sample type"
@@ -1124,27 +1167,30 @@ exports[`SampleTypePropertiesPanel include dataclass and use custom labels 1`] =
               <div
                 class="col-xs-2"
               >
-                <span
-                  class="domain-no-wrap"
-                >
-                  Description
-                  <div
-                    class="overlay-trigger"
+                <span>
+                  <span
+                    class="domain-no-wrap"
                   >
-                    <span
-                      class="label-help-target"
+                    Description
+                    <div
+                      class="overlay-trigger"
                     >
                       <span
-                        class="label-help-icon fa fa-question-circle"
-                      />
-                    </span>
-                  </div>
+                        class="label-help-target"
+                      >
+                        <span
+                          class="label-help-icon fa fa-question-circle"
+                        />
+                      </span>
+                    </div>
+                  </span>
                 </span>
               </div>
               <div
                 class="col-xs-10"
               >
                 <textarea
+                  aria-label="Description"
                   class="form-control"
                   id="entity-description"
                 />
@@ -1159,22 +1205,24 @@ exports[`SampleTypePropertiesPanel include dataclass and use custom labels 1`] =
                 <div
                   class="name-expression-label-div"
                 >
-                  Naming 
-                  <span
-                    class="domain-no-wrap"
-                  >
-                    Pattern
-                    <div
-                      class="overlay-trigger"
+                  <span>
+                    Naming 
+                    <span
+                      class="domain-no-wrap"
                     >
-                      <span
-                        class="label-help-target"
+                      Pattern
+                      <div
+                        class="overlay-trigger"
                       >
                         <span
-                          class="label-help-icon fa fa-question-circle"
-                        />
-                      </span>
-                    </div>
+                          class="label-help-target"
+                        >
+                          <span
+                            class="label-help-icon fa fa-question-circle"
+                          />
+                        </span>
+                      </div>
+                    </span>
                   </span>
                 </div>
               </div>
@@ -1182,6 +1230,7 @@ exports[`SampleTypePropertiesPanel include dataclass and use custom labels 1`] =
                 class="col-xs-10"
               >
                 <input
+                  aria-label="Naming Pattern"
                   class="form-control naming-pattern-border-warning"
                   id="entity-nameExpression"
                   placeholder="Enter a naming pattern (e.g., S-\${now:date}-\${dailySampleCount})"
@@ -1324,17 +1373,20 @@ exports[`SampleTypePropertiesPanel include dataclass and use custom labels 1`] =
             <div
               class="col-xs-2"
             >
-              <span
-                class="domain-no-wrap"
-              >
-                Name
-                 *
+              <span>
+                <span
+                  class="domain-no-wrap"
+                >
+                  Name
+                   *
+                </span>
               </span>
             </div>
             <div
               class="col-xs-10"
             >
               <input
+                aria-label="Name"
                 class="form-control"
                 id="entity-name"
                 placeholder="Enter a name for this sample type"
@@ -1357,27 +1409,30 @@ exports[`SampleTypePropertiesPanel include dataclass and use custom labels 1`] =
             <div
               class="col-xs-2"
             >
-              <span
-                class="domain-no-wrap"
-              >
-                Description
-                <div
-                  class="overlay-trigger"
+              <span>
+                <span
+                  class="domain-no-wrap"
                 >
-                  <span
-                    class="label-help-target"
+                  Description
+                  <div
+                    class="overlay-trigger"
                   >
                     <span
-                      class="label-help-icon fa fa-question-circle"
-                    />
-                  </span>
-                </div>
+                      class="label-help-target"
+                    >
+                      <span
+                        class="label-help-icon fa fa-question-circle"
+                      />
+                    </span>
+                  </div>
+                </span>
               </span>
             </div>
             <div
               class="col-xs-10"
             >
               <textarea
+                aria-label="Description"
                 class="form-control"
                 id="entity-description"
               />
@@ -1392,22 +1447,24 @@ exports[`SampleTypePropertiesPanel include dataclass and use custom labels 1`] =
               <div
                 class="name-expression-label-div"
               >
-                Naming 
-                <span
-                  class="domain-no-wrap"
-                >
-                  Pattern
-                  <div
-                    class="overlay-trigger"
+                <span>
+                  Naming 
+                  <span
+                    class="domain-no-wrap"
                   >
-                    <span
-                      class="label-help-target"
+                    Pattern
+                    <div
+                      class="overlay-trigger"
                     >
                       <span
-                        class="label-help-icon fa fa-question-circle"
-                      />
-                    </span>
-                  </div>
+                        class="label-help-target"
+                      >
+                        <span
+                          class="label-help-icon fa fa-question-circle"
+                        />
+                      </span>
+                    </div>
+                  </span>
                 </span>
               </div>
             </div>
@@ -1415,6 +1472,7 @@ exports[`SampleTypePropertiesPanel include dataclass and use custom labels 1`] =
               class="col-xs-10"
             >
               <input
+                aria-label="Naming Pattern"
                 class="form-control naming-pattern-border-warning"
                 id="entity-nameExpression"
                 placeholder="Enter a naming pattern (e.g., S-\${now:date}-\${dailySampleCount})"
diff --git a/packages/components/src/internal/components/domainproperties/validation/__snapshots__/Filters.test.tsx.snap b/packages/components/src/internal/components/domainproperties/validation/__snapshots__/Filters.test.tsx.snap
index a3a6e6214c..ef79c2ab17 100644
--- a/packages/components/src/internal/components/domainproperties/validation/__snapshots__/Filters.test.tsx.snap
+++ b/packages/components/src/internal/components/domainproperties/validation/__snapshots__/Filters.test.tsx.snap
@@ -19,6 +19,7 @@ exports[`Filters Date Range 1`] = `
     >
       <div>
         <select
+          aria-labelledby="domain-filter-type-label-1"
           class="form-control"
           id="domainpropertiesrow-firstFilterType-1-1"
           name="domainpropertiesrow-firstFilterType"
@@ -73,6 +74,7 @@ exports[`Filters Date Range 1`] = `
     >
       <div>
         <input
+          aria-labelledby="domain-filter-value-label-1"
           class="form-control"
           id="domainpropertiesrow-firstFilterValue-1-1"
           name="domainpropertiesrow-firstFilterValue"
@@ -100,6 +102,7 @@ exports[`Filters Date Range 1`] = `
     >
       <div>
         <select
+          aria-labelledby="domain-filter-type-label-2"
           class="form-control"
           id="domainpropertiesrow-secondFilterType-1-1"
           name="domainpropertiesrow-secondFilterType"
@@ -158,6 +161,7 @@ exports[`Filters Date Range 1`] = `
     >
       <div>
         <input
+          aria-labelledby="domain-filter-value-label-2"
           class="form-control"
           disabled=""
           id="domainpropertiesrow-secondFilterValue-1-1"
@@ -190,6 +194,7 @@ exports[`Filters Empty Filters - string type 1`] = `
     >
       <div>
         <select
+          aria-labelledby="domain-filter-type-label-1"
           class="form-control"
           id="domainpropertiesrow-firstFilterType-1-3"
           name="domainpropertiesrow-firstFilterType"
@@ -311,6 +316,7 @@ exports[`Filters Empty Filters - string type 1`] = `
     >
       <div>
         <input
+          aria-labelledby="domain-filter-value-label-1"
           class="form-control"
           id="domainpropertiesrow-firstFilterValue-1-3"
           name="domainpropertiesrow-firstFilterValue"
@@ -338,6 +344,7 @@ exports[`Filters Empty Filters - string type 1`] = `
     >
       <div>
         <select
+          aria-labelledby="domain-filter-type-label-2"
           class="form-control"
           id="domainpropertiesrow-secondFilterType-1-3"
           name="domainpropertiesrow-secondFilterType"
@@ -463,6 +470,7 @@ exports[`Filters Empty Filters - string type 1`] = `
     >
       <div>
         <input
+          aria-labelledby="domain-filter-value-label-2"
           class="form-control"
           disabled=""
           id="domainpropertiesrow-secondFilterValue-1-3"

From 335258d3e82ad4a0fab4dc7ca45ab38ae62d61e6 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Sun, 26 Apr 2026 19:50:36 -0700
Subject: [PATCH 04/30] @labkey/components v7.33.1-inputLabels.0

---
 packages/components/package-lock.json                      | 4 ++--
 packages/components/package.json                           | 2 +-
 .../internal/components/forms/input/AmountUnitInput.tsx    | 7 ++++++-
 3 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/packages/components/package-lock.json b/packages/components/package-lock.json
index c3f0e9528d..144a90cd31 100644
--- a/packages/components/package-lock.json
+++ b/packages/components/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@labkey/components",
-  "version": "7.33.1-develop.1",
+  "version": "7.33.1-inputLabels.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@labkey/components",
-      "version": "7.33.1-develop.1",
+      "version": "7.33.1-inputLabels.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 d1b4eaad8e..762d441e61 100644
--- a/packages/components/package.json
+++ b/packages/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@labkey/components",
-  "version": "7.33.1-develop.1",
+  "version": "7.33.1-inputLabels.0",
   "description": "Components, models, actions, and utility functions for LabKey applications and pages",
   "sideEffects": false,
   "files": [
diff --git a/packages/components/src/internal/components/forms/input/AmountUnitInput.tsx b/packages/components/src/internal/components/forms/input/AmountUnitInput.tsx
index 597397cc31..cbe01cee1c 100644
--- a/packages/components/src/internal/components/forms/input/AmountUnitInput.tsx
+++ b/packages/components/src/internal/components/forms/input/AmountUnitInput.tsx
@@ -58,7 +58,6 @@ export const AmountUnitInput: FC<InputRendererProps> = memo(props => {
         return null;
     }
 
-    // TODO this still results in an empty form label
     return (
         <>
             <div className="form-group row">
@@ -66,6 +65,11 @@ export const AmountUnitInput: FC<InputRendererProps> = memo(props => {
                     fieldName={amountCol.name}
                     id={id}
                     isDisabled={disabled}
+                    label={
+                        <div className="bold-text control-label col-sm-2 col-xs-11 text-left text__truncate-and-wrap">
+                            Amount and Units Y
+                        </div>
+                    }
                     labelOverlayProps={{
                         description: 'The amount and units of this sample currently on hand.',
                         label: 'Amount and Units',
@@ -76,6 +80,7 @@ export const AmountUnitInput: FC<InputRendererProps> = memo(props => {
                     toggleProps={{
                         onClick: onToggleChange,
                     }}
+                    withLabelOverlay={false}
                 />
                 <TextInput
                     aria-label="Amount"

From 801f8d0405f5f6a8d2f4a4051f24c5f9af0d7e14 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Sun, 26 Apr 2026 19:57:03 -0700
Subject: [PATCH 05/30] Remove Y

---
 .../src/internal/components/forms/input/AmountUnitInput.tsx     | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/internal/components/forms/input/AmountUnitInput.tsx b/packages/components/src/internal/components/forms/input/AmountUnitInput.tsx
index cbe01cee1c..91a5db1448 100644
--- a/packages/components/src/internal/components/forms/input/AmountUnitInput.tsx
+++ b/packages/components/src/internal/components/forms/input/AmountUnitInput.tsx
@@ -67,7 +67,7 @@ export const AmountUnitInput: FC<InputRendererProps> = memo(props => {
                     isDisabled={disabled}
                     label={
                         <div className="bold-text control-label col-sm-2 col-xs-11 text-left text__truncate-and-wrap">
-                            Amount and Units Y
+                            Amount and Units
                         </div>
                     }
                     labelOverlayProps={{

From c8967a3122096a9e8d7ffdaa377c74bbae257218 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Sun, 26 Apr 2026 20:02:40 -0700
Subject: [PATCH 06/30] @labkey/components v7.33.1-inputLabels.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 144a90cd31..6914f6ab04 100644
--- a/packages/components/package-lock.json
+++ b/packages/components/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@labkey/components",
-  "version": "7.33.1-inputLabels.0",
+  "version": "7.33.1-inputLabels.1",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@labkey/components",
-      "version": "7.33.1-inputLabels.0",
+      "version": "7.33.1-inputLabels.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 762d441e61..7820f93e2b 100644
--- a/packages/components/package.json
+++ b/packages/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@labkey/components",
-  "version": "7.33.1-inputLabels.0",
+  "version": "7.33.1-inputLabels.1",
   "description": "Components, models, actions, and utility functions for LabKey applications and pages",
   "sideEffects": false,
   "files": [

From 64a844f4b87874792b0737233eeb66a8d82b4256 Mon Sep 17 00:00:00 2001
From: cnathe <cnathe@labkey.com>
Date: Mon, 27 Apr 2026 16:30:02 -0500
Subject: [PATCH 07/30] AmountUnitInput label to use different col-X values
 based on if "enable/disable toggle" present

---
 .../components/src/internal/components/forms/FieldLabel.tsx  | 3 ++-
 .../components/src/internal/components/forms/constants.ts    | 1 +
 .../src/internal/components/forms/input/AmountUnitInput.tsx  | 5 ++++-
 3 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/packages/components/src/internal/components/forms/FieldLabel.tsx b/packages/components/src/internal/components/forms/FieldLabel.tsx
index ebb2e47e6b..32065033dc 100644
--- a/packages/components/src/internal/components/forms/FieldLabel.tsx
+++ b/packages/components/src/internal/components/forms/FieldLabel.tsx
@@ -12,6 +12,7 @@ import { ToggleIcon } from '../buttons/ToggleButtons';
 
 import { getFieldEnabledFieldName } from './utils';
 import { LabelOverlay, LabelOverlayProps } from './LabelOverlay';
+import { INPUT_LABEL_CLASS_NAME_WITH_TOGGLE } from './constants';
 
 interface ToggleProps {
     onClick: () => void;
@@ -71,7 +72,7 @@ export class FieldLabel extends Component<FieldLabelProps> {
         let toggleContainerClassName,
             toggleWrapperClassName = 'control-label-toggle-input';
         if (showToggle && labelOverlayProps && !labelOverlayProps.isFormsy && !labelOverlayProps.labelClass) {
-            labelOverlayProps.labelClass = 'control-label col-sm-2 col-xs-11 text-left';
+            labelOverlayProps.labelClass = INPUT_LABEL_CLASS_NAME_WITH_TOGGLE;
             toggleContainerClassName = 'col-xs-1';
             toggleWrapperClassName += ' control-label-toggle-input-size-fixed';
         }
diff --git a/packages/components/src/internal/components/forms/constants.ts b/packages/components/src/internal/components/forms/constants.ts
index 1152106511..50d5bef66a 100644
--- a/packages/components/src/internal/components/forms/constants.ts
+++ b/packages/components/src/internal/components/forms/constants.ts
@@ -15,6 +15,7 @@
  */
 export const DETAIL_TABLE_CLASSES = 'table table-responsive table-condensed detail-component--table__fixed';
 export const INPUT_CONTAINER_CLASS_NAME = 'form-group row';
+export const INPUT_LABEL_CLASS_NAME_WITH_TOGGLE = 'control-label col-sm-2 col-xs-11 text-left';
 export const INPUT_LABEL_CLASS_NAME = 'control-label col-sm-3 col-xs-12 text-left';
 export const INPUT_WRAPPER_CLASS_NAME = 'col-sm-9 col-xs-12';
 
diff --git a/packages/components/src/internal/components/forms/input/AmountUnitInput.tsx b/packages/components/src/internal/components/forms/input/AmountUnitInput.tsx
index 91a5db1448..d7330080ae 100644
--- a/packages/components/src/internal/components/forms/input/AmountUnitInput.tsx
+++ b/packages/components/src/internal/components/forms/input/AmountUnitInput.tsx
@@ -12,6 +12,7 @@ import { Operation } from '../../../../public/QueryColumn';
 import { STORED_AMOUNT_FIELDS } from '../../samples/constants';
 import { Alert } from '../../base/Alert';
 import { LOOKUP_DEFAULT_SIZE } from '../../../constants';
+import { INPUT_LABEL_CLASS_NAME, INPUT_LABEL_CLASS_NAME_WITH_TOGGLE } from '../constants';
 
 export const AmountUnitInput: FC<InputRendererProps> = memo(props => {
     const {
@@ -58,6 +59,8 @@ export const AmountUnitInput: FC<InputRendererProps> = memo(props => {
         return null;
     }
 
+    const inputLabelClass = allowFieldDisable ? INPUT_LABEL_CLASS_NAME_WITH_TOGGLE : INPUT_LABEL_CLASS_NAME;
+
     return (
         <>
             <div className="form-group row">
@@ -66,7 +69,7 @@ export const AmountUnitInput: FC<InputRendererProps> = memo(props => {
                     id={id}
                     isDisabled={disabled}
                     label={
-                        <div className="bold-text control-label col-sm-2 col-xs-11 text-left text__truncate-and-wrap">
+                        <div className={inputLabelClass + ' bold-text text__truncate-and-wrap'}>
                             Amount and Units
                         </div>
                     }

From 392bf357bc9e2df4572cbdb22dd37d47dd5e3b6b Mon Sep 17 00:00:00 2001
From: cnathe <cnathe@labkey.com>
Date: Mon, 27 Apr 2026 16:33:52 -0500
Subject: [PATCH 08/30] jest updates to match

---
 .../forms/input/AmountUnitInput.test.tsx      | 28 +++++++++++--------
 1 file changed, 16 insertions(+), 12 deletions(-)

diff --git a/packages/components/src/internal/components/forms/input/AmountUnitInput.test.tsx b/packages/components/src/internal/components/forms/input/AmountUnitInput.test.tsx
index f955b1abda..16f64c6af2 100644
--- a/packages/components/src/internal/components/forms/input/AmountUnitInput.test.tsx
+++ b/packages/components/src/internal/components/forms/input/AmountUnitInput.test.tsx
@@ -75,9 +75,10 @@ describe('AmountUnitInput', () => {
             </Formsy>
         );
         expect(document.querySelectorAll('.form-group.row')).toHaveLength(1);
-        expect(document.querySelectorAll('label')).toHaveLength(2);
-        expect(document.querySelectorAll('label')[0].textContent).toBe('Amount and Units ');
-        expect(document.querySelectorAll('label')[1].textContent).toBe('');
+        expect(document.querySelectorAll('.control-label')).toHaveLength(1);
+        expect(document.querySelectorAll('.control-label')[0].textContent).toBe('Amount and Units');
+        expect(document.querySelectorAll('label')).toHaveLength(1);
+        expect(document.querySelectorAll('label')[0].textContent).toBe('');
         expect(document.querySelectorAll('.fa-toggle-on')).toHaveLength(1);
         expect(document.querySelectorAll('.fa-toggle-off')).toHaveLength(0);
         const inputs = document.querySelectorAll('input');
@@ -102,9 +103,10 @@ describe('AmountUnitInput', () => {
             </Formsy>
         );
         expect(document.querySelectorAll('.form-group.row')).toHaveLength(1);
-        expect(document.querySelectorAll('label')).toHaveLength(2);
-        expect(document.querySelectorAll('label')[0].textContent).toBe('Amount and Units ');
-        expect(document.querySelectorAll('label')[1].textContent).toBe('');
+        expect(document.querySelectorAll('.control-label')).toHaveLength(1);
+        expect(document.querySelectorAll('.control-label')[0].textContent).toBe('Amount and Units');
+        expect(document.querySelectorAll('label')).toHaveLength(1);
+        expect(document.querySelectorAll('label')[0].textContent).toBe('');
         expect(document.querySelectorAll('.fa-toggle-on')).toHaveLength(0);
         expect(document.querySelectorAll('.fa-toggle-off')).toHaveLength(1);
         const inputs = document.querySelectorAll('input');
@@ -129,9 +131,10 @@ describe('AmountUnitInput', () => {
             </Formsy>
         );
         expect(document.querySelectorAll('.form-group.row')).toHaveLength(1);
-        expect(document.querySelectorAll('label')).toHaveLength(2);
-        expect(document.querySelectorAll('label')[0].textContent).toBe('Amount and Units ');
-        expect(document.querySelectorAll('label')[1].textContent).toBe('');
+        expect(document.querySelectorAll('.control-label')).toHaveLength(1);
+        expect(document.querySelectorAll('.control-label')[0].textContent).toBe('Amount and Units');
+        expect(document.querySelectorAll('label')).toHaveLength(1);
+        expect(document.querySelectorAll('label')[0].textContent).toBe('');
         expect(document.querySelectorAll('.fa-toggle-on')).toHaveLength(0);
         expect(document.querySelectorAll('.fa-toggle-off')).toHaveLength(1);
         const inputs = document.querySelectorAll('input');
@@ -156,9 +159,10 @@ describe('AmountUnitInput', () => {
             </Formsy>
         );
         expect(document.querySelectorAll('.form-group.row')).toHaveLength(1);
-        expect(document.querySelectorAll('label')).toHaveLength(2);
-        expect(document.querySelectorAll('label')[0].textContent).toBe('Amount and Units ');
-        expect(document.querySelectorAll('label')[1].textContent).toBe('');
+        expect(document.querySelectorAll('.control-label')).toHaveLength(1);
+        expect(document.querySelectorAll('.control-label')[0].textContent).toBe('Amount and Units');
+        expect(document.querySelectorAll('label')).toHaveLength(1);
+        expect(document.querySelectorAll('label')[0].textContent).toBe('');
         expect(document.querySelectorAll('.fa-toggle-on')).toHaveLength(0);
         expect(document.querySelectorAll('.fa-toggle-off')).toHaveLength(0);
         const inputs = document.querySelectorAll('input');

From 4a9437aeb2667747da0c8f136f8c227a03e4e746 Mon Sep 17 00:00:00 2001
From: cnathe <cnathe@labkey.com>
Date: Mon, 27 Apr 2026 16:34:47 -0500
Subject: [PATCH 09/30] 7.33.1-inputLabels.2

---
 packages/components/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/package.json b/packages/components/package.json
index 7820f93e2b..82a8d0bce5 100644
--- a/packages/components/package.json
+++ b/packages/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@labkey/components",
-  "version": "7.33.1-inputLabels.1",
+  "version": "7.33.1-inputLabels.2",
   "description": "Components, models, actions, and utility functions for LabKey applications and pages",
   "sideEffects": false,
   "files": [

From 4b69abc5fbef5da94059c83f22f0ed92e3c55f1e Mon Sep 17 00:00:00 2001
From: cnathe <cnathe@labkey.com>
Date: Mon, 27 Apr 2026 16:35:21 -0500
Subject: [PATCH 10/30] 7.33.1-inputLabels.2

---
 packages/components/package-lock.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/components/package-lock.json b/packages/components/package-lock.json
index 6914f6ab04..0b54708fac 100644
--- a/packages/components/package-lock.json
+++ b/packages/components/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@labkey/components",
-  "version": "7.33.1-inputLabels.1",
+  "version": "7.33.1-inputLabels.2",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@labkey/components",
-      "version": "7.33.1-inputLabels.1",
+      "version": "7.33.1-inputLabels.2",
       "license": "SEE LICENSE IN LICENSE.txt",
       "dependencies": {
         "@hello-pangea/dnd": "18.0.1",

From 8b847cf2df58d6d3aff60cb4a504e74f9f294b98 Mon Sep 17 00:00:00 2001
From: cnathe <cnathe@labkey.com>
Date: Tue, 28 Apr 2026 11:34:25 -0500
Subject: [PATCH 11/30] 7.33.1-inputLabels.3

---
 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 c4303ae1fe..3b4e35f1cf 100644
--- a/packages/components/package-lock.json
+++ b/packages/components/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@labkey/components",
-  "version": "7.33.1",
+  "version": "7.33.1-inputLabels.3",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@labkey/components",
-      "version": "7.33.1",
+      "version": "7.33.1-inputLabels.3",
       "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 31ab1a98cf..e1894c823a 100644
--- a/packages/components/package.json
+++ b/packages/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@labkey/components",
-  "version": "7.33.1",
+  "version": "7.33.1-inputLabels.3",
   "description": "Components, models, actions, and utility functions for LabKey applications and pages",
   "sideEffects": false,
   "files": [

From 71f7c54db96a4b9e169a812800e82c4223195a36 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Wed, 29 Apr 2026 09:30:19 -0700
Subject: [PATCH 12/30] Make ids and labels less generic for elements that can
 be repeated on the page

---
 .../components/chart/ChartColorInputs.tsx     |  2 +-
 .../domainproperties/BooleanFieldOptions.tsx  |  4 ++--
 .../CalculatedFieldOptions.tsx                |  4 ++--
 .../domainproperties/DateTimeFieldOptions.tsx |  4 ++--
 .../domainproperties/Lookup/Fields.tsx        |  1 -
 .../domainproperties/LookupFieldOptions.tsx   |  4 ++--
 .../NameAndLinkingOptions.tsx                 | 24 +++++++++++--------
 .../domainproperties/NumericFieldOptions.tsx  | 14 +++++++----
 .../domainproperties/ScannableOption.tsx      |  4 ++--
 .../domainproperties/TextFieldOptions.tsx     |  8 +++----
 .../components/src/internal/util/utils.ts     |  2 +-
 11 files changed, 40 insertions(+), 31 deletions(-)

diff --git a/packages/components/src/internal/components/chart/ChartColorInputs.tsx b/packages/components/src/internal/components/chart/ChartColorInputs.tsx
index 44839a88ae..4f389442a9 100644
--- a/packages/components/src/internal/components/chart/ChartColorInputs.tsx
+++ b/packages/components/src/internal/components/chart/ChartColorInputs.tsx
@@ -425,7 +425,7 @@ const SeriesLineStyleInput: FC<SeriesLineStyleInputProps> = memo(({ chartConfig,
                         inputClass="col-xs-12"
                         inputId="line-color-and-style"
                         menuPlacement="top"
-                        name="lineColorAndStyle"
+                        name={'lineColorAndStyle-' + (chartConfig.measures.series?.name ?? 'unknown')}
                         onChange={onSeriesSelectChange}
                         optionRenderer={seriesValueRenderer}
                         options={distinctSeriesOptions}
diff --git a/packages/components/src/internal/components/domainproperties/BooleanFieldOptions.tsx b/packages/components/src/internal/components/domainproperties/BooleanFieldOptions.tsx
index 1f31b69cdf..1ee8573127 100644
--- a/packages/components/src/internal/components/domainproperties/BooleanFieldOptions.tsx
+++ b/packages/components/src/internal/components/domainproperties/BooleanFieldOptions.tsx
@@ -43,7 +43,7 @@ export class BooleanFieldOptions extends PureComponent<BooleanFieldProps> {
                     <div className="col-xs-12">
                         <div className="domain-field-label">
                             <DomainFieldLabel
-                                id="boolean-format-label"
+                                id={'boolean-format-label-' + domainIndex + '-' + index}
                                 label="Format for Boolean Values"
                                 helpTipBody={this.getFormatHelpText()}
                             />
@@ -53,7 +53,7 @@ export class BooleanFieldOptions extends PureComponent<BooleanFieldProps> {
                 <div className="row">
                     <div className="col-xs-3">
                         <input
-                            aria-labelledby="boolean-format-label"
+                            aria-labelledby={'boolean-format-label-' + domainIndex + '-' + index}
                             className="form-control"
                             type="text"
                             value={format || ''}
diff --git a/packages/components/src/internal/components/domainproperties/CalculatedFieldOptions.tsx b/packages/components/src/internal/components/domainproperties/CalculatedFieldOptions.tsx
index 991a21a54c..7c6fa8d4bb 100644
--- a/packages/components/src/internal/components/domainproperties/CalculatedFieldOptions.tsx
+++ b/packages/components/src/internal/components/domainproperties/CalculatedFieldOptions.tsx
@@ -166,11 +166,11 @@ export const CalculatedFieldOptions: FC<Props> = memo(props => {
                     <SectionHeading
                         cls="bottom-padding"
                         helpTipBody={HELP_TIP_BODY}
-                        id="expression-label"
+                        id={'expression-label-' + domainIndex + '-' + index}
                         title="Expression"
                     />
                     <textarea
-                        aria-labelledby="expression-label"
+                        aria-labelledby={'expression-label-' + domainIndex + '-' + index}
                         className="form-control"
                         disabled={
                             isFieldPartiallyLocked(field.lockType) ||
diff --git a/packages/components/src/internal/components/domainproperties/DateTimeFieldOptions.tsx b/packages/components/src/internal/components/domainproperties/DateTimeFieldOptions.tsx
index 7a5111092e..4acc53753f 100644
--- a/packages/components/src/internal/components/domainproperties/DateTimeFieldOptions.tsx
+++ b/packages/components/src/internal/components/domainproperties/DateTimeFieldOptions.tsx
@@ -194,10 +194,10 @@ export const DateTimeFieldOptions: FC<DateTimeFieldProps> = memo(props => {
                 </div>
             </div>
             <div className="row">
-                <div className="col-xs-3" id="use-default-label">Use Default</div>
+                <div className="col-xs-3" id={'use-default-label-' + domainIndex + '-' + index}>Use Default</div>
                 <div className="col-xs-9">
                     <input
-                        aria-labelledby="use-default-label"
+                        aria-labelledby={'use-default-label-' + domainIndex + '-' + index}
                         checked={setting.inherited}
                         onChange={onToggleInherited}
                         disabled={isFieldFullyLocked(lockType)}
diff --git a/packages/components/src/internal/components/domainproperties/Lookup/Fields.tsx b/packages/components/src/internal/components/domainproperties/Lookup/Fields.tsx
index 2f0c6a96e0..7d1ce4e1f7 100644
--- a/packages/components/src/internal/components/domainproperties/Lookup/Fields.tsx
+++ b/packages/components/src/internal/components/domainproperties/Lookup/Fields.tsx
@@ -327,7 +327,6 @@ export class SchemaSelect extends React.PureComponent<ISchemaSelectProps, any> {
 export type SchemaSelectProps = ISchemaSelectProps & ILookupProps;
 
 export interface ISchemaSelectImplState {
-    ariaLabelledBy?: string;
     containerPath?: string;
     loading?: boolean;
     prevPath?: string;
diff --git a/packages/components/src/internal/components/domainproperties/LookupFieldOptions.tsx b/packages/components/src/internal/components/domainproperties/LookupFieldOptions.tsx
index cdbdf96ddf..4c107cd355 100644
--- a/packages/components/src/internal/components/domainproperties/LookupFieldOptions.tsx
+++ b/packages/components/src/internal/components/domainproperties/LookupFieldOptions.tsx
@@ -90,11 +90,11 @@ export class LookupFieldOptions extends React.PureComponent<LookupFieldProps, an
                 </div>
                 <div className="row">
                     <div className="col-xs-2">
-                        <div className="domain-field-label" id={'target-folder-' + index}>
+                        <div className="domain-field-label" id={'target-folder-' + domainIndex + '-' + index}>
                             Target Folder
                         </div>
                         <FolderSelect
-                            ariaLabelledBy={'target-folder-' + index}
+                            ariaLabelledBy={'target-folder-' + domainIndex + '-' + index}
                             id={createFormInputId(DOMAIN_FIELD_LOOKUP_CONTAINER, domainIndex, index)}
                             key={createFormInputId(DOMAIN_FIELD_LOOKUP_CONTAINER, domainIndex, index)}
                             disabled={disabled}
diff --git a/packages/components/src/internal/components/domainproperties/NameAndLinkingOptions.tsx b/packages/components/src/internal/components/domainproperties/NameAndLinkingOptions.tsx
index ef27225028..c545595e61 100644
--- a/packages/components/src/internal/components/domainproperties/NameAndLinkingOptions.tsx
+++ b/packages/components/src/internal/components/domainproperties/NameAndLinkingOptions.tsx
@@ -103,9 +103,9 @@ export class NameAndLinkingOptions extends PureComponent<NameAndLinkingProps> {
                 </div>
                 <div className="row">
                     <div className="col-xs-5">
-                        <div className="domain-field-label" id="description-label">Description</div>
+                        <div className="domain-field-label" id={'description-label-' + domainIndex + '-' + index}>Description</div>
                         <textarea
-                            aria-labelledby="description-label"
+                            aria-labelledby={'description-label-' + domainIndex + '-' + index}
                             className="form-control"
                             disabled={isFieldFullyLocked(field.lockType)}
                             id={createFormInputId(DOMAIN_FIELD_DESCRIPTION, domainIndex, index)}
@@ -116,11 +116,11 @@ export class NameAndLinkingOptions extends PureComponent<NameAndLinkingProps> {
                         />
                     </div>
                     <div className="col-xs-3">
-                        <div className="domain-field-label" id="label-label">
+                        <div className="domain-field-label" id={'label-label-' + domainIndex + '-' + index}>
                             Label
                         </div>
                         <input
-                            aria-labelledby="label-label"
+                            aria-labelledby={'label-label-' + domainIndex + '-' + index}
                             className="form-control"
                             disabled={isFieldFullyLocked(field.lockType)}
                             id={createFormInputId(DOMAIN_FIELD_LABEL, domainIndex, index)}
@@ -136,12 +136,12 @@ export class NameAndLinkingOptions extends PureComponent<NameAndLinkingProps> {
                                     <div className="domain-field-label">
                                         <DomainFieldLabel
                                             helpTipBody={this.getImportAliasHelpText()}
-                                            id="import-aliases-label"
+                                            id={'import-aliases-label-' + domainIndex + '-'+ index}
                                             label="Import Aliases"
                                         />
                                     </div>
                                     <input
-                                        aria-labelledby="import-aliases-label"
+                                        aria-labelledby={'import-aliases-label-' + domainIndex + '-' + index}
                                         className="form-control"
                                         disabled={isFieldFullyLocked(field.lockType)}
                                         id={createFormInputId(DOMAIN_FIELD_IMPORTALIASES, domainIndex, index)}
@@ -170,10 +170,14 @@ export class NameAndLinkingOptions extends PureComponent<NameAndLinkingProps> {
                                     />
                                 )}
                             <div className="domain-field-label">
-                                <DomainFieldLabel helpTipBody={this.getURLHelpText()} id="url-label" label="URL" />
+                                <DomainFieldLabel
+                                    helpTipBody={this.getURLHelpText()}
+                                    id={'url-label-' + domainIndex + '-' + index}
+                                    label="URL"
+                                />
                             </div>
                             <input
-                                aria-labelledby="url-label"
+                                aria-labelledby={'url-label-' + domainIndex + '-' + index}
                                 className="form-control"
                                 disabled={isFieldFullyLocked(field.lockType)}
                                 id={createFormInputId(DOMAIN_FIELD_URL, domainIndex, index)}
@@ -185,7 +189,7 @@ export class NameAndLinkingOptions extends PureComponent<NameAndLinkingProps> {
                             {/*GitHub Issue 503: Field editor URL option to set target window (i.e. _blank)*/}
                             <div className="domain-text-options-col">
                                 <input
-                                    aria-labelledby="new-window-label"
+                                    aria-labelledby={'new-window-label-' + domainIndex + '-' + index}
                                     checked={field.isTargetBlank}
                                     className="form-control domain-text-option-istargetblank"
                                     disabled={isFieldFullyLocked(field.lockType) || isEmptyString(field.URL)}
@@ -194,7 +198,7 @@ export class NameAndLinkingOptions extends PureComponent<NameAndLinkingProps> {
                                     onChange={this.handleURLTargetChange}
                                     type="checkbox"
                                 />
-                                <span id="new-window-label">Open links in a new tab</span>
+                                <span id={'new-window-label-' + domainIndex + '-' + index}>Open links in a new tab</span>
                             </div>
                         </div>
                     )}
diff --git a/packages/components/src/internal/components/domainproperties/NumericFieldOptions.tsx b/packages/components/src/internal/components/domainproperties/NumericFieldOptions.tsx
index f7c1045edf..419a6379c8 100644
--- a/packages/components/src/internal/components/domainproperties/NumericFieldOptions.tsx
+++ b/packages/components/src/internal/components/domainproperties/NumericFieldOptions.tsx
@@ -52,17 +52,23 @@ export class NumericFieldOptions extends React.PureComponent<NumericFieldProps>
                 <div className="row">
                     <div className="col-xs-3">
                         <div className="domain-field-label">
-                            <DomainFieldLabel helpTipBody={this.getFormatHelpText()} id="number-format-label" label="Format for Numbers"/>
+                            <DomainFieldLabel
+                                helpTipBody={this.getFormatHelpText()}
+                                id={'number-format-label-' + domainIndex + '-' + index}
+                                label="Format for Numbers"
+                            />
                         </div>
                     </div>
                     <div className="col-xs-2">
-                        <div className="domain-field-label" id="default-scale-label">Default Scale Type</div>
+                        <div className="domain-field-label" id={'default-scale-label-' + domainIndex + '-' + index}>
+                            Default Scale Type
+                        </div>
                     </div>
                 </div>
                 <div className="row">
                     <div className="col-xs-3">
                         <input
-                            aria-labelledby="number-format-label"
+                            aria-labelledby={'number-format-label-' + domainIndex + '-' + index}
                             className="form-control"
                             type="text"
                             value={format || ''}
@@ -74,7 +80,7 @@ export class NumericFieldOptions extends React.PureComponent<NumericFieldProps>
                     </div>
                     <div className="col-xs-2">
                         <select
-                            aria-labelledby="default-scale-label"
+                            aria-labelledby={'default-scale-label-' + domainIndex + '-' + index}
                             className="form-control"
                             id={createFormInputId(DOMAIN_FIELD_DEFAULT_SCALE, domainIndex, index)}
                             disabled={isFieldFullyLocked(lockType)}
diff --git a/packages/components/src/internal/components/domainproperties/ScannableOption.tsx b/packages/components/src/internal/components/domainproperties/ScannableOption.tsx
index 26dc0375ad..e3560d5149 100644
--- a/packages/components/src/internal/components/domainproperties/ScannableOption.tsx
+++ b/packages/components/src/internal/components/domainproperties/ScannableOption.tsx
@@ -41,7 +41,7 @@ export const ScannableOption: FC<ScannableProps> = memo(props => {
             <div className="row">
                 <div className="col-xs-12 domain-text-options-col">
                     <input
-                        aria-labelledby="barcode-field-label"
+                        aria-labelledby={'barcode-field-label-' + domainIndex + '-' + index}
                         type="checkbox"
                         id={createFormInputId(DOMAIN_FIELD_SCANNABLE_OPTION, domainIndex, index)}
                         name={createFormInputName(DOMAIN_FIELD_SCANNABLE_OPTION)}
@@ -50,7 +50,7 @@ export const ScannableOption: FC<ScannableProps> = memo(props => {
                         disabled={isFieldFullyLocked(lockType)}
                         checked={scannable}
                     />
-                    <span id="barcode-field-label">Search this field when scanning samples</span>
+                    <span id={'barcode-field-label-' + domainIndex + '-' + index}>Search this field when scanning samples</span>
                 </div>
             </div>
         </>
diff --git a/packages/components/src/internal/components/domainproperties/TextFieldOptions.tsx b/packages/components/src/internal/components/domainproperties/TextFieldOptions.tsx
index f2fab9a480..d4c58b8400 100644
--- a/packages/components/src/internal/components/domainproperties/TextFieldOptions.tsx
+++ b/packages/components/src/internal/components/domainproperties/TextFieldOptions.tsx
@@ -105,7 +105,7 @@ export class TextFieldOptions extends React.PureComponent<TextFieldProps, TextFi
                 <div className="row">
                     <div className="col-xs-12 domain-text-options-col">
                         <input
-                            aria-labelledby="unlimited-length-label"
+                            aria-labelledby={'unlimited-length-label-' + domainIndex + '-' + index}
                             type="radio"
                             className="form-control domain-text-options-radio1 domain-field-float-left"
                             value={DOMAIN_FIELD_MAX_LENGTH}
@@ -114,13 +114,13 @@ export class TextFieldOptions extends React.PureComponent<TextFieldProps, TextFi
                             id={createFormInputId(DOMAIN_FIELD_MAX_LENGTH, domainIndex, index)}
                             disabled={isFieldFullyLocked(lockType)}
                         />
-                        <div id="unlimited-length-label">Unlimited</div>
+                        <div id={'unlimited-length-label-' + domainIndex + '-' + index}>Unlimited</div>
                     </div>
                 </div>
                 <div className="row">
                     <div className="col-xs-12">
                         <input
-                            aria-labelledby="custom-length-label"
+                            aria-labelledby={'custom-length-label-' + domainIndex + '-' + index}
                             type="radio"
                             className="form-control domain-text-options-radio2 domain-field-float-left"
                             value={DOMAIN_FIELD_CUSTOM_LENGTH}
@@ -128,7 +128,7 @@ export class TextFieldOptions extends React.PureComponent<TextFieldProps, TextFi
                             onChange={this.handleChange}
                             id={createFormInputId(DOMAIN_FIELD_CUSTOM_LENGTH, domainIndex, index)}
                         />
-                        <span className="domain-text-options-length domain-field-float-left" id="custom-length-label">
+                        <span className="domain-text-options-length domain-field-float-left" id={'custom-length-label-' + domainIndex + '-' + index}>
                             No longer than {textOptionsFormControl} characters
                         </span>
                     </div>
diff --git a/packages/components/src/internal/util/utils.ts b/packages/components/src/internal/util/utils.ts
index 1b69759c86..f1ed2dd239 100644
--- a/packages/components/src/internal/util/utils.ts
+++ b/packages/components/src/internal/util/utils.ts
@@ -155,7 +155,7 @@ export function generateId(prefix?: string): string {
 // Convert an arbitrary string to a value safe for use as an HTML element id.
 // Replaces sequences of non-alphanumeric characters with a single hyphen and
 // strips leading/trailing hyphens.
-export function stringToHtmlId(value: string): string {
+export function stringToHtmlId(value: string): string | undefined {
     if (!value) {
         return value;
     }

From 03593175e19feef9c748f454ce8f6af8a63056e3 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Wed, 29 Apr 2026 09:53:42 -0700
Subject: [PATCH 13/30] @labkey/components v7.33.3-inputLabels.4

---
 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 91cc1236d4..f3502ed755 100644
--- a/packages/components/package-lock.json
+++ b/packages/components/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@labkey/components",
-  "version": "7.33.3-inputLabels.3",
+  "version": "7.33.3-inputLabels.4",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@labkey/components",
-      "version": "7.33.3-inputLabels.3",
+      "version": "7.33.3-inputLabels.4",
       "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 1f5b42de6a..c16090bdd7 100644
--- a/packages/components/package.json
+++ b/packages/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@labkey/components",
-  "version": "7.33.3-inputLabels.3",
+  "version": "7.33.3-inputLabels.4",
   "description": "Components, models, actions, and utility functions for LabKey applications and pages",
   "sideEffects": false,
   "files": [

From 0738f3c31a94160b7cf9fd961c5568285fb98410 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Wed, 29 Apr 2026 10:52:10 -0700
Subject: [PATCH 14/30] Use more specific id

---
 .../components/labelPrinting/BarTenderSettingsForm.tsx      | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/packages/components/src/internal/components/labelPrinting/BarTenderSettingsForm.tsx b/packages/components/src/internal/components/labelPrinting/BarTenderSettingsForm.tsx
index 64d81dd502..c6d7dd480a 100644
--- a/packages/components/src/internal/components/labelPrinting/BarTenderSettingsForm.tsx
+++ b/packages/components/src/internal/components/labelPrinting/BarTenderSettingsForm.tsx
@@ -22,6 +22,7 @@ import { BarTenderConfiguration } from './models';
 import { BAR_TENDER_TOPIC, BARTENDER_CONFIGURATION_TITLE } from './constants';
 import { LabelsConfigurationPanel } from './LabelsConfigurationPanel';
 import { useAppContext } from '../../AppContext';
+import { stringToHtmlId } from '../../util/utils';
 
 const SUCCESSFUL_NOTIFICATION_MESSAGE = 'Successfully connected to BarTender web service.';
 const FAILED_NOTIFICATION_MESSAGE = 'Failed to connect to BarTender web service.';
@@ -45,11 +46,12 @@ const SettingsInput: FC<SettingsInputProps> = memo(({ children, description, lab
         [name, onChange]
     );
 
+    const id = stringToHtmlId('settings-label-' + name);
     return (
         <div className="form-group">
             <div>
                 {children}
-                <div id="settings-label">
+                <div id={id}>
                     {label}{' '}
                     <LabelHelpTip title={label}>
                         <p>{description}</p>
@@ -58,7 +60,7 @@ const SettingsInput: FC<SettingsInputProps> = memo(({ children, description, lab
             </div>
             <div>
                 <input
-                    aria-labelledby="settings-label"
+                    aria-labelledby={id}
                     className="form-control"
                     id={name}
                     name={name}

From a26607d575824813a930b67ff1aeacca6902f3a9 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Wed, 29 Apr 2026 10:52:18 -0700
Subject: [PATCH 15/30] id -> inputId

---
 .../src/internal/components/chart/ChartColorInputs.tsx          | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/internal/components/chart/ChartColorInputs.tsx b/packages/components/src/internal/components/chart/ChartColorInputs.tsx
index 4f389442a9..0f12607de8 100644
--- a/packages/components/src/internal/components/chart/ChartColorInputs.tsx
+++ b/packages/components/src/internal/components/chart/ChartColorInputs.tsx
@@ -477,8 +477,8 @@ const SeriesLineStyleInput: FC<SeriesLineStyleInputProps> = memo(({ chartConfig,
                         <SelectInput
                             clearable={false}
                             containerClass="inline-block"
-                            id="line-type"
                             inputClass=""
+                            inputId="line-type"
                             menuPlacement="top"
                             name="lineType"
                             onChange={onSeriesLineTypeChange}

From d131e0621e9c6eb36d467ee773e4100e7221b732 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Wed, 29 Apr 2026 10:52:34 -0700
Subject: [PATCH 16/30] aria-describedby -> aria-labelledby

---
 .../domainproperties/list/ListPropertiesAdvancedSettings.tsx    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/internal/components/domainproperties/list/ListPropertiesAdvancedSettings.tsx b/packages/components/src/internal/components/domainproperties/list/ListPropertiesAdvancedSettings.tsx
index 67f7a23b7c..ea806ddf03 100644
--- a/packages/components/src/internal/components/domainproperties/list/ListPropertiesAdvancedSettings.tsx
+++ b/packages/components/src/internal/components/domainproperties/list/ListPropertiesAdvancedSettings.tsx
@@ -75,7 +75,7 @@ const TitleIndexField: FC<TitleIndexFieldProps> = memo(({ name, titleTemplate, o
         <DomainFieldLabel id="document-title-label" label="Document title" helpTipBody={DOCUMENT_TITLE_TIP} />
         <span>
             <input
-                aria-describedby="document-title-label"
+                aria-labelledby="document-title-label"
                 className="form-control list__advanced-settings-modal__text-field"
                 id={name}
                 type="text"

From 7b60691cb776cbfb463a7ec18304b435bdd5d471 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Wed, 29 Apr 2026 10:52:49 -0700
Subject: [PATCH 17/30] Add missing domainIndex from id

---
 .../components/domainproperties/LookupFieldOptions.tsx    | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/components/src/internal/components/domainproperties/LookupFieldOptions.tsx b/packages/components/src/internal/components/domainproperties/LookupFieldOptions.tsx
index 4c107cd355..8cc73a39e2 100644
--- a/packages/components/src/internal/components/domainproperties/LookupFieldOptions.tsx
+++ b/packages/components/src/internal/components/domainproperties/LookupFieldOptions.tsx
@@ -103,11 +103,11 @@ export class LookupFieldOptions extends React.PureComponent<LookupFieldProps, an
                         />
                     </div>
                     <div className="col-xs-2">
-                        <div className="domain-field-label" id={'target-schema-label-' + index}>
+                        <div className="domain-field-label" id={'target-schema-label-' + domainIndex + '-' + index}>
                             Target Schema
                         </div>
                         <SchemaSelect
-                            ariaLabelledBy={'target-schema-label-' + index}
+                            ariaLabelledBy={'target-schema-label-' + domainIndex + '-' + index}
                             containerPath={lookupContainer}
                             id={createFormInputId(DOMAIN_FIELD_LOOKUP_SCHEMA, domainIndex, index)}
                             key={createFormInputId(DOMAIN_FIELD_LOOKUP_SCHEMA, domainIndex, index)}
@@ -117,9 +117,9 @@ export class LookupFieldOptions extends React.PureComponent<LookupFieldProps, an
                         />
                     </div>
                     <div className="col-xs-2">
-                        <div className="domain-field-label" id={'target-table-label-' + index}>Target Table</div>
+                        <div className="domain-field-label" id={'target-table-label-' + domainIndex + '-' + index}>Target Table</div>
                         <TargetTableSelect
-                            ariaLabelledBy={'target-table-label-' + index}
+                            ariaLabelledBy={'target-table-label-' + domainIndex + '-' + index}
                             containerPath={lookupContainer}
                             id={createFormInputId(DOMAIN_FIELD_LOOKUP_QUERY, domainIndex, index)}
                             key={createFormInputId(DOMAIN_FIELD_LOOKUP_QUERY, domainIndex, index)}

From 106b0e7ce04b0e0d94912e7679ddd70102755e5a Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Wed, 29 Apr 2026 10:53:04 -0700
Subject: [PATCH 18/30] Add missing domainIndex from id

---
 .../NameAndLinkingOptions.test.tsx.snap       | 20 +++++++++----------
 .../NumericFieldOptions.test.tsx.snap         |  8 ++++----
 .../validation/RangeValidationOptions.tsx     |  4 ++--
 3 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/packages/components/src/internal/components/domainproperties/__snapshots__/NameAndLinkingOptions.test.tsx.snap b/packages/components/src/internal/components/domainproperties/__snapshots__/NameAndLinkingOptions.test.tsx.snap
index d67b4c157e..39079447ff 100644
--- a/packages/components/src/internal/components/domainproperties/__snapshots__/NameAndLinkingOptions.test.tsx.snap
+++ b/packages/components/src/internal/components/domainproperties/__snapshots__/NameAndLinkingOptions.test.tsx.snap
@@ -24,12 +24,12 @@ exports[`NameAndLinkingOptions Name and Linking options 1`] = `
       >
         <div
           class="domain-field-label"
-          id="description-label"
+          id="description-label-1-1"
         >
           Description
         </div>
         <textarea
-          aria-labelledby="description-label"
+          aria-labelledby="description-label-1-1"
           class="form-control"
           id="domainpropertiesrow-description-1-1"
           name="domainpropertiesrow-description"
@@ -43,12 +43,12 @@ exports[`NameAndLinkingOptions Name and Linking options 1`] = `
       >
         <div
           class="domain-field-label"
-          id="label-label"
+          id="label-label-1-1"
         >
           Label
         </div>
         <input
-          aria-labelledby="label-label"
+          aria-labelledby="label-label-1-1"
           class="form-control"
           id="domainpropertiesrow-label-1-1"
           name="domainpropertiesrow-label"
@@ -59,7 +59,7 @@ exports[`NameAndLinkingOptions Name and Linking options 1`] = `
           class="domain-field-label"
         >
           <span
-            id="import-aliases-label"
+            id="import-aliases-label-1-1"
           >
             Import 
             <span
@@ -81,7 +81,7 @@ exports[`NameAndLinkingOptions Name and Linking options 1`] = `
           </span>
         </div>
         <input
-          aria-labelledby="import-aliases-label"
+          aria-labelledby="import-aliases-label-1-1"
           class="form-control"
           id="domainpropertiesrow-importAliases-1-1"
           name="domainpropertiesrow-importAliases"
@@ -96,7 +96,7 @@ exports[`NameAndLinkingOptions Name and Linking options 1`] = `
           class="domain-field-label"
         >
           <span
-            id="url-label"
+            id="url-label-1-1"
           >
             <span
               class="domain-no-wrap"
@@ -117,7 +117,7 @@ exports[`NameAndLinkingOptions Name and Linking options 1`] = `
           </span>
         </div>
         <input
-          aria-labelledby="url-label"
+          aria-labelledby="url-label-1-1"
           class="form-control"
           id="domainpropertiesrow-URL-1-1"
           name="domainpropertiesrow-URL"
@@ -128,7 +128,7 @@ exports[`NameAndLinkingOptions Name and Linking options 1`] = `
           class="domain-text-options-col"
         >
           <input
-            aria-labelledby="new-window-label"
+            aria-labelledby="new-window-label-1-1"
             checked=""
             class="form-control domain-text-option-istargetblank"
             id="domainpropertiesrow-isTargetBlank-1-1"
@@ -136,7 +136,7 @@ exports[`NameAndLinkingOptions Name and Linking options 1`] = `
             type="checkbox"
           />
           <span
-            id="new-window-label"
+            id="new-window-label-1-1"
           >
             Open links in a new tab
           </span>
diff --git a/packages/components/src/internal/components/domainproperties/__snapshots__/NumericFieldOptions.test.tsx.snap b/packages/components/src/internal/components/domainproperties/__snapshots__/NumericFieldOptions.test.tsx.snap
index 073afc8078..ba269ce358 100644
--- a/packages/components/src/internal/components/domainproperties/__snapshots__/NumericFieldOptions.test.tsx.snap
+++ b/packages/components/src/internal/components/domainproperties/__snapshots__/NumericFieldOptions.test.tsx.snap
@@ -26,7 +26,7 @@ exports[`NumericFieldOptions Numeric data type 1`] = `
           class="domain-field-label"
         >
           <span
-            id="number-format-label"
+            id="number-format-label-1-1"
           >
             Format for 
             <span
@@ -53,7 +53,7 @@ exports[`NumericFieldOptions Numeric data type 1`] = `
       >
         <div
           class="domain-field-label"
-          id="default-scale-label"
+          id="default-scale-label-1-1"
         >
           Default Scale Type
         </div>
@@ -66,7 +66,7 @@ exports[`NumericFieldOptions Numeric data type 1`] = `
         class="col-xs-3"
       >
         <input
-          aria-labelledby="number-format-label"
+          aria-labelledby="number-format-label-1-1"
           class="form-control"
           id="domainpropertiesrow-format-1-1"
           name="domainpropertiesrow-format"
@@ -78,7 +78,7 @@ exports[`NumericFieldOptions Numeric data type 1`] = `
         class="col-xs-2"
       >
         <select
-          aria-labelledby="default-scale-label"
+          aria-labelledby="default-scale-label-1-1"
           class="form-control"
           id="domainpropertiesrow-defaultScale-1-1"
           name="domainpropertiesrow-defaultScale"
diff --git a/packages/components/src/internal/components/domainproperties/validation/RangeValidationOptions.tsx b/packages/components/src/internal/components/domainproperties/validation/RangeValidationOptions.tsx
index e40b414d61..27a2c137a6 100644
--- a/packages/components/src/internal/components/domainproperties/validation/RangeValidationOptions.tsx
+++ b/packages/components/src/internal/components/domainproperties/validation/RangeValidationOptions.tsx
@@ -126,12 +126,12 @@ export class RangeValidationOptions extends PureComponent<RangeValidationOptions
                         {this.renderRowTextbox('Error Message', DOMAIN_VALIDATOR_ERRORMESSAGE, validator.errorMessage)}
 
                         <div className="row">
-                            <div className="col-xs-4" id="name-label">
+                            <div className="col-xs-4" id={'name-label-' + domainIndex + '-' + validatorIndex}>
                                 <div>Name *</div>
                             </div>
                             <div className="col-xs-8">
                                 <input
-                                    aria-labelledby="name-label"
+                                    aria-labelledby={'name-label-' + domainIndex + '-' + validatorIndex}
                                     className="form-control"
                                     type="text"
                                     id={createFormInputId(DOMAIN_VALIDATOR_NAME, domainIndex, validatorIndex)}

From e60bd8b64750ec86ec0066ead258009d9d90e7f3 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Wed, 29 Apr 2026 10:53:24 -0700
Subject: [PATCH 19/30] Change stringToHtmlId to not use regex

---
 .../components/src/internal/util/utils.test.ts   |  4 ++--
 packages/components/src/internal/util/utils.ts   | 16 +++++++++-------
 2 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/packages/components/src/internal/util/utils.test.ts b/packages/components/src/internal/util/utils.test.ts
index 188da9f0ba..de9f6cc77b 100644
--- a/packages/components/src/internal/util/utils.test.ts
+++ b/packages/components/src/internal/util/utils.test.ts
@@ -2082,10 +2082,10 @@ describe('isBlankValue', () => {
 
 describe('stringToHtmlId', () => {
     test('empty string', () => {
-        expect(stringToHtmlId('')).toBe('');
+        expect(stringToHtmlId('')).toBeUndefined();
     });
     test('undefined', () => {
-        expect(stringToHtmlId(undefined)).toBe(undefined);
+        expect(stringToHtmlId(undefined)).toBeUndefined();
     });
     test('replaces spaces with hyphens', () => {
         expect(stringToHtmlId('hello world')).toBe('hello-world');
diff --git a/packages/components/src/internal/util/utils.ts b/packages/components/src/internal/util/utils.ts
index f1ed2dd239..1571cb63a8 100644
--- a/packages/components/src/internal/util/utils.ts
+++ b/packages/components/src/internal/util/utils.ts
@@ -153,13 +153,15 @@ export function generateId(prefix?: string): string {
 }
 
 // Convert an arbitrary string to a value safe for use as an HTML element id.
-// Replaces sequences of non-alphanumeric characters with a single hyphen and
-// strips leading/trailing hyphens.
-export function stringToHtmlId(value: string): string | undefined {
-    if (!value) {
-        return value;
-    }
-    return value.replace(/[^a-zA-Z0-9]+/g, '-').replace(/^-+|-+$/g, '');
+// Splits on non-alphanumeric characters, drops empty segments (which handles
+// leading/trailing separators and consecutive separators), then rejoins with hyphens.
+export function stringToHtmlId(value: string | undefined): string | undefined {
+    if (value === undefined) return undefined;
+    const id = value
+        .split(/[^a-zA-Z0-9]/)
+        .filter(s => s.length > 0)
+        .join('-');
+    return id || undefined;
 }
 
 // http://davidwalsh.name/javascript-debounce-function

From 447abc8215ad99676cbe43b586c1c66f3224f66f Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Wed, 29 Apr 2026 10:53:44 -0700
Subject: [PATCH 20/30] Better to have no label when name is not defined

---
 .../src/internal/components/forms/input/SelectInput.tsx   | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/components/src/internal/components/forms/input/SelectInput.tsx b/packages/components/src/internal/components/forms/input/SelectInput.tsx
index fe0cb587f3..bdd582ffb1 100644
--- a/packages/components/src/internal/components/forms/input/SelectInput.tsx
+++ b/packages/components/src/internal/components/forms/input/SelectInput.tsx
@@ -746,15 +746,15 @@ export class SelectInputImpl extends Component<SelectInputImplProps, State> {
             };
 
             if (this.isCreatable()) {
-                return <AsyncCreatableSelect aria-label={'Select ' + name} {...asyncProps} />;
+                return <AsyncCreatableSelect aria-label={name ? 'Select ' + name : undefined} {...asyncProps} />;
             }
 
-            return <AsyncSelect aria-label={'Select ' + name} {...asyncProps} />;
+            return <AsyncSelect aria-label={name ? 'Select ' + name : undefined} {...asyncProps} />;
         } else if (this.isCreatable()) {
-            return <CreatableSelect aria-label={'Select ' + name} {...selectProps} />;
+            return <CreatableSelect aria-label={name ? 'Select ' + name : undefined} {...selectProps} />;
         }
 
-        return <ReactSelect aria-label={'Select ' + name} {...selectProps} />;
+        return <ReactSelect aria-label={name ? 'Select ' + name : undefined} {...selectProps} />;
     };
 
     render() {

From 2a8a40de7019a682c896dfda77f23d1c9658613b Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Wed, 29 Apr 2026 10:54:57 -0700
Subject: [PATCH 21/30] @labkey/components v7.33.3-inputLabels.5

---
 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 f3502ed755..c9be8cc78c 100644
--- a/packages/components/package-lock.json
+++ b/packages/components/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@labkey/components",
-  "version": "7.33.3-inputLabels.4",
+  "version": "7.33.3-inputLabels.5",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@labkey/components",
-      "version": "7.33.3-inputLabels.4",
+      "version": "7.33.3-inputLabels.5",
       "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 c16090bdd7..fbeaf2431d 100644
--- a/packages/components/package.json
+++ b/packages/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@labkey/components",
-  "version": "7.33.3-inputLabels.4",
+  "version": "7.33.3-inputLabels.5",
   "description": "Components, models, actions, and utility functions for LabKey applications and pages",
   "sideEffects": false,
   "files": [

From 379fc6417342756fe845f3bafca4d2550b1949a0 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Wed, 29 Apr 2026 11:23:59 -0700
Subject: [PATCH 22/30] More updates for better ids

---
 .../src/internal/components/DateInput.tsx         |  4 ++--
 .../components/chart/ChartColorInputs.tsx         | 15 ++++++++-------
 .../components/domainproperties/SystemFields.tsx  |  2 +-
 .../components/forms/input/SelectInput.tsx        | 10 +++++-----
 .../components/ontology/OntologyLookupOptions.tsx | 12 ++++++------
 .../samples/DiscardConsumedSamplesPanel.tsx       |  3 +--
 .../components/search/QueryFilterPanel.tsx        | 15 +++++++++++----
 7 files changed, 34 insertions(+), 27 deletions(-)

diff --git a/packages/components/src/internal/components/DateInput.tsx b/packages/components/src/internal/components/DateInput.tsx
index 7bafa0f195..166861c222 100644
--- a/packages/components/src/internal/components/DateInput.tsx
+++ b/packages/components/src/internal/components/DateInput.tsx
@@ -4,7 +4,7 @@ import DatePicker, { DatePickerProps } from 'react-datepicker';
 import { getDateFNSDateFormat, parseDateFNSTimeFormat } from '../util/Date';
 
 import { Container } from './base/models/Container';
-import { stringToHtmlId } from '../util/utils';
+import { generateId } from '../util/utils';
 
 export interface DateInputProps {
     container?: Container;
@@ -34,7 +34,7 @@ export const DateInput: FC<DateInputProps & DatePickerProps> = memo(props => {
         [onSelect]
     );
 
-    const id = stringToHtmlId(pickerProps.name) ?? 'date-input';
+    const id = generateId('date-input-');
 
     return (
         <span className="input-group date-input">
diff --git a/packages/components/src/internal/components/chart/ChartColorInputs.tsx b/packages/components/src/internal/components/chart/ChartColorInputs.tsx
index 0f12607de8..03e54ef03e 100644
--- a/packages/components/src/internal/components/chart/ChartColorInputs.tsx
+++ b/packages/components/src/internal/components/chart/ChartColorInputs.tsx
@@ -415,17 +415,18 @@ const SeriesLineStyleInput: FC<SeriesLineStyleInputProps> = memo(({ chartConfig,
         return null;
     }
 
+    const suffix = chartConfig.measures.series?.name ?? 'unknown';
     return (
         <>
             <div className="form-group row">
                 <div className="col-xs-12">
-                    <label htmlFor="line-color-and-style">Line Color and Style</label>
+                    <label htmlFor={'line-color-and-style-' + suffix}>Line Color and Style</label>
                     <SelectInput
                         containerClass="row"
                         inputClass="col-xs-12"
-                        inputId="line-color-and-style"
+                        inputId={'line-color-and-style-' + suffix}
                         menuPlacement="top"
-                        name={'lineColorAndStyle-' + (chartConfig.measures.series?.name ?? 'unknown')}
+                        name={'lineColorAndStyle-' + suffix}
                         onChange={onSeriesSelectChange}
                         optionRenderer={seriesValueRenderer}
                         options={distinctSeriesOptions}
@@ -450,14 +451,14 @@ const SeriesLineStyleInput: FC<SeriesLineStyleInputProps> = memo(({ chartConfig,
                     </div>
                     {!chartConfig.geomOptions?.hideDataPoints && (
                         <div className="chart-color-input">
-                            <label className="label-weight-normal" htmlFor="shape">
+                            <label className="label-weight-normal" htmlFor={'shape-' + suffix}>
                                 Shape
                             </label>
                             <SelectInput
                                 clearable={false}
                                 containerClass="inline-block"
                                 inputClass=""
-                                inputId="shape"
+                                inputId={'shape-' + suffix}
                                 menuPlacement="top"
                                 name="shape"
                                 onChange={onSeriesShapeChange}
@@ -473,12 +474,12 @@ const SeriesLineStyleInput: FC<SeriesLineStyleInputProps> = memo(({ chartConfig,
                         </div>
                     )}
                     <div className="chart-color-input">
-                        <label className="label-weight-normal" htmlFor="line-type">Line Type</label>
+                        <label className="label-weight-normal" htmlFor={'line-type-' + suffix}>Line Type</label>
                         <SelectInput
                             clearable={false}
                             containerClass="inline-block"
                             inputClass=""
-                            inputId="line-type"
+                            inputId={'line-type-' + suffix}
                             menuPlacement="top"
                             name="lineType"
                             onChange={onSeriesLineTypeChange}
diff --git a/packages/components/src/internal/components/domainproperties/SystemFields.tsx b/packages/components/src/internal/components/domainproperties/SystemFields.tsx
index d8c567ea57..429cf2994e 100644
--- a/packages/components/src/internal/components/domainproperties/SystemFields.tsx
+++ b/packages/components/src/internal/components/domainproperties/SystemFields.tsx
@@ -86,7 +86,7 @@ export const SystemFields: FC<Props> = memo(({ fields, disabledSystemFields, onS
                 return (
                     // eslint-disable-next-line react/jsx-no-bind
                     <input
-                        aria-label="Disableable"
+                        aria-label="Enabled"
                         className="grid-panel__row-checkbox"
                         type="checkbox"
                         disabled={!row.get('Disableable')}
diff --git a/packages/components/src/internal/components/forms/input/SelectInput.tsx b/packages/components/src/internal/components/forms/input/SelectInput.tsx
index bdd582ffb1..6f0434a472 100644
--- a/packages/components/src/internal/components/forms/input/SelectInput.tsx
+++ b/packages/components/src/internal/components/forms/input/SelectInput.tsx
@@ -681,7 +681,7 @@ export class SelectInputImpl extends Component<SelectInputImplProps, State> {
 
         const isDisabled = disabled || this.state.isDisabled || this.props.disableInput;
         const placeholderText = hasMixedValue && isDisabled ? MIXED_VALUE_DISPLAY : placeholder;
-
+        const ariaLabel = inputId ? undefined : name ? 'Select ' + name : undefined;
         const selectProps: any = {
             autoFocus,
             backspaceRemovesValue,
@@ -746,15 +746,15 @@ export class SelectInputImpl extends Component<SelectInputImplProps, State> {
             };
 
             if (this.isCreatable()) {
-                return <AsyncCreatableSelect aria-label={name ? 'Select ' + name : undefined} {...asyncProps} />;
+                return <AsyncCreatableSelect aria-label={ariaLabel} {...asyncProps} />;
             }
 
-            return <AsyncSelect aria-label={name ? 'Select ' + name : undefined} {...asyncProps} />;
+            return <AsyncSelect aria-label={ariaLabel} {...asyncProps} />;
         } else if (this.isCreatable()) {
-            return <CreatableSelect aria-label={name ? 'Select ' + name : undefined} {...selectProps} />;
+            return <CreatableSelect aria-label={ariaLabel} {...selectProps} />;
         }
 
-        return <ReactSelect aria-label={name ? 'Select ' + name : undefined} {...selectProps} />;
+        return <ReactSelect aria-label={ariaLabel} {...selectProps} />;
     };
 
     render() {
diff --git a/packages/components/src/internal/components/ontology/OntologyLookupOptions.tsx b/packages/components/src/internal/components/ontology/OntologyLookupOptions.tsx
index 9201d8cc52..6e54fd15cc 100644
--- a/packages/components/src/internal/components/ontology/OntologyLookupOptions.tsx
+++ b/packages/components/src/internal/components/ontology/OntologyLookupOptions.tsx
@@ -155,7 +155,7 @@ export class OntologyLookupOptions extends PureComponent<Props, State> {
                 </div>
                 <div className="row">
                     <div className="col-xs-5">
-                        <div className="domain-field-label" id="ontology-label">
+                        <div className="domain-field-label" id={'ontology-label-' + domainIndex + '-' + index}>
                             Choose an Ontology
                             <LabelHelpTip title="Choose an Ontology">
                                 <>
@@ -171,7 +171,7 @@ export class OntologyLookupOptions extends PureComponent<Props, State> {
                         </div>
                     </div>
                     <div className="col-xs-3">
-                        <div className="domain-field-label" id="import-field-label">
+                        <div className="domain-field-label" id={'import-field-label-' + domainIndex + '-' + index}>
                             Choose an Import Field
                             <LabelHelpTip title="Choose an Import Field">
                                 <p>
@@ -182,7 +182,7 @@ export class OntologyLookupOptions extends PureComponent<Props, State> {
                         </div>
                     </div>
                     <div className="col-xs-3">
-                        <div className="domain-field-label" id="label-field-label">
+                        <div className="domain-field-label" id={'label-field-label-' + domainIndex + '-' + index}>
                             Choose a Label Field
                             <LabelHelpTip title="Choose a Label Field">
                                 <p>Choose which text field to store the preferred name of the concept.</p>
@@ -194,7 +194,7 @@ export class OntologyLookupOptions extends PureComponent<Props, State> {
                 <div className="row">
                     <div className="col-xs-5">
                         <select
-                            aria-labelledby="ontology-label"
+                            aria-labelledby={'ontology-label-' + domainIndex + '-' + index}
                             className="form-control"
                             id={sourceId}
                             key={sourceId}
@@ -236,7 +236,7 @@ export class OntologyLookupOptions extends PureComponent<Props, State> {
                     </div>
                     <div className="col-xs-3">
                         <OntologyTextDomainFieldSelect
-                            ariaLabelledBy="import-field-label"
+                            ariaLabelledBy={'import-field-label-' + domainIndex + '-' + index}
                             field={field}
                             domainFields={domainFields}
                             lockType={lockType}
@@ -248,7 +248,7 @@ export class OntologyLookupOptions extends PureComponent<Props, State> {
                     </div>
                     <div className="col-xs-3">
                         <OntologyTextDomainFieldSelect
-                            ariaLabelledBy="label-field-label"
+                            ariaLabelledBy={'label-field-label-' + domainIndex + '-' + index}
                             field={field}
                             domainFields={domainFields}
                             lockType={lockType}
diff --git a/packages/components/src/internal/components/samples/DiscardConsumedSamplesPanel.tsx b/packages/components/src/internal/components/samples/DiscardConsumedSamplesPanel.tsx
index 12ff4e994c..ee5b60ce96 100644
--- a/packages/components/src/internal/components/samples/DiscardConsumedSamplesPanel.tsx
+++ b/packages/components/src/internal/components/samples/DiscardConsumedSamplesPanel.tsx
@@ -29,7 +29,6 @@ export const DiscardConsumedSamplesPanel: FC<Props> = memo(props => {
             <div className="form-group">
                 <label className="form-check">
                     <input
-                        aria-labelledby="discard-consumed-label"
                         className="form-check-input"
                         type="checkbox"
                         id={DISCARD_CONSUMED_CHECKBOX_FIELD}
@@ -37,7 +36,7 @@ export const DiscardConsumedSamplesPanel: FC<Props> = memo(props => {
                         onChange={toggleShouldDiscard}
                         checked={shouldDiscard}
                     />
-                    <span className="discard-consumed-title" id="discard-consumed-label"> {discardTitle}</span>
+                    <span className="discard-consumed-title"> {discardTitle}</span>
                 </label>
             </div>
             {onCommentChange && (
diff --git a/packages/components/src/internal/components/search/QueryFilterPanel.tsx b/packages/components/src/internal/components/search/QueryFilterPanel.tsx
index dd47ee3ee2..84531edbb8 100644
--- a/packages/components/src/internal/components/search/QueryFilterPanel.tsx
+++ b/packages/components/src/internal/components/search/QueryFilterPanel.tsx
@@ -24,6 +24,7 @@ import { FilterExpressionView } from './FilterExpressionView';
 import { EntityFieldFilter } from './models';
 import { isChooseValuesFilter } from './utils';
 import { SAMPLE_PROPERTY_ALL_SAMPLE_TYPE } from './constants';
+import { stringToHtmlId } from '../../util/utils';
 
 enum FieldFilterTabs {
     ChooseValues = 'ChooseValues',
@@ -282,14 +283,17 @@ export const QueryFilterPanel: FC<Props> = memo(props => {
                             altQueryName !== SAMPLE_PROPERTY_ALL_SAMPLE_TYPE.query && (
                                 <div className="form-check list-group-item">
                                     <input
-                                        aria-labelledby="all-data-label"
+                                        aria-labelledby={stringToHtmlId('all-data-label-' + queryName)}
                                         checked={hasAllValuesInQuery}
                                         className="form-check-input filter-faceted__checkbox"
                                         name="field-value-allvalues-check"
                                         onChange={event => onAllValuesInQueryChange(event.target.checked)}
                                         type="checkbox"
                                     />
-                                    <div className="filter-modal__fields-col-any-msg" id="all-data-label">
+                                    <div
+                                        className="filter-modal__fields-col-any-msg"
+                                        id={stringToHtmlId('all-data-label-' + queryName)}
+                                    >
                                         {allInQueryFilterLabel ?? 'All data'}
                                     </div>
                                 </div>
@@ -297,14 +301,17 @@ export const QueryFilterPanel: FC<Props> = memo(props => {
                         {entityDataType?.supportHasNoValueInQuery && (
                             <div className="form-check list-group-item">
                                 <input
-                                    aria-labelledby="without-data-label"
+                                    aria-labelledby={'without-data-label-' + queryName}
                                     checked={hasNotInQueryFilter}
                                     className="form-check-input filter-faceted__checkbox"
                                     name="field-value-nodata-check"
                                     onChange={event => onHasNoValueInQueryChange(event.target.checked)}
                                     type="checkbox"
                                 />
-                                <div className="filter-modal__fields-col-nodata-msg" id="without-data-label">
+                                <div
+                                    className="filter-modal__fields-col-nodata-msg"
+                                    id={'without-data-label-' + queryName}
+                                >
                                     {hasNotInQueryFilterLabel ?? 'Without data from this type'}
                                 </div>
                             </div>

From e7e124878341830a260ade6b44f161a39250c4d7 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Wed, 29 Apr 2026 11:32:57 -0700
Subject: [PATCH 23/30] @labkey/components v7.33.3-inputLabels.6

---
 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 c9be8cc78c..2aec5800fd 100644
--- a/packages/components/package-lock.json
+++ b/packages/components/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@labkey/components",
-  "version": "7.33.3-inputLabels.5",
+  "version": "7.33.3-inputLabels.6",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@labkey/components",
-      "version": "7.33.3-inputLabels.5",
+      "version": "7.33.3-inputLabels.6",
       "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 fbeaf2431d..813a526b23 100644
--- a/packages/components/package.json
+++ b/packages/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@labkey/components",
-  "version": "7.33.3-inputLabels.5",
+  "version": "7.33.3-inputLabels.6",
   "description": "Components, models, actions, and utility functions for LabKey applications and pages",
   "sideEffects": false,
   "files": [

From d06867c488031cf71906d8a341bae399380691b5 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Wed, 29 Apr 2026 12:42:58 -0700
Subject: [PATCH 24/30] Use distinct ids

---
 .../domainproperties/assay/AssayPropertiesInput.tsx           | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/components/src/internal/components/domainproperties/assay/AssayPropertiesInput.tsx b/packages/components/src/internal/components/domainproperties/assay/AssayPropertiesInput.tsx
index e33cb0bcc3..95d55ea304 100644
--- a/packages/components/src/internal/components/domainproperties/assay/AssayPropertiesInput.tsx
+++ b/packages/components/src/internal/components/domainproperties/assay/AssayPropertiesInput.tsx
@@ -638,7 +638,7 @@ export class TransformScriptsInput extends React.PureComponent<TransformScriptsI
                                             <input
                                                 aria-label="Run on Import"
                                                 checked={attachment.runOnImport}
-                                                id={FORM_IDS.PROTOCOL_TRANSFORM_SCRIPTS + i}
+                                                id={FORM_IDS.PROTOCOL_TRANSFORM_SCRIPTS + '-onImport' + i}
                                                 onChange={this.onCheckRunOnImport}
                                                 type="checkbox"
                                             />
@@ -650,7 +650,7 @@ export class TransformScriptsInput extends React.PureComponent<TransformScriptsI
                                                 aria-label="Run on Edit"
                                                 checked={attachment.runOnEdit}
                                                 disabled={!model.editableResults}
-                                                id={FORM_IDS.PROTOCOL_TRANSFORM_SCRIPTS + i}
+                                                id={FORM_IDS.PROTOCOL_TRANSFORM_SCRIPTS + '-onEdit' + i}
                                                 onChange={this.onCheckRunOnEdit}
                                                 type="checkbox"
                                             />

From 56c094521e02c17161973ab57f54ad5ef15a6f68 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Wed, 29 Apr 2026 12:43:28 -0700
Subject: [PATCH 25/30] Use stringToHtmlId

---
 .../src/internal/components/chart/ChartColorInputs.tsx      | 3 ++-
 .../src/internal/components/chart/ChartFieldOption.tsx      | 6 ++++--
 2 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/packages/components/src/internal/components/chart/ChartColorInputs.tsx b/packages/components/src/internal/components/chart/ChartColorInputs.tsx
index 03e54ef03e..185b42e22d 100644
--- a/packages/components/src/internal/components/chart/ChartColorInputs.tsx
+++ b/packages/components/src/internal/components/chart/ChartColorInputs.tsx
@@ -10,6 +10,7 @@ import { QueryModel } from '../../../public/QueryModel/QueryModel';
 import { ColorIcon } from '../base/ColorIcon';
 import { LABKEY_VIS } from '../../constants';
 import { RemoveEntityButton } from '../buttons/RemoveEntityButton';
+import { stringToHtmlId } from '../../util/utils';
 
 enum COLOR_OPTIONS {
     BOX_FILL_COLOR = 'boxFillColor',
@@ -415,7 +416,7 @@ const SeriesLineStyleInput: FC<SeriesLineStyleInputProps> = memo(({ chartConfig,
         return null;
     }
 
-    const suffix = chartConfig.measures.series?.name ?? 'unknown';
+    const suffix = stringToHtmlId(chartConfig.measures.series?.name) ?? 'unknown';
     return (
         <>
             <div className="form-group row">
diff --git a/packages/components/src/internal/components/chart/ChartFieldOption.tsx b/packages/components/src/internal/components/chart/ChartFieldOption.tsx
index 4de8ad171b..580f2f42b7 100644
--- a/packages/components/src/internal/components/chart/ChartFieldOption.tsx
+++ b/packages/components/src/internal/components/chart/ChartFieldOption.tsx
@@ -11,6 +11,7 @@ import { ChartConfig, ChartConfigSetter, ChartFieldInfo, ChartLabels, ChartTypeI
 import { getBarChartAxisLabel, getSelectOptions, hasTrendline } from './utils';
 
 import { ChartFieldAdditionalOptions } from './ChartFieldAdditionalOptions';
+import { stringToHtmlId } from '../../util/utils';
 
 const DEFAULT_SCALE_VALUES = { type: 'automatic', trans: 'linear' };
 
@@ -96,9 +97,10 @@ export const ChartFieldOption: FC<OwnProps> = memo(props => {
         [selectedType, setChartConfig]
     );
 
+    const id = stringToHtmlId(field.name);
     return (
         <div>
-            <label htmlFor={field.name}>
+            <label htmlFor={id}>
                 {field.label}
                 {field.required && ' *'}
             </label>
@@ -106,7 +108,7 @@ export const ChartFieldOption: FC<OwnProps> = memo(props => {
                 <SelectInput
                     containerClass=""
                     inputClass={showAdditionalOptions ? 'col-xs-11' : 'col-xs-12'}
-                    inputId={field.name}
+                    inputId={id}
                     labelKey="caption"
                     name={field.name}
                     onChange={onSelectChange}

From 1e434ce8a46289c1819adbf9fc6ab77520e47b18 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Wed, 29 Apr 2026 12:43:50 -0700
Subject: [PATCH 26/30] Don't generate ids with each re-render

---
 packages/components/src/internal/components/DateInput.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/components/src/internal/components/DateInput.tsx b/packages/components/src/internal/components/DateInput.tsx
index 166861c222..a0f3ce584a 100644
--- a/packages/components/src/internal/components/DateInput.tsx
+++ b/packages/components/src/internal/components/DateInput.tsx
@@ -1,4 +1,4 @@
-import React, { FC, memo, useCallback, useMemo, useRef } from 'react';
+import React, { FC, memo, useCallback, useMemo, useRef, useState } from 'react';
 import DatePicker, { DatePickerProps } from 'react-datepicker';
 
 import { getDateFNSDateFormat, parseDateFNSTimeFormat } from '../util/Date';
@@ -12,6 +12,8 @@ export interface DateInputProps {
 
 export const DateInput: FC<DateInputProps & DatePickerProps> = memo(props => {
     const { container, dateFormat, onSelect, timeFormat, ...pickerProps } = props;
+    const [id] = useState(() => generateId('date-input-'))
+
     const input = useRef<DatePicker>(undefined);
     const formats = useMemo(() => {
         const dateFormat_ = dateFormat ?? getDateFNSDateFormat(container);
@@ -34,8 +36,6 @@ export const DateInput: FC<DateInputProps & DatePickerProps> = memo(props => {
         [onSelect]
     );
 
-    const id = generateId('date-input-');
-
     return (
         <span className="input-group date-input">
             <DatePicker

From e2907a9af2b290ed32b476700789645837f53e23 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Wed, 29 Apr 2026 12:44:38 -0700
Subject: [PATCH 27/30] add inputId and distinguish from name

---
 .../internal/components/labelPrinting/PrintLabelsModal.tsx  | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/packages/components/src/internal/components/labelPrinting/PrintLabelsModal.tsx b/packages/components/src/internal/components/labelPrinting/PrintLabelsModal.tsx
index b514a599ab..6461e5cd98 100644
--- a/packages/components/src/internal/components/labelPrinting/PrintLabelsModal.tsx
+++ b/packages/components/src/internal/components/labelPrinting/PrintLabelsModal.tsx
@@ -243,7 +243,8 @@ export class PrintLabelsModalImpl extends PureComponent<PrintModalProps & Inject
                                     loadOnFocus
                                     maxRows={LOOKUP_DEFAULT_SIZE}
                                     multiple={true}
-                                    name="label-samples"
+                                    inputId="label-samples"
+                                    name="labelSamples"
                                     onQSChange={this.changeSampleSelection}
                                     placeholder="Select or type to search..."
                                     required={false}
@@ -259,10 +260,11 @@ export class PrintLabelsModalImpl extends PureComponent<PrintModalProps & Inject
                             <QuerySelect
                                 formsy={false}
                                 fireQSChangeOnInit
+                                inputId="label-template"
                                 showLabel={false}
                                 loadOnFocus
                                 maxRows={LOOKUP_DEFAULT_SIZE}
-                                name="label-template"
+                                name="labelTemplate"
                                 onQSChange={this.changeTemplateSelection}
                                 placeholder="Select or type to search..."
                                 required

From 0d605019974eb9c8a742469210bc6d29a12334c4 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Thu, 30 Apr 2026 12:24:28 -0700
Subject: [PATCH 28/30] @labkey/components v7.33.3-inputLabels.7

---
 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 2aec5800fd..57cf9cde1b 100644
--- a/packages/components/package-lock.json
+++ b/packages/components/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@labkey/components",
-  "version": "7.33.3-inputLabels.6",
+  "version": "7.33.3-inputLabels.7",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@labkey/components",
-      "version": "7.33.3-inputLabels.6",
+      "version": "7.33.3-inputLabels.7",
       "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 813a526b23..97fc0079d3 100644
--- a/packages/components/package.json
+++ b/packages/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@labkey/components",
-  "version": "7.33.3-inputLabels.6",
+  "version": "7.33.3-inputLabels.7",
   "description": "Components, models, actions, and utility functions for LabKey applications and pages",
   "sideEffects": false,
   "files": [

From 23dc1d6ce9f1268ff43ef6a8afce63e555ccdcc8 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Fri, 1 May 2026 07:09:22 -0700
Subject: [PATCH 29/30] Release date and version

---
 packages/components/releaseNotes/components.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/components/releaseNotes/components.md b/packages/components/releaseNotes/components.md
index 2ab808e3d2..61f73f23c5 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.33.3
+*Released*: 1 May 2026
 - Accessibility improvements: add labels or aria-labels to input elements
 
 ### version 7.33.2

From a2662066d0d236bc686320dd3eab7859f76f4260 Mon Sep 17 00:00:00 2001
From: labkey-susanh <susanh@labkey.com>
Date: Fri, 1 May 2026 07:11:14 -0700
Subject: [PATCH 30/30] @labkey/components v7.33.3

---
 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 57cf9cde1b..09ac1a54fa 100644
--- a/packages/components/package-lock.json
+++ b/packages/components/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@labkey/components",
-  "version": "7.33.3-inputLabels.7",
+  "version": "7.33.3",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "@labkey/components",
-      "version": "7.33.3-inputLabels.7",
+      "version": "7.33.3",
       "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 97fc0079d3..7b5215e79c 100644
--- a/packages/components/package.json
+++ b/packages/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@labkey/components",
-  "version": "7.33.3-inputLabels.7",
+  "version": "7.33.3",
   "description": "Components, models, actions, and utility functions for LabKey applications and pages",
   "sideEffects": false,
   "files": [