Skip to content

Conversation

@mltejera
Copy link
Contributor

Looks like a couple components were missed when added to the custom style hook.

This PR adds them so down stream partners can fiddle with the styles with the context.

@mltejera mltejera requested a review from a team as a code owner March 22, 2023 21:10
@mltejera mltejera requested a review from GeoffCoxMSFT March 22, 2023 21:11
@fabricteam
Copy link
Collaborator

fabricteam commented Mar 22, 2023

📊 Bundle size report

Package & Exports Baseline (minified/GZIP) PR Change
react-accordion
Accordion (including children components)
88.759 kB
26.531 kB
88.882 kB
26.551 kB
123 B
20 B
react-alert
Alert
96.524 kB
23.109 kB
96.647 kB
23.133 kB
123 B
24 B
react-avatar
Avatar
60.189 kB
15.557 kB
60.312 kB
15.579 kB
123 B
22 B
react-avatar
AvatarGroup
18.059 kB
6.662 kB
18.178 kB
6.683 kB
119 B
21 B
react-avatar
AvatarGroupItem
76.45 kB
20.063 kB
76.573 kB
20.086 kB
123 B
23 B
react-badge
Badge
25.731 kB
7.563 kB
25.85 kB
7.585 kB
119 B
22 B
react-badge
CounterBadge
26.71 kB
7.868 kB
26.833 kB
7.889 kB
123 B
21 B
react-badge
PresenceBadge
34.335 kB
8.67 kB
34.458 kB
8.693 kB
123 B
23 B
react-button
Button
39.626 kB
9.937 kB
39.749 kB
9.959 kB
123 B
22 B
react-button
CompoundButton
46.798 kB
11.407 kB
46.921 kB
11.428 kB
123 B
21 B
react-button
MenuButton
44.314 kB
11.253 kB
44.437 kB
11.306 kB
123 B
53 B
react-button
SplitButton
52.808 kB
12.848 kB
52.931 kB
12.872 kB
123 B
24 B
react-button
ToggleButton
57.998 kB
11.857 kB
58.121 kB
11.878 kB
123 B
21 B
react-checkbox
Checkbox
35.894 kB
10.818 kB
36.017 kB
10.84 kB
123 B
22 B
react-checkbox
CheckboxField
42.846 kB
12.755 kB
42.969 kB
12.782 kB
123 B
27 B
react-combobox
Combobox (including child components)
88.607 kB
28.083 kB
88.73 kB
28.105 kB
123 B
22 B
react-combobox
ComboboxField
85.024 kB
27.853 kB
85.147 kB
27.871 kB
123 B
18 B
react-combobox
Dropdown (including child components)
87.305 kB
27.826 kB
87.428 kB
27.853 kB
123 B
27 B
react-components
react-components: Button, FluentProvider & webLightTheme
67.372 kB
18.188 kB
67.495 kB
18.211 kB
123 B
23 B
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover
206.778 kB
57.319 kB
206.901 kB
57.339 kB
123 B
20 B
react-components
react-components: FluentProvider & webLightTheme
38.201 kB
12.128 kB
38.32 kB
12.15 kB
119 B
22 B
react-dialog
Dialog (including children components)
92.852 kB
27.25 kB
92.975 kB
27.27 kB
123 B
20 B
react-divider
Divider
19.744 kB
6.675 kB
19.863 kB
6.697 kB
119 B
22 B
react-field
Field
20.429 kB
7.073 kB
20.552 kB
7.092 kB
123 B
19 B
react-image
Image
13.892 kB
4.971 kB
14.011 kB
4.993 kB
119 B
22 B
react-infobutton
InfoButton
130.478 kB
39.417 kB
130.601 kB
39.438 kB
123 B
21 B
react-infobutton
InfoLabel
133.782 kB
40.466 kB
133.901 kB
40.489 kB
119 B
23 B
react-input
Input
25.624 kB
7.675 kB
25.747 kB
7.697 kB
123 B
22 B
react-input
InputField
35.6 kB
10.615 kB
35.723 kB
10.637 kB
123 B
22 B
react-label
Label
12.451 kB
4.563 kB
12.57 kB
4.586 kB
119 B
23 B
react-menu
Menu (including children components)
130.803 kB
39.605 kB
130.926 kB
39.629 kB
123 B
24 B
react-menu
Menu (including selectable components)
133.939 kB
40.139 kB
134.062 kB
40.161 kB
123 B
22 B
react-persona
Persona
67.215 kB
17.502 kB
67.338 kB
17.524 kB
123 B
22 B
react-popover
Popover
117.457 kB
35.806 kB
117.58 kB
35.828 kB
123 B
22 B
react-progress
ProgressBar
15.842 kB
5.652 kB
15.961 kB
5.675 kB
119 B
23 B
react-progress
ProgressField
26.312 kB
8.835 kB
26.435 kB
8.859 kB
123 B
24 B
react-provider
FluentProvider
20.148 kB
6.903 kB
20.267 kB
6.927 kB
119 B
24 B
react-radio
Radio
35.361 kB
11.103 kB
35.48 kB
11.126 kB
119 B
23 B
react-radio
RadioGroup
17.865 kB
6.522 kB
17.988 kB
6.544 kB
123 B
22 B
react-radio
RadioGroupField
28.043 kB
9.712 kB
28.166 kB
9.735 kB
123 B
23 B
react-select
Select
26.834 kB
8.742 kB
26.957 kB
8.766 kB
123 B
24 B
react-select
SelectField
36.17 kB
11.294 kB
36.293 kB
11.316 kB
123 B
22 B
react-slider
Slider
35.796 kB
11.036 kB
35.919 kB
11.059 kB
123 B
23 B
react-slider
SliderField
45.724 kB
13.983 kB
45.847 kB
14.005 kB
123 B
22 B
react-spinbutton
SpinButton
35.525 kB
10.327 kB
35.648 kB
10.348 kB
123 B
21 B
react-spinbutton
SpinButtonField
44.548 kB
12.792 kB
44.671 kB
12.812 kB
123 B
20 B
react-spinner
Spinner
23.306 kB
7.172 kB
23.425 kB
7.195 kB
119 B
23 B
react-switch
Switch
31.294 kB
9.274 kB
31.413 kB
9.294 kB
119 B
20 B
react-switch
SwitchField
38.194 kB
11.188 kB
38.317 kB
11.21 kB
123 B
22 B
react-table
DataGrid
149.705 kB
40.623 kB
149.828 kB
40.646 kB
123 B
23 B
react-table
Table (Primitives only)
47 kB
12.681 kB
47.119 kB
12.703 kB
119 B
22 B
react-table
Table as DataGrid
137.845 kB
35.252 kB
137.968 kB
35.272 kB
123 B
20 B
react-table
Table (Selection only)
85.68 kB
21.276 kB
85.799 kB
21.299 kB
119 B
23 B
react-table
Table (Sort only)
85.01 kB
21.086 kB
85.129 kB
21.109 kB
119 B
23 B
react-text
Text - Default
14.899 kB
5.308 kB
15.018 kB
5.327 kB
119 B
19 B
react-textarea
Textarea
28.951 kB
9.058 kB
29.07 kB
9.081 kB
119 B
23 B
react-textarea
TextareaField
39.331 kB
12.033 kB
39.454 kB
12.055 kB
123 B
22 B
react-tooltip
Tooltip
49.265 kB
16.793 kB
49.388 kB
16.815 kB
123 B
22 B
Unchanged fixtures
Package & Exports Size (minified/GZIP)
react-card
Card - All
83.489 kB
23.894 kB
react-card
Card
78.308 kB
22.431 kB
react-card
CardFooter
9.035 kB
3.799 kB
react-card
CardHeader
10.959 kB
4.503 kB
react-card
CardPreview
9.84 kB
4.153 kB
react-link
Link
12.301 kB
5.07 kB
react-portal
Portal
11.649 kB
4.263 kB
react-portal-compat
PortalCompatProvider
6.446 kB
2.185 kB
react-positioning
usePositioning
24.008 kB
8.798 kB
react-text
Text - Wrappers
15.572 kB
5.23 kB
🤖 This report was generated against 77bb9ec1eeedef91315dee3750bd06b15168c693

@size-auditor
Copy link

size-auditor bot commented Mar 22, 2023

Asset size changes

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

Baseline commit: 77bb9ec1eeedef91315dee3750bd06b15168c693 (build)

@khmakoto
Copy link
Member

khmakoto commented Mar 22, 2023

You need to build that package so the API file updates accordingly:

yarn workspace @fluentui/react-shared-contexts build

@fabricteam
Copy link
Collaborator

fabricteam commented Mar 22, 2023

🕵 fluentuiv9 No visual regressions between this PR and main

@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 20c62f6:

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

@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 1073 1049 5000
Button mount 667 662 5000
Field mount 1933 1910 5000
FluentProvider mount 1350 1345 5000
FluentProviderWithTheme mount 346 352 10
FluentProviderWithTheme virtual-rerender 267 275 10
FluentProviderWithTheme virtual-rerender-with-unmount 345 344 10
InfoButton mount 247 235 5000
MakeStyles mount 1510 1544 50000
Persona mount 2664 2608 5000
SpinButton mount 2299 2308 5000

@khmakoto khmakoto merged commit 925c9e7 into master Mar 23, 2023
@layershifter layershifter deleted the user/matejera/add-card-styles-to-context-hook branch March 23, 2023 08:54
@layershifter
Copy link
Member

image

This is not great 😭 @GeoffCoxMSFT were you able to check #27139?

marcosmoura added a commit to marcosmoura/fluentui that referenced this pull request Mar 27, 2023
* master: (47 commits)
  fix: Fix vertical alignment of inline Checkbox when checked vs. unchecked (microsoft#27324)
  applying package updates
  Fix: Revert microsoft#26931 change due to new bug it introduced (microsoft#27323)
  chore(react-infobutton): Renaming content slot to info (microsoft#27316)
  applying package updates
  Fix bad release mismatch of react-select (microsoft#27321)
  applying package updates
  Fix react-combobox mismatch after bad release (microsoft#27319)
  docs: add section about media query sorting (microsoft#27307)
  applying package updates
  fix: sync packages and changefiles after bad release (microsoft#27317)
  applying package updates
  chore(react-datepicker-compat): Cleanup types, unused code, and restore utils tests (microsoft#27297)
  [Fluent 2 Theme] Fixing link color in dark theme (microsoft#27203)
  Tree documentation and stories (microsoft#27270)
  feat: Render theme CSS variables in SSR style element (microsoft#27277)
  chore (scripts): update create-package plop templates to use swc/helpers in deps (microsoft#27286)
  fix(DialogContent): adds padding to allow focus visibility (microsoft#27248)
  Adding Card component style hooks to shared context (microsoft#27295)
  Virtualizer: Static scroll hooks and embedded scrollview (microsoft#26985)
  ...
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.

8 participants