Skip to content
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

fix(batchToolTips): make tooltips on batch action visible #13328

Merged

Conversation

AustinGitHub
Copy link
Contributor

@AustinGitHub AustinGitHub commented Mar 10, 2023

Closes # very minor fix and issue, didn't think a whole issue needed to be opened for this. If it does then I will open one upon request. This solves an issue on our IBM DataStage repo where we need tooltips for the batch action icons

Enables tooltips on batch action icons

Changelog

New

Enables tooltips on batch action icons

Changed

Tool tips to be visible when batch action items are in view.

Removed

overflow

Testing / Reviewing

Screenshot 2023-03-09 at 6 38 25 PM
Screenshot 2023-03-09 at 6 54 53 PM

Screenshot 2023-03-09 at 6 45 04 PM

Only issue I saw was with tooltipPosition the value top won't work because of how it clips. But I think this is ok because the bottom will be used more in usage. left and right will work just fine, I tested and didn't see issue. Thanks!

Batch actions with tooltips should be able to be visible now.

@AustinGitHub AustinGitHub requested a review from a team as a code owner March 10, 2023 02:51
@AustinGitHub AustinGitHub changed the title fix(batchToolTips): make tooltips on batch visible fix(batchToolTips): make tooltips on batch action visible Mar 10, 2023
@github-actions
Copy link
Contributor

github-actions bot commented Mar 10, 2023

DCO Assistant Lite bot All contributors have signed the DCO.

@netlify
Copy link

netlify bot commented Mar 10, 2023

Deploy Preview for carbon-elements ready!

Name Link
🔨 Latest commit 35335b4
🔍 Latest deploy log https://app.netlify.com/sites/carbon-elements/deploys/640f7232d9972b000894a53a
😎 Deploy Preview https://deploy-preview-13328--carbon-elements.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

@netlify
Copy link

netlify bot commented Mar 10, 2023

Deploy Preview for carbon-components-react ready!

Built without sensitive environment variables

Name Link
🔨 Latest commit 35335b4
🔍 Latest deploy log https://app.netlify.com/sites/carbon-components-react/deploys/640f72325138ab0008cfc228
😎 Deploy Preview https://deploy-preview-13328--carbon-components-react.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

@AustinGitHub
Copy link
Contributor Author

I have read the DCO document and I hereby sign the DCO.

Comment on lines +92 to +103
hasIconOnly
iconDescription="Add"
tooltipPosition="bottom"
tabIndex={batchActionProps.shouldShowBatchActions ? 0 : -1}
renderIcon={Add}
onClick={batchActionClick(selectedRows)}>
Delete
</TableBatchAction>
<TableBatchAction
hasIconOnly
iconDescription="Save"
tooltipPosition="bottom"
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this is to add another example of the tooltip in use

@AustinGitHub
Copy link
Contributor Author

Hi @alisonjoseph and @francinelucca when you get the chance can you review this today? Would like to get this in if possible, thanks!

@AustinGitHub
Copy link
Contributor Author

Screenshot 2023-03-10 at 9 00 06 AM

Copy link
Collaborator

@francinelucca francinelucca left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

Copy link
Member

@alisonjoseph alisonjoseph left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@AustinGitHub
Copy link
Contributor Author

Thank you both!

@kodiakhq kodiakhq bot merged commit 4871a96 into carbon-design-system:main Mar 13, 2023
@AustinGitHub AustinGitHub deleted the batchActions_CustomTooltip branch March 13, 2023 19:44
kodiakhq bot added a commit that referenced this pull request Mar 14, 2023
* refactor(Dropdown): ariaLabel to aria-label

