Skip to content

Conversation

@GianoglioEnrico
Copy link
Contributor

Current Behavior

This PR modifies v0 Tooltip to match the one from v9.

To do this we've added a line-height property of 16px and we removed 1px borders around the Tooltip's content to make it height 28px on single line.
We have also changed the max-width from 246px to 240px to match the v9's Tooltip max width.

Schermata 2022-09-22 alle 15 26 09Schermata 2022-09-22 alle 15 27 23

New Behavior

Schermata 2022-09-22 alle 15 25 18Schermata 2022-09-22 alle 15 27 03

Related Issue(s)

Fixes #

@ghost
Copy link

ghost commented Sep 22, 2022

CLA assistant check
All CLA requirements met.

@codesandbox-ci
Copy link

codesandbox-ci bot commented Sep 22, 2022

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 0e71999:

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

@size-auditor
Copy link

size-auditor bot commented Sep 22, 2022

Asset size changes

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

Baseline commit: 770c5e1841f4f0c976c2d3295667d95e930f7e3b (build)

@fabricteam
Copy link
Collaborator

fabricteam commented Sep 22, 2022

📊 Bundle size report

🤖 This report was generated against 770c5e1841f4f0c976c2d3295667d95e930f7e3b

@fabricteam
Copy link
Collaborator

fabricteam commented Sep 22, 2022

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
TableMinimalPerf.default 988 326 3.03:1
RosterPerf.default 3078 1806 1.7:1
TableManyItemsPerf.default 2751 2161 1.27:1
TextAreaMinimalPerf.default 420 370 1.14:1
AvatarMinimalPerf.default 159 148 1.07:1
ButtonMinimalPerf.default 137 129 1.06:1
ImageMinimalPerf.default 332 320 1.04:1
SegmentMinimalPerf.default 291 281 1.04:1
AttachmentMinimalPerf.default 120 116 1.03:1
ButtonSlotsPerf.default 470 456 1.03:1
ChatMinimalPerf.default 610 592 1.03:1
ListWith60ListItems.default 509 493 1.03:1
LoaderMinimalPerf.default 555 539 1.03:1
MenuMinimalPerf.default 705 685 1.03:1
MenuButtonMinimalPerf.default 1430 1388 1.03:1
RefMinimalPerf.default 188 183 1.03:1
StatusMinimalPerf.default 570 553 1.03:1
TreeWith60ListItems.default 137 133 1.03:1
AttachmentSlotsPerf.default 956 933 1.02:1
ChatDuplicateMessagesPerf.default 232 228 1.02:1
CheckboxMinimalPerf.default 1777 1735 1.02:1
DialogMinimalPerf.default 645 635 1.02:1
DropdownManyItemsPerf.default 552 543 1.02:1
HeaderMinimalPerf.default 293 286 1.02:1
HeaderSlotsPerf.default 637 623 1.02:1
ItemLayoutMinimalPerf.default 991 971 1.02:1
ListCommonPerf.default 533 524 1.02:1
ListMinimalPerf.default 432 422 1.02:1
ListNestedPerf.default 462 455 1.02:1
RadioGroupMinimalPerf.default 369 361 1.02:1
VideoMinimalPerf.default 634 621 1.02:1
CardMinimalPerf.default 435 429 1.01:1
DividerMinimalPerf.default 294 292 1.01:1
FormMinimalPerf.default 313 311 1.01:1
SkeletonMinimalPerf.default 281 279 1.01:1
SplitButtonMinimalPerf.default 3682 3647 1.01:1
TreeMinimalPerf.default 690 686 1.01:1
BoxMinimalPerf.default 277 276 1:1
ButtonOverridesMissPerf.default 1117 1117 1:1
FlexMinimalPerf.default 232 233 1:1
GridMinimalPerf.default 278 277 1:1
ProviderMergeThemesPerf.default 1075 1073 1:1
ProviderMinimalPerf.default 339 339 1:1
SliderMinimalPerf.default 1334 1334 1:1
AlertMinimalPerf.default 219 222 0.99:1
DatepickerMinimalPerf.default 5384 5435 0.99:1
LabelMinimalPerf.default 315 319 0.99:1
LayoutMinimalPerf.default 288 291 0.99:1
TextMinimalPerf.default 284 287 0.99:1
InputMinimalPerf.default 957 974 0.98:1
TooltipMinimalPerf.default 1959 1992 0.98:1
AccordionMinimalPerf.default 116 120 0.97:1
ChatWithPopoverPerf.default 312 321 0.97:1
PortalMinimalPerf.default 137 141 0.97:1
ReactionMinimalPerf.default 297 307 0.97:1
CustomToolbarPrototype.default 2271 2346 0.97:1
ToolbarMinimalPerf.default 753 779 0.97:1
EmbedMinimalPerf.default 2996 3105 0.96:1
CarouselMinimalPerf.default 391 458 0.85:1
PopupMinimalPerf.default 556 766 0.73:1
DropdownMinimalPerf.default 2333 5092 0.46:1
AnimationMinimalPerf.default 440 1328 0.33:1
IconMinimalPerf.default 522 1651 0.32:1

@jurokapsiar
Copy link
Contributor

looks good to me :) please add changelog entry to packages/fluentui/CHANGELOG.md
(https://github.com/microsoft/fluentui/blob/master/packages/fluentui/CHANGELOG.md)

@bsunderhus bsunderhus merged commit dbb5e01 into microsoft:master Sep 27, 2022
marcosmoura added a commit to marcosmoura/fluentui that referenced this pull request Sep 28, 2022
* master: (21 commits)
  chore: Migrate react-avatar to use new build (microsoft#24969)
  applying package updates
  chore(react-input, react-textarea): Deprecating filled with shadow appearance variants (microsoft#24900)
  fix: v8 Dropdown no longer sets incorrect and unnecessary aria-activedescendant (microsoft#24593)
  feat: v0 Tooltip migration from v9 (microsoft#24908)
  chore: bump devDeps to fix critical security vulnerability (microsoft#24891)
  Fixing Tree chart issues (microsoft#24752)
  init: new package react-avatar-context (microsoft#24968)
  ci(.github): add issues write permisions to triage-bot worflow (microsoft#24963)
  applying package updates
  fix(Toolbar): close previous submenu when opening another submenu (microsoft#24836)
  fix: update non-focus-trap Popover role to be group (microsoft#24897)
  feat: Avatar's aria label includes 'active' or 'inactive' when using the active prop (microsoft#24901)
  feat(scripts): implement triage-bot module (microsoft#24911)
  chore: bump @octokit/rest to v18 (microsoft#24919)
  stress test: add "build-fixture" command (microsoft#24928)
  BREAKING-CHANGE: new ChatMessageContent for style caching (microsoft#24691)
  bugfix: fix changefile to properly update version of react-components with a patch (microsoft#24949)
  feat(scripts): enable strict checking for additional sub-folders(packages) (microsoft#24526)
  chore: exports DialogContent as unstable (microsoft#24943)
  ...
NotWoods pushed a commit to NotWoods/fluentui that referenced this pull request Nov 18, 2022
* Add line-height of 16px to v0 Tooltip content

* No borderSize to have height: 28px on v0 Tooltip

* Set max-width to 240px for v0 Tooltip

* Add changelog entry

Co-authored-by: Enrico <[email protected]>
@khmakoto khmakoto added Fluent UI react-northstar (v0) Work related to Fluent UI V0 and removed Fluent UI react-northstar labels Nov 30, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

9 participants