From 534759b13e240162c806755dd78d947bd2ceeafe Mon Sep 17 00:00:00 2001 From: Magnus Ellinge Date: Thu, 4 Jul 2019 17:15:32 +0200 Subject: [PATCH 01/10] fix: Try adjust labels to read tags also --- src/a11y/index.js | 8 ++++---- src/index.js | 3 +-- src/tag/index.js | 4 +++- src/trigger/index.js | 16 ++++++++++++++-- 4 files changed, 22 insertions(+), 9 deletions(-) diff --git a/src/a11y/index.js b/src/a11y/index.js index fac78b08..1151aea7 100644 --- a/src/a11y/index.js +++ b/src/a11y/index.js @@ -1,10 +1,10 @@ -export function getAriaLabel(label) { - if (!label) return undefined +export function getAriaLabel(label, additionalLabelledBy) { + if (!label && !additionalLabelledBy) return undefined if (label && label[0] === '#') { /* See readme for label. When label starts with # it references ids of dom nodes instead. When used on aria-labelledby, they should be referenced without a starting hash/# */ - return { 'aria-labelledby': label.replace(/#/g, '') } + return { 'aria-labelledby': (label.replace(/#/g, '') + ' ' + additionalLabelledBy).trim() } } - return { 'aria-label': label } + return { 'aria-label': label, 'aria-labelledby': additionalLabelledBy } } diff --git a/src/index.js b/src/index.js index 4bc61a32..ee4d63af 100644 --- a/src/index.js +++ b/src/index.js @@ -281,7 +281,7 @@ class DropdownTreeSelect extends Component { const activeDescendant = currentFocus ? `${currentFocus}_li` : undefined - const commonProps = { disabled, readOnly, activeDescendant, texts, mode } + const commonProps = { disabled, readOnly, activeDescendant, texts, mode, clientId: this.clientId } return (
)} diff --git a/src/tag/index.js b/src/tag/index.js index 343c1f66..6d678082 100644 --- a/src/tag/index.js +++ b/src/tag/index.js @@ -41,6 +41,7 @@ class Tag extends PureComponent { const { id, label, labelRemove = 'Remove', readOnly, disabled } = this.props const tagId = `${id}_tag` + const buttonId = `${id}_button` const className = cx('tag-remove', { readOnly }, { disabled }) const isDisabled = readOnly || disabled const onClick = !isDisabled ? this.handleClick : undefined @@ -51,13 +52,14 @@ class Tag extends PureComponent { {label}
- +