* fix(menu): fix arrow key navigation when onClose is called but not closed (#13195)

* fix(menu): only clear registered items when root is closing

* fix(menu): auto-cleanup registered items

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* feat(theme): add $icon-interactive token (#13219)

* feat(theme): add $icon-interactive token

* Update packages/themes/src/tokens/v11TokenGroup.js

Co-authored-by: Alison Joseph <[email protected]>

* Update packages/themes/src/tokens/__tests__/metadata-test.js

Co-authored-by: Alison Joseph <[email protected]>

* Update packages/themes/src/tokens/__tests__/__snapshots__/v11-test.js.snap

* Update packages/themes/src/tokens/__tests__/__snapshots__/v11-test.js.snap

* chore(snapshot): update snapshots

---------

Co-authored-by: Alison Joseph <[email protected]>
Co-authored-by: Francine Lucca <[email protected]>

* feat(TextInput): add typescript types (#13142)

* feat(TextInput): add typescript types

* fix(Text Input): submcompnent workaround + add helperID prop

* chore(format): format `Popover`, `Listbox` files (#13284)

* chore(format): format Popover file

* chore(format): format ListBox files

* chore(format): update format command

* chore(release): v11.24.0 (#13282)

Co-authored-by: tay1orjones <[email protected]>

* fix(toggle): make props.labelText optional (#13196)

* fix(toggle): make props.labelText optional

* docs(toggle): add 'with accessible labels' story

* test(toggle): update public api snapshot

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* fix(ListBox): a11y - move filter tag as sibling of menu trigger, esc key improvements (#13173)

* fix(MultiSelect): a11y - move filter tag as sibling of menu trigger

* fix(Multiselect): remove tag from tab order

* fix(FilterableMultiselect): remove clear, tag from tab order

* fix(ComboBox): retain input value when menu is open and esc is pressed

* fix(FilterableMultiSelect): a few more UX tweaks

* style(MultiSelect): update styles to fix invalid issues when focused

* style(FluidMultiselect): adjust focus styles when invalid

* chore(log): remove console log

---------

Co-authored-by: Andrea N. Cardona <[email protected]>

* docs(style): add section on authoring inline styles (#13289)

* docs(style): add section on authoring inline styles

* docs(style): rephrase inline style docs

* docs(style): typo

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* refactor(ComboBox): ariaLabel to aria-label (#13273)

* refactor(ComboBox): ariaLabel to aria-label

* fix: formatting

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
Co-authored-by: Andrea N. Cardona <[email protected]>

* fix(tabs): remove max-width (#13247)

* fix(tabs): remove max-width

* docs(tabs): add max width guidance

* docs(tabs): format

---------

Co-authored-by: Andrea N. Cardona <[email protected]>
Co-authored-by: TJ Egan <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* fix(ListBox): Standardize `ListBox` menu open behavior (#13268)

* style(MultiSelect): update styles to fix invalid issues when focused

* style(FluidMultiselect): adjust focus styles when invalid

* chore(log): remove console log

* fix(ListBox): align open behaviors across ListBox components

---------

Co-authored-by: Andrea N. Cardona <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* Add Typescript annotations to Select, SelectItem and SelectItemGroup (#13235)

* refactor(typescript): type annotations on Select*

Add Typescript annotations to Select, SelectItem and SelectItemGroup.

* fix(lint): removed unused imports

Left SelectItem and SelectItemGroup in the imports after using them for
testing. Removed.

* fix(Select-test): update label to labelText

Previously removed label as it was not a property of Select.
On recommendation of maintainers reintroduced using labelText.

* Apply suggestions from code review

Co-authored-by: Andrea N. Cardona <[email protected]>

* Follow up to change suggestions

---------

Co-authored-by: Andrea N. Cardona <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* refactor(FilterableMultiSelect): ariaLabel to aria-label (#13276)

Co-authored-by: Andrea N. Cardona <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
Co-authored-by: TJ Egan <[email protected]>

* fix(SkeletonText): prevent negative px width values (#13270)

Co-authored-by: Alessandra Davila <[email protected]>

* feat(Popover): add `isTabTip` prop to `Popover` (#13283)

* feat(tabTipPopover): add tabTip to Popover

* feat(tabTipPopover): add tab-tip styles, story

* test(Popover): add e2e tests

* style(Popover): adjust storybook styles

* fix(Popover): add new prop to proptypes

* chore(snapshot): update snapshots

* docs(Popover): add close on esc to story

* docs(Popover): fix typo

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* chore(deps): bump minimist in /packages/react/examples/react-router (#13254)

Bumps [minimist](https://github.com/minimistjs/minimist) from 1.2.5 to 1.2.8.
- [Release notes](https://github.com/minimistjs/minimist/releases)
- [Changelog](https://github.com/minimistjs/minimist/blob/main/CHANGELOG.md)
- [Commits](minimistjs/minimist@v1.2.5...v1.2.8)

---
updated-dependencies:
- dependency-name: minimist
  dependency-type: indirect
...

Signed-off-by: dependabot[bot] <[email protected]>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: TJ Egan <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* refactor(StructuredList): ariaLabel to aria-label (#13261)

* refactor(StructuredListWrapper): ariaLabel to aria-label

* fix(StructuredList test): use 'aria-label'

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* feat(DataTable): add rowIds to the sortRows extra params list (#13236)

Co-authored-by: TJ Egan <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* feat(typescript): add various typescript typings (#13234)

* feat(TableToolbar): add typescript typings

* feat(TableToolbarAction): add typescript typings

* feat(TableToolbarContent): change to `tsx`

* feat(TableToolbarMenu): add typescript typings

* feat(OverflowMenuItem): add typescript typings

* fix: format

---------

Co-authored-by: Francine Lucca <[email protected]>
Co-authored-by: Francine Lucca <[email protected]>

* fix(RadioTile): forward ref to input node (#13130)

Forward ref to input node of RadioTile,
such that it behaves the same as other form inputs.

Co-authored-by: Francine Lucca <[email protected]>

* feat: migration examples prefix selectors (#13264)

* feat(ContentSwitcher): preliminary unstable refactor

* feat: added prefix and id prefix examples

* fix: delete content switcher directory

* feat: update demos

* Update examples/id-prefix/src/App.jsx

Co-authored-by: Francine Lucca <[email protected]>

* Update packages/react/src/components/IdPrefix/index.js

* feat: added docs

* fix: update context

* fix: yarn install

* fix: update context 2

* chore: update yarn packages

* chore: udpate yarn carbon/react

---------

Co-authored-by: Francine Lucca <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* feat(DataTableSkeleton): 12513 - Add TS types for props (#13245)

* feat(DataTableSkeleton): 12513 - Add TS types for props

* fix: yarn run format

---------

Co-authored-by: Francine Lucca <[email protected]>
Co-authored-by: Francine Lucca <[email protected]>

* test(datatable): refactor to use RTL (#13294)

* chore: wip

* chore: wip

* test(datatable): refactor to use RTL

* chore: typo

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* fix(modal): aria-label a11y bug (#13242)

Co-authored-by: Francine Lucca <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* test(HeaderSideNavItems): add tests (#13303)

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* docs(Storybook): update storybook config so actions display properly (#13302)

* docs(Storybook): update storybook config so actions display properly

* fix(DatePicker): change action names

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* fix(tabs): deprecate light prop (#13262)

Co-authored-by: Andrea N. Cardona <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* fix(menu): focus first item when opened (#13277)

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* fix(CodeSnippet): a11y tabstop + attributes (#13310)

* fix(CodeSnippet): a11y tabstop + attributes

* fix(CSS): add Carbon CSS to focus outline

* refactor(CodeSnippet): relocate parens

* refactor(OverflowMenu): ariaLabel to aria-label (NEW) (#13280)

* fix(CodeSnippet): a11y tabstop + attributes

* fix(CSS): add Carbon CSS to focus outline

* refactor(OverflowMenu): ariaLabel to aria-label NEW

* Delete CodeSnippet.js

error from a rebase/merge

* Delete _code-snippet.scss

error from rebase/merge

* revert(missingFiles): they'll be ignored on merge

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* chore(test): remove enzyme (#13316)

* test(accordion): refactor from enzyme to RTL

* chore(test): remove enzyme

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* refactor(CodeSnippet): ariaLabel to aria-label (#13274)

Co-authored-by: Taylor Jones <[email protected]>

* feat(TextArea): add warning state (#13293)

* feat(TextArea): add warning state

* chore: update snapshots

* fix: textarea error bottom border and default value in story

* chore: hide resize fluid textarea invalid and warn

---------

Co-authored-by: Andrea N. Cardona <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* refactor: convert TextAreaSkeleton to TypeScript (#13275)

* refactor: convert TextAreaSkeleton to TypeScript

* chore: remove unneeded omit

* chore: remove unneeded omit

---------

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* fix(batchToolTips): make tooltips on batch visible (#13328)

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* refactor(Notification): ariaLabel to aria-label (#13281)

* refactor(Notification): ariaLabel to aria-label

* fix(Notification): rm stories default dupes

* fix(InlineNotification): rm deprecated prop

---------

Co-authored-by: Francine Lucca <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

* fix(format): tsx formatting

---------

Signed-off-by: dependabot[bot] <[email protected]>
Co-authored-by: Jan Hassel <[email protected]>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
Co-authored-by: TJ Egan <[email protected]>
Co-authored-by: Alison Joseph <[email protected]>
Co-authored-by: Francine Lucca <[email protected]>
Co-authored-by: Bianca Sparxs <[email protected]>
Co-authored-by: carbon-automation[bot] <103539138+carbon-automation[bot]@users.noreply.github.com>
Co-authored-by: tay1orjones <[email protected]>
Co-authored-by: Andrea N. Cardona <[email protected]>
Co-authored-by: jpsorensen <[email protected]>
Co-authored-by: andrew <[email protected]>
Co-authored-by: Alessandra Davila <[email protected]>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Chris Knabe <[email protected]>
Co-authored-by: GalvinGao <[email protected]>
Co-authored-by: Francine Lucca <[email protected]>
Co-authored-by: remolueoend <[email protected]>
Co-authored-by: Alison Joseph <[email protected]>
Co-authored-by: Sierra Wetmore <[email protected]>
Co-authored-by: Austin <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants