Merge pull request #5851 from ilzamcmed/LPD-1277

fix(@clayui/tree-view): LPD-1277 TreeView with checkbox need a label
liferay · Aug 8, 2024 · a1503fa · a1503fa
2 parents 875aa75 + d368dce
commit a1503fa
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 0 deletions.
diff --git a/packages/clay-core/src/tree-view/TreeViewItem.tsx b/packages/clay-core/src/tree-view/TreeViewItem.tsx
@@ -780,6 +780,7 @@ export function TreeViewItemStack({
 					// @ts-ignore
 				} else if (child?.type.displayName === 'ClayCheckbox') {
 					content = React.cloneElement(child as React.ReactElement, {
+						'aria-labelledby': labelId,
 						checked: selection.selectedKeys.has(item.key),
 						disabled: loading || disabled,
 						indeterminate: selection.isIndeterminate(item.key),

diff --git a/packages/clay-core/src/tree-view/__tests__/__snapshots__/BasicRendering.tsx.snap b/packages/clay-core/src/tree-view/__tests__/__snapshots__/BasicRendering.tsx.snap
@@ -422,6 +422,7 @@ exports[`TreeView basic rendering render with checkbox 1`] = `
                 >
                   <label>
                     <input
+                      aria-labelledby="clay-id-96"
                       class="custom-control-input"
                       type="checkbox"
                     />
@@ -524,6 +525,7 @@ exports[`TreeView basic rendering render with item active 1`] = `
                 >
                   <label>
                     <input
+                      aria-labelledby="clay-id-160"
                       class="custom-control-input"
                       type="checkbox"
                     />
@@ -626,6 +628,7 @@ exports[`TreeView basic rendering render with text 1`] = `
                 >
                   <label>
                     <input
+                      aria-labelledby="clay-id-106"
                       class="custom-control-input"
                       type="checkbox"
                     />