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(react-infobutton): Cursor should be pointer when hovering the button to show it's a button #28893

Merged
merged 2 commits into from
Aug 17, 2023

Conversation

sopranopillow
Copy link
Contributor

@sopranopillow sopranopillow commented Aug 16, 2023

Previous Behavior

The cursor when hovering over the button was default (as per native behavior).

Recording.2023-08-16.162557.mp4

New Behavior

To show that the icon is in fact a button that can be pressed, the cursor should be pointer. This should help differentiate the behavior between the tooltip variant and the popover variant.

Recording.2023-08-16.162521.mp4

@sopranopillow sopranopillow self-assigned this Aug 16, 2023
@sopranopillow sopranopillow requested a review from a team as a code owner August 16, 2023 23:22
@fabricteam
Copy link
Collaborator

Perf Analysis (@fluentui/react-components)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 633 627 5000
Button mount 313 329 5000
Field mount 1099 1082 5000
FluentProvider mount 686 686 5000
FluentProviderWithTheme mount 75 78 10
FluentProviderWithTheme virtual-rerender 72 66 10
FluentProviderWithTheme virtual-rerender-with-unmount 79 77 10
InfoButton mount 14 11 5000
MakeStyles mount 832 869 50000
Persona mount 1731 1682 5000
SpinButton mount 1370 1334 5000

@codesandbox-ci
Copy link

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit c682d95:

Sandbox Source
@fluentui/react 8 starter Configuration
@fluentui/react-components 9 starter Configuration

@fabricteam
Copy link
Collaborator

📊 Bundle size report

Package & Exports Baseline (minified/GZIP) PR Change
react-infobutton
InfoButton
125.224 kB
39.235 kB
125.275 kB
39.26 kB
51 B
25 B
react-infobutton
InfoLabel
128.894 kB
40.413 kB
128.945 kB
40.437 kB
51 B
24 B
Unchanged fixtures
Package & Exports Size (minified/GZIP)
react-components
react-components: Button, FluentProvider & webLightTheme
66.614 kB
18.512 kB
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover
203.017 kB
57.615 kB
react-components
react-components: FluentProvider & webLightTheme
37.787 kB
12.387 kB
react-portal-compat
PortalCompatProvider
6.48 kB
2.203 kB
🤖 This report was generated against ed6746714cdd00f88e292e04d87d38692c838a94

@size-auditor
Copy link

size-auditor bot commented Aug 16, 2023

Asset size changes

Size Auditor did not detect a change in bundle size for any component!

Baseline commit: ed6746714cdd00f88e292e04d87d38692c838a94 (build)

@fabricteam
Copy link
Collaborator

🕵 fluentuiv9 No visual regressions between this PR and main

@sopranopillow sopranopillow merged commit 7899bcf into microsoft:master Aug 17, 2023
21 checks passed
@sopranopillow sopranopillow deleted the infobutton-cursor branch August 17, 2023 15:22
marcosmoura added a commit to marcosmoura/fluentui that referenced this pull request Aug 17, 2023
* master: (66 commits)
  fix(react-infobutton): Cursor should be pointer when hovering the button to show it's a button (microsoft#28893)
  chore(react-tags-preview): add docs  (microsoft#28899)
  applying package updates
  fix(react-tree): stablilize `handleActionsRef` created by TreeItem (microsoft#28896)
  bugfix: headless flat tree itemType manual definition (microsoft#28898)
  doc(react-tree): adds a11y edge cases to the docs (microsoft#28897)
  Update DatePickerDescription.md with note about compat components (microsoft#28882)
  chore(react-tree): removes preview warning from the docs (microsoft#28886)
  applying package updates
  fix(public-docsite): Remove image clipping and move top banner under top nav to avoid header issues (microsoft#28885)
  feat(react-tree): stable release (microsoft#28845)
  Virtualizer: Merge scrollref prop with container ref (microsoft#28829)
  chore(react-jsx-runtime): release stable version (microsoft#28880)
  applying package updates
  fix(react-tags-preview): style update - tag hover style should only be on dismiss icon (microsoft#28791)
  applying package updates
  feat(public-docsite): Add topbanner component and use it in the public docsite (microsoft#28870)
  feat: Add VivaEngageIcon to @fluentui/react-icons-mdl2 package (microsoft#28804)
  docs: Remove InfoButton stories in favor of having only InfoLabel stories. (microsoft#28856)
  Added more CY and VR tests to the Breadcrumb  (microsoft#28790)
  ...
marcosmoura added a commit to marcosmoura/fluentui that referenced this pull request Aug 17, 2023
* master: (66 commits)
  fix(react-infobutton): Cursor should be pointer when hovering the button to show it's a button (microsoft#28893)
  chore(react-tags-preview): add docs  (microsoft#28899)
  applying package updates
  fix(react-tree): stablilize `handleActionsRef` created by TreeItem (microsoft#28896)
  bugfix: headless flat tree itemType manual definition (microsoft#28898)
  doc(react-tree): adds a11y edge cases to the docs (microsoft#28897)
  Update DatePickerDescription.md with note about compat components (microsoft#28882)
  chore(react-tree): removes preview warning from the docs (microsoft#28886)
  applying package updates
  fix(public-docsite): Remove image clipping and move top banner under top nav to avoid header issues (microsoft#28885)
  feat(react-tree): stable release (microsoft#28845)
  Virtualizer: Merge scrollref prop with container ref (microsoft#28829)
  chore(react-jsx-runtime): release stable version (microsoft#28880)
  applying package updates
  fix(react-tags-preview): style update - tag hover style should only be on dismiss icon (microsoft#28791)
  applying package updates
  feat(public-docsite): Add topbanner component and use it in the public docsite (microsoft#28870)
  feat: Add VivaEngageIcon to @fluentui/react-icons-mdl2 package (microsoft#28804)
  docs: Remove InfoButton stories in favor of having only InfoLabel stories. (microsoft#28856)
  Added more CY and VR tests to the Breadcrumb  (microsoft#28790)
  ...
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants