-
Notifications
You must be signed in to change notification settings - Fork 34
function/function inserted into the element button for use in accessibility #1451
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.
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
base: master
Are you sure you want to change the base?
Changes from all commits
b9b9b8e
4e3e93d
8e44cbb
c38f21f
450665f
7f59c8e
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,2 +1,3 @@ | ||
/react/node_modules | ||
CHANGELOG.md | ||
node_modules/ | ||
coverage/ | ||
*.snap.ts |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,47 +1,7 @@ | ||
{ | ||
"extends": ["vtex-react"], | ||
"rules": { | ||
"import/no-unresolved": [ | ||
"error", | ||
{ | ||
"commonjs": true, | ||
"amd": true, | ||
"ignore": ["^([a-zA-Z@]+[-\\.]?)+"] | ||
} | ||
], | ||
// Rules that conflict with Prettier. | ||
// To verify conflicting rules, run: | ||
// $ npm run prettier-conflict-check | ||
"@typescript-eslint/no-empty-function": "off", | ||
"@typescript-eslint/camelcase": "off", | ||
"@typescript-eslint/no-use-before-define": "off", | ||
"@typescript-eslint/class-name-casing": "off", | ||
"jsx-a11y/click-events-have-key-events": "off", | ||
"jsx-a11y/mouse-events-have-key-events": "off", | ||
"jsx-a11y/no-static-element-interactions": "off", | ||
"jsx-a11y/no-noninteractive-element-interactions": "off", | ||
"jsx-a11y/no-noninteractive-tabindex": "off", | ||
"jsx-a11y/label-has-for": "off", | ||
"jsx-a11y/label-has-associated-control": "off", | ||
"jsx-a11y/no-onchange": "off", | ||
"jsx-a11y/no-autofocus": "off" | ||
}, | ||
"overrides": [ | ||
{ | ||
// Rules for autogenerated files, | ||
// They may need to be bypass some rules. | ||
// E.g.: EXPERIMENTAL_ needs camelcase bypass | ||
"files": ["react/*.js"], | ||
"rules": { | ||
"import/default": "off" | ||
} | ||
} | ||
], | ||
"extends": "vtex", | ||
"root": true, | ||
"env": { | ||
"browser": true, | ||
"node": true, | ||
"mocha": true, | ||
"jest": true, | ||
"es6": true | ||
"node": true | ||
} | ||
} | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,6 +1 @@ | ||
{ | ||
"semi": false, | ||
"singleQuote": true, | ||
"trailingComma": "es5", | ||
"jsxBracketSameLine": true | ||
} | ||
"@vtex/prettier-config" |
Original file line number | Diff line number | Diff line change | ||||
---|---|---|---|---|---|---|
|
@@ -215,6 +215,8 @@ class Button extends Component { | |||||
|
||||||
return ( | ||||||
<Element | ||||||
role={this.props.role} | ||||||
aria-label={this.props.ariaLabel} | ||||||
id={this.props.id} | ||||||
data-testid={this.props.testId} | ||||||
autoFocus={iconOnly ? undefined : this.props.autoFocus} | ||||||
|
@@ -241,7 +243,8 @@ class Button extends Component { | |||||
// Button-mode exclusive props | ||||||
type={href ? undefined : this.props.type} | ||||||
// Link-mode exclusive props | ||||||
{...(href && linkModeProps)}> | ||||||
{...(href && linkModeProps)} | ||||||
> | ||||||
{isLoading ? ( | ||||||
<Fragment> | ||||||
<span className="vtex-button__spinner-container top-0 left-0 w-100 h-100 absolute flex justify-center items-center"> | ||||||
|
@@ -258,7 +261,8 @@ class Button extends Component { | |||||
style={{ | ||||||
paddingTop: '.25em', | ||||||
paddingBottom: '.32em', | ||||||
}}> | ||||||
}} | ||||||
> | ||||||
{children} | ||||||
</div> | ||||||
)} | ||||||
|
@@ -281,6 +285,8 @@ Button.defaultProps = { | |||||
isLastOfGroup: false, | ||||||
isActiveOfGroup: false, | ||||||
tabIndex: 0, | ||||||
ariaLabel: 'button', | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. The default aria-label value 'button' is not descriptive and may not provide meaningful information to screen readers. Consider using a more descriptive default or making this prop required when the button doesn't have visible text content.
Suggested change
Copilot uses AI. Check for mistakes. Positive FeedbackNegative Feedback |
||||||
role: 'button', | ||||||
} | ||||||
|
||||||
Button.propTypes = { | ||||||
|
@@ -379,6 +385,10 @@ Button.propTypes = { | |||||
noUpperCase: PropTypes.bool, | ||||||
/** Disables label wrapping */ | ||||||
noWrap: PropTypes.bool, | ||||||
/** Aria label description */ | ||||||
ariaLabel: PropTypes.string, | ||||||
/** Role definition*/ | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Missing space before the closing comment delimiter. It should be '/** Role definition */'.
Suggested change
Copilot uses AI. Check for mistakes. Positive FeedbackNegative Feedback |
||||||
role: PropTypes.string, | ||||||
} | ||||||
|
||||||
export default withForwardedRef(Button) |
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -26,7 +26,9 @@ | |
"@types/react": "^16.8.23", | ||
"@types/react-dom": "^16.9.0", | ||
"@types/recharts": "^1.8.0", | ||
"recharts": "^2.0.0-beta.1" | ||
"recharts": "^2.0.0-beta.1", | ||
"vtex.render-runtime": "http://vtex.vtexassets.com/_v/public/typings/v1/[email protected]/public/@types/vtex.render-runtime", | ||
"vtex.styleguide": "http://vtex.vtexassets.com/_v/public/typings/v1/[email protected]/public/@types/vtex.styleguide" | ||
}, | ||
"peerDependencies": { | ||
"react": "^16.8.0", | ||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -2173,6 +2173,14 @@ vtex-tachyons@^2.10.0: | |
resolved "https://registry.yarnpkg.com/vtex-tachyons/-/vtex-tachyons-2.10.0.tgz#d72363dcd77d0960cb23efc82e0e8d168714f153" | ||
integrity sha512-WWEOR4iyrMQ2fzp+EActa5ZLaYSMdPk2yxP8XQRhg+q+QnbFH2EKGayjkea4okXRDE7KTKQZdLF3GlB/HaXOow== | ||
|
||
"vtex.render-runtime@http://vtex.vtexassets.com/_v/public/typings/v1/[email protected]/public/@types/vtex.render-runtime": | ||
version "8.135.1" | ||
resolved "http://vtex.vtexassets.com/_v/public/typings/v1/[email protected]/public/@types/vtex.render-runtime#357ddee2f9249db4209de73b26c43997a5ca4422" | ||
|
||
"vtex.styleguide@http://vtex.vtexassets.com/_v/public/typings/v1/[email protected]/public/@types/vtex.styleguide": | ||
version "9.146.13" | ||
resolved "http://vtex.vtexassets.com/_v/public/typings/v1/[email protected]/public/@types/vtex.styleguide#f4ccbc54621bf5114ddd115b6032ae320f2eba55" | ||
|
||
warning@^4.0.0, warning@^4.0.2, warning@^4.0.3: | ||
version "4.0.3" | ||
resolved "https://registry.yarnpkg.com/warning/-/warning-4.0.3.tgz#16e9e077eb8a86d6af7d64aa1e05fd85b4678ca3" | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The word 'acessibility' is misspelled. It should be 'accessibility'.
Copilot uses AI. Check for mistakes.