-
Notifications
You must be signed in to change notification settings - Fork 0
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
feature/UIDS-474-add-hover-to-tooltip #487
Conversation
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.
Just one comment on the accessibility but I know we're in a time crunch so could address it separately.
onClick={this.handleToggleTooltipClick} | ||
onKeyPress={this.handleToggleTooltipClick} | ||
onMouseEnter={this.props.withHover && this.handleToggleTooltipHover} | ||
onMouseLeave={this.props.withHover && this.handleToggleTooltipHover} |
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 only issue is that this tooltip will not be accessible if it is mouse-only (not available to keyboard users). Maybe we can add an onFocus and onBlur? If so, it may be worth extracting out this.props.withHover && this.handleToggleTooltipHover
to a separate var at the top of render
3707229
to
6e83df2
Compare
* allows Tooltip to open on hover (#487)
* HOTFIX update tooltip primary variant to ux-emerald (#415) * Feature RS-8352 Tabs (#477) Add Tabs and Tabs with react-bootstrap and styled-components * feature/UIDS-442 add Button to DS (#450) Adds react-bootstrap and Button component to the Design System * Bug/UIDS-484 Set node version on nightly visual tests (#485) * chore/UIDS-476 documentation updates (#486) * Chore/ Add Percy snapshots for buttons (#488) * Chore/ Delete old sample file for cypress tests (#482) * Merge hotfix/1.24.1 into develop branch (#493) * allows Tooltip to open on hover (#487) * Prepare release 1.25.0 Co-authored-by: Rachel Roppolo <rachel@userinterviews.com> Co-authored-by: Jane Sebastian <jane@userinterviews.com> Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: brianCollinsUI <84730553+brianCollinsUI@users.noreply.github.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
* allows Tooltip to open on hover (#487) * Prepare hotfix 1.24.1 (#492) * Merge release/1.25.0 into main branch (#494) * HOTFIX update tooltip primary variant to ux-emerald (#415) * Feature RS-8352 Tabs (#477) Add Tabs and Tabs with react-bootstrap and styled-components * feature/UIDS-442 add Button to DS (#450) Adds react-bootstrap and Button component to the Design System * Bug/UIDS-484 Set node version on nightly visual tests (#485) * chore/UIDS-476 documentation updates (#486) * Chore/ Add Percy snapshots for buttons (#488) * Chore/ Delete old sample file for cypress tests (#482) * Merge hotfix/1.24.1 into develop branch (#493) * allows Tooltip to open on hover (#487) * Prepare release 1.25.0 Co-authored-by: Rachel Roppolo <rachel@userinterviews.com> Co-authored-by: Jane Sebastian <jane@userinterviews.com> Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: brianCollinsUI <84730553+brianCollinsUI@users.noreply.github.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * update relative bootstrap imports (#497) * Prepare hotfix 1.25.1 Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: Rachel Roppolo <rachel@userinterviews.com> Co-authored-by: Jane Sebastian <jane@userinterviews.com> Co-authored-by: brianCollinsUI <84730553+brianCollinsUI@users.noreply.github.com>
* HOTFIX update tooltip primary variant to ux-emerald (#415) * Feature RS-8352 Tabs (#477) Add Tabs and Tabs with react-bootstrap and styled-components * feature/UIDS-442 add Button to DS (#450) Adds react-bootstrap and Button component to the Design System * Bug/UIDS-484 Set node version on nightly visual tests (#485) * chore/UIDS-476 documentation updates (#486) * Chore/ Add Percy snapshots for buttons (#488) * Chore/ Delete old sample file for cypress tests (#482) * Merge hotfix/1.24.1 into develop branch (#493) * allows Tooltip to open on hover (#487) * Merge release/1.25.0 into develop branch (#495) * allows Tooltip to open on hover (#487) * Prepare hotfix 1.24.1 (#492) * Prepare release 1.25.0 Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * Merge hotfix/1.25.1 into develop branch (#499) * allows Tooltip to open on hover (#487) * Prepare hotfix 1.24.1 (#492) * Merge release/1.25.0 into main branch (#494) * HOTFIX update tooltip primary variant to ux-emerald (#415) * Feature RS-8352 Tabs (#477) Add Tabs and Tabs with react-bootstrap and styled-components * feature/UIDS-442 add Button to DS (#450) Adds react-bootstrap and Button component to the Design System * Bug/UIDS-484 Set node version on nightly visual tests (#485) * chore/UIDS-476 documentation updates (#486) * Chore/ Add Percy snapshots for buttons (#488) * Chore/ Delete old sample file for cypress tests (#482) * Merge hotfix/1.24.1 into develop branch (#493) * allows Tooltip to open on hover (#487) * Prepare release 1.25.0 Co-authored-by: Rachel Roppolo <rachel@userinterviews.com> Co-authored-by: Jane Sebastian <jane@userinterviews.com> Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: brianCollinsUI <84730553+brianCollinsUI@users.noreply.github.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * update relative bootstrap imports (#497) * Prepare hotfix 1.25.1 Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: Rachel Roppolo <rachel@userinterviews.com> Co-authored-by: Jane Sebastian <jane@userinterviews.com> Co-authored-by: brianCollinsUI <84730553+brianCollinsUI@users.noreply.github.com> * Chore/wait a bit longer for things to render on some percy snapshots (#503) * UIDS-438 Add AsyncCreatableSelect (#500) * UIDS-506 Update Form to handle GET method (#507) Previously passing a GET method would have worked for Rails, but it wouldn't put the params in the URL which is the expected behavior. This makes it so we properly pass GET directly to the form method parameter. One other thing this does is remove the CSRF params if GET is passed. These are ignored in GET and thus aren't necessary and would add extra params to the URL. One potential upgrade that was left on the cutting room floor was passing any extra props directly to the form component. * CHORE Fix node version in deploy action (#510) * CHORE Fix yaml spacing on deploy action (#512) * feature/UIDS-312 add Dropdown to DS (#502) * adds Dropdown and subcomponents * adds DropdownIconToggle * creates shared button mixins * remove children proptype, consolidate shared proptypes * add Percy snapshots for Dropdowns * Prepare release 1.26.0 Co-authored-by: Rachel Roppolo <rachel@userinterviews.com> Co-authored-by: Jane Sebastian <jane@userinterviews.com> Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: brianCollinsUI <84730553+brianCollinsUI@users.noreply.github.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: Bob Saris <bob@userinterviews.com>
* allows Tooltip to open on hover (#487) * Prepare hotfix 1.24.1 (#492) * Merge release/1.25.0 into main branch (#494) * HOTFIX update tooltip primary variant to ux-emerald (#415) * Feature RS-8352 Tabs (#477) Add Tabs and Tabs with react-bootstrap and styled-components * feature/UIDS-442 add Button to DS (#450) Adds react-bootstrap and Button component to the Design System * Bug/UIDS-484 Set node version on nightly visual tests (#485) * chore/UIDS-476 documentation updates (#486) * Chore/ Add Percy snapshots for buttons (#488) * Chore/ Delete old sample file for cypress tests (#482) * Merge hotfix/1.24.1 into develop branch (#493) * allows Tooltip to open on hover (#487) * Prepare release 1.25.0 Co-authored-by: Rachel Roppolo <rachel@userinterviews.com> Co-authored-by: Jane Sebastian <jane@userinterviews.com> Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: brianCollinsUI <84730553+brianCollinsUI@users.noreply.github.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * update relative bootstrap imports (#497) * Prepare hotfix 1.25.1 (#498) * Prepare release 1.26.0 Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: Rachel Roppolo <rachel@userinterviews.com> Co-authored-by: Jane Sebastian <jane@userinterviews.com> Co-authored-by: brianCollinsUI <84730553+brianCollinsUI@users.noreply.github.com>
* allows Tooltip to open on hover (#487) * Prepare hotfix 1.24.1 (#492) * Merge release/1.25.0 into main branch (#494) * HOTFIX update tooltip primary variant to ux-emerald (#415) * Feature RS-8352 Tabs (#477) Add Tabs and Tabs with react-bootstrap and styled-components * feature/UIDS-442 add Button to DS (#450) Adds react-bootstrap and Button component to the Design System * Bug/UIDS-484 Set node version on nightly visual tests (#485) * chore/UIDS-476 documentation updates (#486) * Chore/ Add Percy snapshots for buttons (#488) * Chore/ Delete old sample file for cypress tests (#482) * Merge hotfix/1.24.1 into develop branch (#493) * allows Tooltip to open on hover (#487) * Prepare release 1.25.0 Co-authored-by: Rachel Roppolo <rachel@userinterviews.com> Co-authored-by: Jane Sebastian <jane@userinterviews.com> Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: brianCollinsUI <84730553+brianCollinsUI@users.noreply.github.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * update relative bootstrap imports (#497) * Prepare hotfix 1.25.1 (#498) * Merge release/1.26.0 into main branch (#513) * HOTFIX update tooltip primary variant to ux-emerald (#415) * Feature RS-8352 Tabs (#477) Add Tabs and Tabs with react-bootstrap and styled-components * feature/UIDS-442 add Button to DS (#450) Adds react-bootstrap and Button component to the Design System * Bug/UIDS-484 Set node version on nightly visual tests (#485) * chore/UIDS-476 documentation updates (#486) * Chore/ Add Percy snapshots for buttons (#488) * Chore/ Delete old sample file for cypress tests (#482) * Merge hotfix/1.24.1 into develop branch (#493) * allows Tooltip to open on hover (#487) * Merge release/1.25.0 into develop branch (#495) * allows Tooltip to open on hover (#487) * Prepare hotfix 1.24.1 (#492) * Prepare release 1.25.0 Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * Merge hotfix/1.25.1 into develop branch (#499) * allows Tooltip to open on hover (#487) * Prepare hotfix 1.24.1 (#492) * Merge release/1.25.0 into main branch (#494) * HOTFIX update tooltip primary variant to ux-emerald (#415) * Feature RS-8352 Tabs (#477) Add Tabs and Tabs with react-bootstrap and styled-components * feature/UIDS-442 add Button to DS (#450) Adds react-bootstrap and Button component to the Design System * Bug/UIDS-484 Set node version on nightly visual tests (#485) * chore/UIDS-476 documentation updates (#486) * Chore/ Add Percy snapshots for buttons (#488) * Chore/ Delete old sample file for cypress tests (#482) * Merge hotfix/1.24.1 into develop branch (#493) * allows Tooltip to open on hover (#487) * Prepare release 1.25.0 Co-authored-by: Rachel Roppolo <rachel@userinterviews.com> Co-authored-by: Jane Sebastian <jane@userinterviews.com> Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: brianCollinsUI <84730553+brianCollinsUI@users.noreply.github.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * update relative bootstrap imports (#497) * Prepare hotfix 1.25.1 Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: Rachel Roppolo <rachel@userinterviews.com> Co-authored-by: Jane Sebastian <jane@userinterviews.com> Co-authored-by: brianCollinsUI <84730553+brianCollinsUI@users.noreply.github.com> * Chore/wait a bit longer for things to render on some percy snapshots (#503) * UIDS-438 Add AsyncCreatableSelect (#500) * UIDS-506 Update Form to handle GET method (#507) Previously passing a GET method would have worked for Rails, but it wouldn't put the params in the URL which is the expected behavior. This makes it so we properly pass GET directly to the form method parameter. One other thing this does is remove the CSRF params if GET is passed. These are ignored in GET and thus aren't necessary and would add extra params to the URL. One potential upgrade that was left on the cutting room floor was passing any extra props directly to the form component. * CHORE Fix node version in deploy action (#510) * CHORE Fix yaml spacing on deploy action (#512) * feature/UIDS-312 add Dropdown to DS (#502) * adds Dropdown and subcomponents * adds DropdownIconToggle * creates shared button mixins * remove children proptype, consolidate shared proptypes * add Percy snapshots for Dropdowns * Prepare release 1.26.0 Co-authored-by: Rachel Roppolo <rachel@userinterviews.com> Co-authored-by: Jane Sebastian <jane@userinterviews.com> Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: brianCollinsUI <84730553+brianCollinsUI@users.noreply.github.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: Bob Saris <bob@userinterviews.com> * Prepare release 1.26.1 Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: Rachel Roppolo <rachel@userinterviews.com> Co-authored-by: Jane Sebastian <jane@userinterviews.com> Co-authored-by: brianCollinsUI <84730553+brianCollinsUI@users.noreply.github.com> Co-authored-by: Bob Saris <bob@userinterviews.com>
* allows Tooltip to open on hover (#487) * Prepare hotfix 1.24.1 (#492) * Merge release/1.25.0 into main branch (#494) * HOTFIX update tooltip primary variant to ux-emerald (#415) * Feature RS-8352 Tabs (#477) Add Tabs and Tabs with react-bootstrap and styled-components * feature/UIDS-442 add Button to DS (#450) Adds react-bootstrap and Button component to the Design System * Bug/UIDS-484 Set node version on nightly visual tests (#485) * chore/UIDS-476 documentation updates (#486) * Chore/ Add Percy snapshots for buttons (#488) * Chore/ Delete old sample file for cypress tests (#482) * Merge hotfix/1.24.1 into develop branch (#493) * allows Tooltip to open on hover (#487) * Prepare release 1.25.0 Co-authored-by: Rachel Roppolo <rachel@userinterviews.com> Co-authored-by: Jane Sebastian <jane@userinterviews.com> Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: brianCollinsUI <84730553+brianCollinsUI@users.noreply.github.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * update relative bootstrap imports (#497) * Prepare hotfix 1.25.1 (#498) * Merge release/1.26.0 into main branch (#513) * HOTFIX update tooltip primary variant to ux-emerald (#415) * Feature RS-8352 Tabs (#477) Add Tabs and Tabs with react-bootstrap and styled-components * feature/UIDS-442 add Button to DS (#450) Adds react-bootstrap and Button component to the Design System * Bug/UIDS-484 Set node version on nightly visual tests (#485) * chore/UIDS-476 documentation updates (#486) * Chore/ Add Percy snapshots for buttons (#488) * Chore/ Delete old sample file for cypress tests (#482) * Merge hotfix/1.24.1 into develop branch (#493) * allows Tooltip to open on hover (#487) * Merge release/1.25.0 into develop branch (#495) * allows Tooltip to open on hover (#487) * Prepare hotfix 1.24.1 (#492) * Prepare release 1.25.0 Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * Merge hotfix/1.25.1 into develop branch (#499) * allows Tooltip to open on hover (#487) * Prepare hotfix 1.24.1 (#492) * Merge release/1.25.0 into main branch (#494) * HOTFIX update tooltip primary variant to ux-emerald (#415) * Feature RS-8352 Tabs (#477) Add Tabs and Tabs with react-bootstrap and styled-components * feature/UIDS-442 add Button to DS (#450) Adds react-bootstrap and Button component to the Design System * Bug/UIDS-484 Set node version on nightly visual tests (#485) * chore/UIDS-476 documentation updates (#486) * Chore/ Add Percy snapshots for buttons (#488) * Chore/ Delete old sample file for cypress tests (#482) * Merge hotfix/1.24.1 into develop branch (#493) * allows Tooltip to open on hover (#487) * Prepare release 1.25.0 Co-authored-by: Rachel Roppolo <rachel@userinterviews.com> Co-authored-by: Jane Sebastian <jane@userinterviews.com> Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: brianCollinsUI <84730553+brianCollinsUI@users.noreply.github.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * update relative bootstrap imports (#497) * Prepare hotfix 1.25.1 Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: Rachel Roppolo <rachel@userinterviews.com> Co-authored-by: Jane Sebastian <jane@userinterviews.com> Co-authored-by: brianCollinsUI <84730553+brianCollinsUI@users.noreply.github.com> * Chore/wait a bit longer for things to render on some percy snapshots (#503) * UIDS-438 Add AsyncCreatableSelect (#500) * UIDS-506 Update Form to handle GET method (#507) Previously passing a GET method would have worked for Rails, but it wouldn't put the params in the URL which is the expected behavior. This makes it so we properly pass GET directly to the form method parameter. One other thing this does is remove the CSRF params if GET is passed. These are ignored in GET and thus aren't necessary and would add extra params to the URL. One potential upgrade that was left on the cutting room floor was passing any extra props directly to the form component. * CHORE Fix node version in deploy action (#510) * CHORE Fix yaml spacing on deploy action (#512) * feature/UIDS-312 add Dropdown to DS (#502) * adds Dropdown and subcomponents * adds DropdownIconToggle * creates shared button mixins * remove children proptype, consolidate shared proptypes * add Percy snapshots for Dropdowns * Prepare release 1.26.0 Co-authored-by: Rachel Roppolo <rachel@userinterviews.com> Co-authored-by: Jane Sebastian <jane@userinterviews.com> Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: brianCollinsUI <84730553+brianCollinsUI@users.noreply.github.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: Bob Saris <bob@userinterviews.com> * Merge release/1.26.1 into main branch (#517) * UIDS-501 Export color variables for use in js (#504) * use font-type-30 on form-control (#516) * Prepare release 1.26.1 * Fix merge conflicts on 1.27.0 * Merge release/1.28.0 into main branch (#563) * updates Dropdown documentation, adds Figma addon for illustrations (#554) * add transparent Button variant & update DropdownIconToggle (#560) Adding the transparent and outline transparent variant to the Button component. Uses transparent button variant in ModalFooter actions for closing. Updates DropdownToggle to support icon-only dropdown. Removes DropdownIconToggle in favor of using DropdownToggle to better support flexible styling. * Prepare release 1.28.0 Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * Merge release/1.29.0 into main branch (#569) * add CardList to DS (#567) Adds a CardList layout component to wrap around existing design system Cards. * update Pill color and border (#568) Updates Pills colors, removes Pill border, and introduces a Pills layout component to wrap around a collection of Pill components. * Prepare release 1.29.0 Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * Merge release/1.29.1 into main branch (#578) * remove margin from Card (#572) * rename CardList to CardContainer (#574) Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * Merge release/1.29.2 into main branch (#594) * Button and Link distinction documentation (#587) * add brand variants to Button (#593) Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * remove extra version in package.json * Merge release/1.30.0 into main branch (#611) * removing TrackedButton from export (#603) * add aria-live to Toast (#605) * handle setting title prop on Toast (#607) * update focus state to Button and Select (#601) Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * Merge release/1.30.1 into main branch (#618) * fix styles on Select to allow for tabbing and proper focus (#617) * Merge release/1.30.2 into main branch (#624) * allow setting id on InputLabel (#621) * add id to FormGroup__invalid-feedback (#623) * Merge release/1.30.3 into main branch (#629) * update Input focus boder to ux-blue-500 for 3:1 contrast ratio (#628) * Merge release/1.31.0 into main branch (#633) * update FormGroup and InputLabel to support fieldset and legend (#632) * Merge release/1.31.1 into main branch (#642) * change FormControlLabel label and children to span (#638) * updating input scss variables (#641) * Prepare release 1.31.1 * Merge release/1.32.0 into main branch (#660) * remove required id from FormGroup (#645) * Fix cypress tests (#647) * Add data-testid to LoadingOverlay (#652) * add Link variant to Button component (#659) * upgrade react-select v5 (#658) * Add Accordion to DS (#656) * update snapshots * Prepare release 1.32.1 Co-authored-by: Jason Basuil <basuilj@gmail.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: Rachel Roppolo <rachel@userinterviews.com> Co-authored-by: Jane Sebastian <jane@userinterviews.com> Co-authored-by: brianCollinsUI <84730553+brianCollinsUI@users.noreply.github.com> Co-authored-by: Bob Saris <bob@userinterviews.com> Co-authored-by: Rachel Roppolo <rroppolo@Rachels-MacBook-Pro.local>
closes #474
Tooltip
already has the ability to swap out icons with theicon
prop and can customize the icon throughiconClasses