kopia lustrzana https://github.com/shoelace-style/shoelace
fix disabled screen reader bug; closes #658
rodzic
401aba407c
commit
fbec7bd360
|
@ -10,6 +10,7 @@ _During the beta period, these restrictions may be relaxed in the event of a mis
|
||||||
|
|
||||||
- 🚨 BREAKING: the `unit` property of `<sl-format-bytes>` has changed to `byte | bit` instead of `bytes | bits`
|
- 🚨 BREAKING: the `unit` property of `<sl-format-bytes>` has changed to `byte | bit` instead of `bytes | bits`
|
||||||
- Fixed a bug that caused `<sl-progress-ring>` to render the wrong size when `--track-width` was increased [#656](https://github.com/shoelace-style/shoelace/issues/656)
|
- Fixed a bug that caused `<sl-progress-ring>` to render the wrong size when `--track-width` was increased [#656](https://github.com/shoelace-style/shoelace/issues/656)
|
||||||
|
- Fixed a bug that allowed `<sl-details>` to open and close when disabled using a screen reader [#658](https://github.com/shoelace-style/shoelace/issues/658)
|
||||||
- Implemented stricter linting to improve consistency and reduce errors, which resulted in many small refactors throughout the codebase [#647](https://github.com/shoelace-style/shoelace/pull/647)
|
- Implemented stricter linting to improve consistency and reduce errors, which resulted in many small refactors throughout the codebase [#647](https://github.com/shoelace-style/shoelace/pull/647)
|
||||||
- Improved accessibility of `<sl-dialog>` and `<sl-drawer>` by making the title an `<h2>` and adding a label to the close button
|
- Improved accessibility of `<sl-dialog>` and `<sl-drawer>` by making the title an `<h2>` and adding a label to the close button
|
||||||
- Refactored `<sl-format-byte>` to use `Intl.NumberFormat` so it supports localization
|
- Refactored `<sl-format-byte>` to use `Intl.NumberFormat` so it supports localization
|
||||||
|
|
|
@ -55,7 +55,7 @@ export default class SlDetails extends LitElement {
|
||||||
|
|
||||||
/** Shows the details. */
|
/** Shows the details. */
|
||||||
async show() {
|
async show() {
|
||||||
if (this.open) {
|
if (this.open || this.disabled) {
|
||||||
return undefined;
|
return undefined;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -65,7 +65,7 @@ export default class SlDetails extends LitElement {
|
||||||
|
|
||||||
/** Hides the details */
|
/** Hides the details */
|
||||||
async hide() {
|
async hide() {
|
||||||
if (!this.open) {
|
if (!this.open || this.disabled) {
|
||||||
return undefined;
|
return undefined;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -73,17 +73,14 @@ export default class SlDetails extends LitElement {
|
||||||
return waitForEvent(this, 'sl-after-hide');
|
return waitForEvent(this, 'sl-after-hide');
|
||||||
}
|
}
|
||||||
|
|
||||||
toggleOpen() {
|
|
||||||
if (this.open) {
|
|
||||||
this.hide();
|
|
||||||
} else {
|
|
||||||
this.show();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
handleSummaryClick() {
|
handleSummaryClick() {
|
||||||
if (!this.disabled) {
|
if (!this.disabled) {
|
||||||
this.toggleOpen();
|
if (this.open) {
|
||||||
|
this.hide();
|
||||||
|
} else {
|
||||||
|
this.show();
|
||||||
|
}
|
||||||
|
|
||||||
this.header.focus();
|
this.header.focus();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -91,7 +88,12 @@ export default class SlDetails extends LitElement {
|
||||||
handleSummaryKeyDown(event: KeyboardEvent) {
|
handleSummaryKeyDown(event: KeyboardEvent) {
|
||||||
if (event.key === 'Enter' || event.key === ' ') {
|
if (event.key === 'Enter' || event.key === ' ') {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
this.toggleOpen();
|
|
||||||
|
if (this.open) {
|
||||||
|
this.hide();
|
||||||
|
} else {
|
||||||
|
this.show();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if (event.key === 'ArrowUp' || event.key === 'ArrowLeft') {
|
if (event.key === 'ArrowUp' || event.key === 'ArrowLeft') {
|
||||||
|
|
Ładowanie…
Reference in New Issue