Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 | 2x 18x 18x 18x 20112x 20112x 18x 18968x 18968x 18968x 45946x 45946x 37312x 37312x | /**
* Copyright 2020 Adobe. All rights reserved.
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License. You may obtain a copy
* of the License at http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software distributed under
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
* OF ANY KIND, either express or implied. See the License for the specific language
* governing permissions and limitations under the License.
*/
/**
@base BaseLabellable
@classdesc Accessibility helper for components with label and icon properties
*/
const BaseLabellable = (superClass) => class extends superClass {
_observeLabel() {
this._observableLabel = this._observableLabel || this._elements.label || this._elements.content;
// Listen for mutations
this._observer = new MutationObserver(this._toggleIconAriaHidden.bind(this));
// Watch for changes to the content element
this._observer.observe(this._observableLabel, {
// Catch changes to childList
childList: true,
// Catch changes to textContent
characterData: true,
// Monitor any child node
subtree: true
});
}
// Hides the icon from screen readers to avoid duplicated labels
_toggleIconAriaHidden() {
this._renderedLabel = this._renderedLabel || this.label || this.content;
// toggle aria-hidden if tab is labelled
if (this._elements.icon) {
const isLabelled = (this._renderedLabel && this._renderedLabel.textContent.trim().length) ||
this.getAttribute('aria-label') !== null ||
this.getAttribute('aria-labelledby') !== null;
this._elements.icon[isLabelled ? 'setAttribute' : 'removeAttribute']('aria-hidden', 'true');
}
}
/** @ignore */
static get observedAttributes() {
return super.observedAttributes.concat(['aria-label', 'aria-labelledby']);
}
/** @ignore */
attributeChangedCallback(name, oldValue, value) {
if (name === 'aria-label' || name === 'aria-labelledby') {
this._toggleIconAriaHidden();
} else {
super.attributeChangedCallback(name, oldValue, value);
}
}
};
export default BaseLabellable;
|