Visitar URL original
USWDS - Accessibility: Added button functionality to usa-button links by mahoneycm · Pull Request #4385 · uswds/uswds · GitHub
Skip to content

USWDS - Accessibility: Added button functionality to usa-button links #4385

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
thisisdano merged 18 commits into from
May 10, 2023
Merged

USWDS - Accessibility: Added button functionality to usa-button links #4385

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
18 commits
Select commit Hold shift + click to select a range
cd47f33
Add `role="button"` to link in button group.
mejiaj Oct 5, 2020
84d0d75
Add role button JS to trigger on space.
mejiaj Nov 13, 2020
65d7641
Add space key in keymap function and remove test code.
mejiaj Nov 13, 2020
6e4df71
Adds button functionality to links with usa-button class
Nov 2, 2021
6c406a4
Updated dependenies
Nov 4, 2021
4eef3bb
Removed role=button and replaced href single quotes with double quotes
Nov 17, 2021
af3c555
Updated to the latest
Dec 2, 2021
be9af77
Removed mention of USA button from buttons.js
Dec 3, 2021
f7c6b7b
Merge branch 'develop' of https://github.com/uswds/uswds into cm-butt…
Dec 9, 2021
d21c9b5
Fixed button.js variable names
Dec 9, 2021
a84aa4b
Merge branch 'develop' of github.com:uswds/uswds into cm-button-group…
mahoneycm Mar 14, 2023
d556ab4
Move button js to from src to button package
mahoneycm Mar 14, 2023
1819474
Remove depreciated src/js/components
mahoneycm Mar 14, 2023
22ee254
Button Group: Add role to usa-button anchor
mahoneycm Mar 14, 2023
a9e1048
Remove role=button based on Dan's comment in #3690
mahoneycm Mar 14, 2023
3b5316b
Replace buttons in usa-card with usa-button anchors
mahoneycm Mar 14, 2023
f0fc39e
Add empty line after require
mahoneycm Mar 14, 2023
124fe94
Run prettier js
mahoneycm Mar 14, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions packages/usa-button-group/src/usa-button-group.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,11 +37,11 @@
{% else %}
<ul class="usa-button-group">
<li class="usa-button-group__item">
<a href="javascript:void(0);" class="usa-button usa-button--outline">Back</a>
<a href="#" class="usa-button usa-button--outline">Back</a>
</li>
<li class="usa-button-group__item">
<button type="button" class="usa-button" {% if disabled_state == "disabled" %}disabled{% endif %} {% if disabled_state == "aria-disabled" %}aria-disabled="true"{% endif %}>Continue</button>
</li>
</ul>
<!-- end default styles -->
{% endif %}
{% endif %}
19 changes: 19 additions & 0 deletions packages/usa-button/src/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
const keymap = require("receptor/keymap");
const behavior = require("../../uswds-core/src/js/utils/behavior");

const ANCHOR_BUTTON = `a[class*="usa-button"]`;

const toggleButton = (event) => {
event.preventDefault();
event.target.click();
};

const anchorButton = behavior({
keydown: {
[ANCHOR_BUTTON]: keymap({
" ": toggleButton,
}),
},
});

module.exports = anchorButton;
6 changes: 1 addition & 5 deletions packages/usa-card/src/usa-card.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,11 +31,7 @@
{% endif %}
</div>
<div class="usa-card__footer">
{% include "@components/usa-button/src/usa-button.twig" with {
'modifier': card.cta_modifier,
'text': card.cta_text|default('Visit Florida Keys'),
'type': 'button'
} %}
<a href="#" class="usa-button">Visit Florida Keys</a>
</div>
</div>
</li>
Expand Down
2 changes: 2 additions & 0 deletions packages/uswds-core/src/js/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
const accordion = require("../../../usa-accordion/src/index");
const banner = require("../../../usa-banner/src/index");
const button = require("../../../usa-button/src/index");
const characterCount = require("../../../usa-character-count/src/index");
const comboBox = require("../../../usa-combo-box/src/index");
const datePicker = require("../../../usa-date-picker/src/index");
Expand All @@ -23,6 +24,7 @@ const validator = require("../../../usa-validation/src/index");
module.exports = {
accordion,
banner,
button,
characterCount,
comboBox,
datePicker,
Expand Down