Skip to content

Conversation

@bsunderhus
Copy link
Contributor

@bsunderhus bsunderhus commented Apr 13, 2023

Previous Behavior

DialogTitle root element was a div by default. This conflicts with design spec.

New Behavior

  1. default DialogTitle root element as h2
  2. add styles to ensure no visual regressions

@bsunderhus bsunderhus self-assigned this Apr 13, 2023
@bsunderhus bsunderhus changed the title bugfix(react-dialog): DialogTitle root as h2 by default bugfix(react-dialog): DialogTitle root as h2 by default Apr 13, 2023
@github-actions github-actions bot added this to the April Project Cycle Q2 2023 milestone Apr 13, 2023
@codesandbox-ci
Copy link

codesandbox-ci bot commented Apr 13, 2023

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 29825a9:

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

@size-auditor
Copy link

size-auditor bot commented Apr 13, 2023

Asset size changes

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

Baseline commit: ae31ec4170f8e86ffa0e94166602a88ca226186d (build)

@fabricteam
Copy link
Collaborator

fabricteam commented Apr 13, 2023

📊 Bundle size report

Package & Exports Baseline (minified/GZIP) PR Change
react-dialog
Dialog (including children components)
93.319 kB
27.389 kB
93.53 kB
27.448 kB
211 B
59 B
Unchanged fixtures
Package & Exports Size (minified/GZIP)
react-components
react-components: Button, FluentProvider & webLightTheme
68.075 kB
18.416 kB
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover
207.606 kB
57.581 kB
react-components
react-components: FluentProvider & webLightTheme
38.778 kB
12.337 kB
react-portal-compat
PortalCompatProvider
6.446 kB
2.185 kB
🤖 This report was generated against ae31ec4170f8e86ffa0e94166602a88ca226186d

@fabricteam
Copy link
Collaborator

fabricteam commented Apr 13, 2023

Perf Analysis (@fluentui/react-components)

Scenario Render type Master Ticks PR Ticks Iterations Status
InfoButton mount 19 18 5000 Possible regression
All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 697 702 5000
Button mount 394 396 5000
Field mount 1201 1222 5000
FluentProvider mount 753 769 5000
FluentProviderWithTheme mount 110 102 10
FluentProviderWithTheme virtual-rerender 95 92 10
FluentProviderWithTheme virtual-rerender-with-unmount 108 106 10
InfoButton mount 19 18 5000 Possible regression
MakeStyles mount 1189 1145 50000
Persona mount 1865 1818 5000
SpinButton mount 1486 1484 5000

@bsunderhus bsunderhus marked this pull request as ready for review April 13, 2023 13:38
@bsunderhus bsunderhus requested a review from a team as a code owner April 13, 2023 13:38
@bsunderhus bsunderhus requested a review from smhigley April 13, 2023 13:38
@@ -0,0 +1,7 @@
{
Copy link
Contributor

Choose a reason for hiding this comment

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

@bsunderhus Quite a few visual changes, likely due to different margins on h2 vs div.

I wouldn't expect any visual changes. Do styles need to be updated to get the layout back to baseline?

@bsunderhus bsunderhus force-pushed the react-dialog/bufix--DialogTitle-root-defaults-to-h2 branch from 46f2a6b to f2ba569 Compare April 13, 2023 16:19
@bsunderhus bsunderhus marked this pull request as draft April 13, 2023 16:21
@fabricteam
Copy link
Collaborator

fabricteam commented Apr 13, 2023

🕵 fluentuiv9 No visual regressions between this PR and main

@bsunderhus bsunderhus marked this pull request as ready for review April 13, 2023 16:50
@bsunderhus bsunderhus requested a review from spmonahan April 13, 2023 16:50
@bsunderhus
Copy link
Contributor Author

🕵 fluentuiv9 No visual regressions between this PR and main

All solved @spmonahan 👍🏻

@bsunderhus bsunderhus merged commit b287dc6 into microsoft:master Apr 21, 2023
@bsunderhus bsunderhus deleted the react-dialog/bufix--DialogTitle-root-defaults-to-h2 branch April 21, 2023 12:25
marcosmoura added a commit to marcosmoura/fluentui that referenced this pull request Apr 24, 2023
* master: (58 commits)
  fix(react-datepicker-compat): Make onValidationError onValidationResult so the error is updated when there's no longer an error (microsoft#27655)
  Fix `@fluentui/react-portal-compat`: to be compatible with React 18 (microsoft#27577)
  chore: fix versions of @fluentui/react-datepicker-compat (microsoft#27666)
  applying package updates
  applying package updates
  Make line chart screen reader accessible (microsoft#27632)
  fix(react-examples): Improve keyboard navigation in ContextualMenu.CustomMenuList (microsoft#25172)
  docs(react-textarea): Update examples to use Field (microsoft#27644)
  bugfix(react-dialog): `DialogTitle` root as `h2` by default (microsoft#27555)
  applying package updates
  chore: restructure stories, add separate category for flat tree (microsoft#27586)
  fix document link (microsoft#27499)
  fix(react): exclude React.HTMLAttributes defined `content` prop for Tooltip and TooltipHost Prop types to mitigate @types/react breaking changes (microsoft#27467)
  chore(react-tabs): adopts custom JSX pragma (microsoft#27640)
  fix: ContextualMenuSplitButton always sets aria-checked (does not leave it undefined) when it is checkable (microsoft#27650)
  feat(react-datepicker-compat): Move DatePicker compat to stable (microsoft#27378)
  bugfix(react-tree): fix parent navigation after independency from id (microsoft#27642)
  applying package updates
  feat(react-datepicker-compat): Add error handling to DatePicker and update popup's padding (microsoft#27637)
  feat(public-docsite): Add banner to React component pages to promote v9 (microsoft#27557)
  ...
marcosmoura pushed a commit to marcosmoura/fluentui that referenced this pull request Apr 25, 2023
…t#27555)

* bugfix(react-dialog): DialogTitle root as h2 by default

* Update packages/react-components/react-dialog/src/components/DialogTitle/DialogTitle.types.ts
marcosmoura added a commit to marcosmoura/fluentui that referenced this pull request Apr 25, 2023
* feat/drawer-components: (81 commits)
  docs: remove TODO marks
  fix: remove conflict code leftover
  applying package updates
  microsoft#25730: TimePicker Default Value Fix, Controllable Usage, Example Updates (microsoft#26482)
  docs(react-datepicker-compat): Add description to README.md (microsoft#27677)
  Updated to use single hook selector (microsoft#27491)
  fix: Make border around Avatar's badge transparent using a mask (microsoft#27527)
  Disable focus on non-interactive elements (microsoft#27580)
  feat(react-drawer): implement "prevent close on click outside" feature (microsoft#27551)
  fix(react-datepicker-compat): Make onValidationError onValidationResult so the error is updated when there's no longer an error (microsoft#27655)
  Fix `@fluentui/react-portal-compat`: to be compatible with React 18 (microsoft#27577)
  chore: fix versions of @fluentui/react-datepicker-compat (microsoft#27666)
  applying package updates
  applying package updates
  Make line chart screen reader accessible (microsoft#27632)
  fix(react-examples): Improve keyboard navigation in ContextualMenu.CustomMenuList (microsoft#25172)
  docs(react-textarea): Update examples to use Field (microsoft#27644)
  bugfix(react-dialog): `DialogTitle` root as `h2` by default (microsoft#27555)
  applying package updates
  chore: restructure stories, add separate category for flat tree (microsoft#27586)
  ...
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