fluentui
fluentui copied to clipboard
chore: migrate v9 and tools to nx inferred tasks
Previous Behavior
New Behavior
plugin perf
| State | Execution Timings: workspace-plugin |
|---|---|
| current (no caching) | 27.25 s |
| perf improvement v1 (no caching) | 0.09s / 𝚫 99.7% FASTER |
| perf improvement v2 (with caching) | TBA |
Related Issue(s)
- Fixes #
📊 Bundle size report
| Package & Exports | Baseline (minified/GZIP) | PR | Change |
|---|---|---|---|
| keyboard-keys Multiple keyCodes |
0 B0 B |
50 B70 B |
🆕 New entry |
| keyboard-keys Multiple keys |
0 B0 B |
87 B94 B |
🆕 New entry |
| keyboard-keys Single key |
0 B0 B |
44 B64 B |
🆕 New entry |
| keyboard-keys Single keyCode |
0 B0 B |
39 B59 B |
🆕 New entry |
| react-aria ARIA - Default |
0 B0 B |
237 B181 B |
🆕 New entry |
| react-teaching-popover TeachingPopover |
0 B0 B |
90.611 kB27.593 kB |
🆕 New entry |
| react-tree FlatTree |
0 B0 B |
145.048 kB41.691 kB |
🆕 New entry |
| react-tree PersonaFlatTree |
0 B0 B |
145.736 kB41.798 kB |
🆕 New entry |
| react-tree PersonaTree |
0 B0 B |
141.967 kB40.615 kB |
🆕 New entry |
| react-tree Tree |
0 B0 B |
141.279 kB40.522 kB |
🆕 New entry |
Unchanged fixtures
| Package & Exports | Size (minified/GZIP) |
|---|---|
| global-context createContext |
510 B328 B |
| global-context createContextSelector |
537 B339 B |
| keyboard-key keyboard-key package |
3.746 kB1.928 kB |
| priority-overflow createOverflowManager |
4.457 kB1.856 kB |
| react ActivityItem |
71.236 kB23.357 kB |
| react Announced |
38.493 kB13.297 kB |
| react Autofill |
15.428 kB4.768 kB |
| react Breadcrumb |
202.406 kB60.482 kB |
| react Button |
195.858 kB56.697 kB |
| react ButtonGrid |
180.792 kB54.683 kB |
| react Calendar |
121.905 kB37.046 kB |
| react Callout |
84.33 kB27.648 kB |
| react Check |
53.204 kB17.848 kB |
| react Checkbox |
59.985 kB19.903 kB |
| react ChoiceGroup |
65.494 kB21.489 kB |
| react ChoiceGroupOption |
58.767 kB19.362 kB |
| react Coachmark |
93.151 kB29.428 kB |
| react Color |
7.789 kB3.127 kB |
| react ColorPicker |
135.359 kB42.257 kB |
| react ComboBox |
252.295 kB72.392 kB |
| react CommandBar |
203.447 kB60.224 kB |
| react ContextualMenu |
155.273 kB48.228 kB |
| react DatePicker |
184.333 kB56.194 kB |
| react DateTimeUtilities |
5.244 kB1.849 kB |
| react DetailsList |
230.107 kB65.952 kB |
| react Dialog |
211.784 kB63.237 kB |
| react Divider |
19.603 kB6.845 kB |
| react DocumentCard |
217.399 kB64.512 kB |
| react DragDrop |
8.343 kB2.724 kB |
| react DraggableZone |
34.305 kB11.509 kB |
| react Dropdown |
234.345 kB68.729 kB |
| react ExtendedPicker |
96.924 kB27.92 kB |
| react Fabric |
41.745 kB14.366 kB |
| react Facepile |
210.998 kB63.254 kB |
| react FloatingPicker |
242.44 kB69.088 kB |
| react FocusTrapZone |
17.03 kB5.924 kB |
| react FocusZone |
55.182 kB17.503 kB |
| react Grid |
180.792 kB54.683 kB |
| react GroupedList |
135.178 kB40.798 kB |
| react GroupedListV2 |
122.767 kB37.881 kB |
| react HoverCard |
97.179 kB30.82 kB |
| react Icon |
51.885 kB17.272 kB |
| react Icons |
66.361 kB24.397 kB |
| react Image |
46.904 kB15.707 kB |
| react Keytip |
81.693 kB26.766 kB |
| react KeytipData |
14.039 kB4.588 kB |
| react KeytipLayer |
103.478 kB32.017 kB |
| react Keytips |
106.25 kB33.023 kB |
| react Label |
38.347 kB13.257 kB |
| react Layer |
48.099 kB16.367 kB |
| react Link |
39.682 kB13.67 kB |
| react List |
39.4 kB12.481 kB |
| react MarqueeSelection |
74.541 kB22.44 kB |
| react MessageBar |
190.922 kB57.155 kB |
| react Modal |
93.747 kB30.278 kB |
| react Nav |
188.398 kB56.575 kB |
| react OverflowSet |
33.393 kB11.329 kB |
| react Overlay |
40.902 kB14.095 kB |
| react Panel |
201.456 kB60.076 kB |
| react Persona |
114.967 kB36.546 kB |
| react PersonaCoin |
114.967 kB36.546 kB |
| react PersonaPresence |
58.074 kB19.384 kB |
| react Pickers |
294.462 kB82.501 kB |
| react Pivot |
189.29 kB57.329 kB |
| react Popup |
12.294 kB4.195 kB |
| react Positioning |
22.807 kB7.701 kB |
| react PositioningContainer |
73.85 kB23.765 kB |
| react ProgressIndicator |
39.504 kB13.554 kB |
| react Rating |
82.143 kB26.144 kB |
| react Fluent UI React (entire library) |
1.015 MB282.181 kB |
| react ResizeGroup |
13.338 kB4.377 kB |
| react ResponsiveMode |
8.13 kB2.966 kB |
| react ScrollablePane |
55.563 kB17.734 kB |
| react SearchBox |
189.171 kB56.737 kB |
| react SelectableOption |
724 B413 B |
| react SelectedItemsList |
232.95 kB67.977 kB |
| react Selection |
42.464 kB12.301 kB |
| react Separator |
35.384 kB12.146 kB |
| react Shimmer |
49.259 kB16.268 kB |
| react ShimmeredDetailsList |
240.889 kB68.7 kB |
| react Slider |
57.651 kB19.217 kB |
| react SpinButton |
192.874 kB57.835 kB |
| react Spinner |
41.777 kB14.478 kB |
| react Stack |
41.734 kB14.268 kB |
| react Sticky |
32.613 kB10.509 kB |
| react Styling |
46.033 kB15.135 kB |
| react SwatchColorPicker |
191.177 kB58.196 kB |
| react TeachingBubble |
206.173 kB61.106 kB |
| react Text |
36.908 kB12.822 kB |
| react TextField |
80.816 kB25.332 kB |
| react Theme |
43.501 kB14.183 kB |
| react ThemeGenerator |
12.392 kB4.126 kB |
| react TimePicker |
242.077 kB70.14 kB |
| react Toggle |
46.225 kB15.986 kB |
| react Tooltip |
87.456 kB28.268 kB |
| react Utilities |
82.931 kB25.148 kB |
| react Viewport |
23.888 kB7.656 kB |
| react WeeklyDayPicker |
102.058 kB31.861 kB |
| react WindowProvider |
1.059 kB541 B |
| react-accordion Accordion (including children components) |
106.728 kB32.718 kB |
| react-avatar Avatar |
49.303 kB15.815 kB |
| react-avatar AvatarGroup |
20.106 kB7.968 kB |
| react-avatar AvatarGroupItem |
63.447 kB20.034 kB |
| react-badge Badge |
25.954 kB8.595 kB |
| react-badge CounterBadge |
26.733 kB8.872 kB |
| react-badge PresenceBadge |
25.719 kB9.457 kB |
| react-breadcrumb @fluentui/react-breadcrumb - package |
114.291 kB31.695 kB |
| react-button Button |
37.174 kB10.803 kB |
| react-button CompoundButton |
43.588 kB12.101 kB |
| react-button MenuButton |
41.989 kB12.144 kB |
| react-button SplitButton |
50.006 kB13.716 kB |
| react-button ToggleButton |
53.107 kB12.561 kB |
| react-calendar-compat Calendar Compat |
150.095 kB40.026 kB |
| react-card Card - All |
101.77 kB28.772 kB |
| react-card Card |
94.544 kB26.951 kB |
| react-card CardFooter |
14.355 kB5.79 kB |
| react-card CardHeader |
16.888 kB6.669 kB |
| react-card CardPreview |
14.42 kB5.922 kB |
| react-checkbox Checkbox |
35.118 kB12.077 kB |
| react-combobox Combobox (including child components) |
104.383 kB34.197 kB |
| react-combobox Dropdown (including child components) |
104.996 kB34.122 kB |
| react-components react-components: Button, FluentProvider & webLightTheme |
69.21 kB20.174 kB |
| react-components react-components: Accordion, Button, FluentProvider, Image, Menu, Popover |
220.616 kB63.902 kB |
| react-components react-components: FluentProvider & webLightTheme |
44.447 kB14.59 kB |
| react-components react-components: entire library |
1.16 MB290.619 kB |
| react-datepicker-compat DatePicker Compat |
224.165 kB63.423 kB |
| react-dialog Dialog (including children components) |
100.297 kB30.076 kB |
| react-divider Divider |
21.328 kB7.953 kB |
| react-field Field |
23.399 kB8.898 kB |
| react-image Image |
15.36 kB6.236 kB |
| react-input Input |
28.014 kB9.444 kB |
| react-jsx-runtime Classic Pragma |
1.057 kB530 B |
| react-jsx-runtime JSX Dev Runtime |
3.771 kB1.643 kB |
| react-jsx-runtime JSX Runtime |
4.367 kB1.874 kB |
| react-label Label |
14.671 kB5.99 kB |
| react-link Link |
17.326 kB7.032 kB |
| react-list-preview List |
89.148 kB26.597 kB |
| react-list-preview ListItem |
112.707 kB33.428 kB |
| react-menu Menu (including children components) |
152.661 kB46.116 kB |
| react-menu Menu (including selectable components) |
155.342 kB46.598 kB |
| react-message-bar MessageBar (all components) |
24.878 kB9.264 kB |
| react-motion @fluentui/react-motion - createMotionComponent() |
4.303 kB1.899 kB |
| react-motion @fluentui/react-motion - createPresenceComponent() |
5.038 kB2.229 kB |
| react-motion @fluentui/react-motion - PresenceGroup |
1.714 kB819 B |
| react-northstar Accordion |
85.38 kB26.519 kB |
| react-northstar Alert |
87.435 kB26.905 kB |
| react-northstar Animation |
55.331 kB17.83 kB |
| react-northstar Attachment |
86.829 kB26.7 kB |
| react-northstar Avatar |
80.264 kB24.633 kB |
| react-northstar Box |
75.233 kB23.813 kB |
| react-northstar Breadcrumb |
79.908 kB24.717 kB |
| react-northstar Button |
83.145 kB25.952 kB |
| react-northstar Card |
82.693 kB25.037 kB |
| react-northstar Carousel |
105.17 kB31.873 kB |
| react-northstar Chat |
154.072 kB46.878 kB |
| react-northstar Checkbox |
79.792 kB25.08 kB |
| react-northstar Datepicker |
186.639 kB56.99 kB |
| react-northstar Debug |
8.801 kB3.594 kB |
| react-northstar Design |
36.589 kB12.067 kB |
| react-northstar Dialog |
112.046 kB33.622 kB |
| react-northstar Divider |
76.604 kB24.135 kB |
| react-northstar Dropdown |
198.196 kB60.223 kB |
| react-northstar Embed |
81.465 kB25.425 kB |
| react-northstar Flex |
47.716 kB15.443 kB |
| react-northstar Form |
92.515 kB28.888 kB |
| react-northstar Grid |
70.569 kB22.283 kB |
| react-northstar Header |
74.741 kB23.465 kB |
| react-northstar Image |
73.576 kB23.333 kB |
| react-northstar Input |
88.334 kB27.781 kB |
| react-northstar ItemLayout |
78.213 kB24.457 kB |
| react-northstar Label |
77.905 kB24.414 kB |
| react-northstar Layout |
75.378 kB23.803 kB |
| react-northstar List |
88.475 kB27.555 kB |
| react-northstar Loader |
78.601 kB24.733 kB |
| react-northstar Menu |
128.587 kB40.738 kB |
| react-northstar MenuButton |
162.993 kB49.614 kB |
| react-northstar Pill |
83.707 kB26.069 kB |
| react-northstar Popup |
135.304 kB42.259 kB |
| react-northstar Portal |
58.326 kB18.851 kB |
| react-northstar Provider |
93.129 kB29.627 kB |
| react-northstar RadioGroup |
83.27 kB26.053 kB |
| react-northstar Reaction |
77.265 kB24.128 kB |
| react-northstar Segment |
76.194 kB23.896 kB |
| react-northstar Skeleton |
77.75 kB24.205 kB |
| react-northstar Slider |
84.258 kB26.757 kB |
| react-northstar SplitButton |
178.231 kB53.438 kB |
| react-northstar Status |
76.257 kB24.054 kB |
| react-northstar SvgIcon |
36.811 kB11.746 kB |
| react-northstar Table |
80.784 kB25.157 kB |
| react-northstar Text |
74.099 kB23.511 kB |
| react-northstar TextArea |
74.233 kB23.496 kB |
| react-northstar Toolbar |
175.042 kB52.844 kB |
| react-northstar Tooltip |
109.961 kB35.238 kB |
| react-northstar Tree |
87.84 kB27.223 kB |
| react-northstar Video |
75.399 kB23.796 kB |
| react-overflow hooks only |
12.808 kB4.819 kB |
| react-persona Persona |
56.194 kB17.695 kB |
| react-popover Popover |
128.904 kB40.314 kB |
| react-portal Portal |
14.563 kB5.118 kB |
| react-portal-compat PortalCompatProvider |
8.39 kB2.64 kB |
| react-positioning usePositioning |
27.057 kB9.698 kB |
| react-progress ProgressBar |
17.084 kB6.891 kB |
| react-provider FluentProvider |
24.623 kB8.893 kB |
| react-radio Radio |
32.672 kB10.343 kB |
| react-radio RadioGroup |
15.762 kB6.423 kB |
| react-select Select |
27.732 kB10.124 kB |
| react-slider Slider |
37.169 kB12.538 kB |
| react-spinbutton SpinButton |
36.06 kB11.815 kB |
| react-spinner Spinner |
25.245 kB8.539 kB |
| react-swatch-picker @fluentui/react-swatch-picker - package |
104.258 kB30.231 kB |
| react-switch Switch |
35.319 kB11.314 kB |
| react-table DataGrid |
161.034 kB45.71 kB |
| react-table Table (Primitives only) |
42.666 kB13.854 kB |
| react-table Table as DataGrid |
131.869 kB36.57 kB |
| react-table Table (Selection only) |
70.536 kB19.999 kB |
| react-table Table (Sort only) |
69.179 kB19.61 kB |
| react-tag-picker @fluentui/react-tag-picker - package |
184.091 kB55.425 kB |
| react-tags InteractionTag |
15.199 kB6.157 kB |
| react-tags Tag |
29.016 kB9.524 kB |
| react-tags TagGroup |
82.719 kB24.524 kB |
| react-text Text - Default |
17.061 kB6.723 kB |
| react-text Text - Wrappers |
20.242 kB7.048 kB |
| react-textarea Textarea |
26.572 kB9.755 kB |
| react-theme Single theme token import |
69 B89 B |
| react-theme Teams: all themes |
35.666 kB7.453 kB |
| react-theme Teams: Light theme |
19.642 kB5.549 kB |
| react-timepicker-compat TimePicker |
107.372 kB35.755 kB |
| react-toast Toast (including Toaster) |
98.338 kB29.591 kB |
| react-tooltip Tooltip |
55.517 kB19.515 kB |
| react-utilities SSRProvider |
180 B160 B |
🕵 FluentUIV0 No visual regressions between this PR and main
Perf Analysis (@fluentui/react-components)
No significant results to display.
All results
| Scenario | Render type | Master Ticks | PR Ticks | Iterations | Status |
|---|---|---|---|---|---|
| Avatar | mount | 653 | 623 | 5000 | |
| Button | mount | 305 | 306 | 5000 | |
| Field | mount | 1150 | 1128 | 5000 | |
| FluentProvider | mount | 724 | 719 | 5000 | |
| FluentProviderWithTheme | mount | 84 | 89 | 10 | |
| FluentProviderWithTheme | virtual-rerender | 40 | 36 | 10 | |
| FluentProviderWithTheme | virtual-rerender-with-unmount | 89 | 81 | 10 | |
| MakeStyles | mount | 886 | 864 | 50000 | |
| Persona | mount | 1749 | 1708 | 5000 | |
| SpinButton | mount | 1405 | 1435 | 5000 | |
| SwatchPicker | mount | 1656 | 1682 | 5000 |
Perf Analysis (@fluentui/react-northstar)
Perf tests with no regressions
| Scenario | Current PR Ticks | Baseline Ticks | Ratio |
|---|---|---|---|
| ButtonMinimalPerf.default | 100 | 90 | 1.11:1 |
| ReactionMinimalPerf.default | 215 | 194 | 1.11:1 |
| PortalMinimalPerf.default | 89 | 81 | 1.1:1 |
| TreeWith60ListItems.default | 92 | 84 | 1.1:1 |
| SkeletonMinimalPerf.default | 212 | 196 | 1.08:1 |
| AvatarMinimalPerf.default | 114 | 107 | 1.07:1 |
| RefMinimalPerf.default | 113 | 106 | 1.07:1 |
| ToolbarMinimalPerf.default | 548 | 519 | 1.06:1 |
| ButtonSlotsPerf.default | 321 | 307 | 1.05:1 |
| ChatDuplicateMessagesPerf.default | 160 | 153 | 1.05:1 |
| ProviderMinimalPerf.default | 208 | 198 | 1.05:1 |
| AccordionMinimalPerf.default | 81 | 78 | 1.04:1 |
| AttachmentMinimalPerf.default | 88 | 85 | 1.04:1 |
| AttachmentSlotsPerf.default | 652 | 629 | 1.04:1 |
| ListWith60ListItems.default | 379 | 366 | 1.04:1 |
| TooltipMinimalPerf.default | 1276 | 1229 | 1.04:1 |
| GridMinimalPerf.default | 182 | 177 | 1.03:1 |
| ImageMinimalPerf.default | 226 | 220 | 1.03:1 |
| IconMinimalPerf.default | 382 | 371 | 1.03:1 |
| VideoMinimalPerf.default | 441 | 429 | 1.03:1 |
| HeaderMinimalPerf.default | 214 | 209 | 1.02:1 |
| ListNestedPerf.default | 332 | 324 | 1.02:1 |
| RadioGroupMinimalPerf.default | 269 | 263 | 1.02:1 |
| SegmentMinimalPerf.default | 199 | 195 | 1.02:1 |
| SliderMinimalPerf.default | 762 | 746 | 1.02:1 |
| TableMinimalPerf.default | 228 | 223 | 1.02:1 |
| TreeMinimalPerf.default | 490 | 479 | 1.02:1 |
| BoxMinimalPerf.default | 193 | 191 | 1.01:1 |
| ChatMinimalPerf.default | 438 | 433 | 1.01:1 |
| DropdownManyItemsPerf.default | 385 | 382 | 1.01:1 |
| DropdownMinimalPerf.default | 1475 | 1463 | 1.01:1 |
| InputMinimalPerf.default | 535 | 532 | 1.01:1 |
| ListCommonPerf.default | 393 | 388 | 1.01:1 |
| ListMinimalPerf.default | 307 | 305 | 1.01:1 |
| PopupMinimalPerf.default | 354 | 350 | 1.01:1 |
| ProviderMergeThemesPerf.default | 654 | 645 | 1.01:1 |
| CustomToolbarPrototype.default | 1475 | 1463 | 1.01:1 |
| AnimationMinimalPerf.default | 296 | 297 | 1:1 |
| CardMinimalPerf.default | 300 | 299 | 1:1 |
| DatepickerMinimalPerf.default | 3593 | 3599 | 1:1 |
| DialogMinimalPerf.default | 446 | 444 | 1:1 |
| FormMinimalPerf.default | 221 | 222 | 1:1 |
| ItemLayoutMinimalPerf.default | 709 | 710 | 1:1 |
| CarouselMinimalPerf.default | 266 | 268 | 0.99:1 |
| EmbedMinimalPerf.default | 1848 | 1858 | 0.99:1 |
| LayoutMinimalPerf.default | 198 | 199 | 0.99:1 |
| MenuButtonMinimalPerf.default | 942 | 952 | 0.99:1 |
| ButtonOverridesMissPerf.default | 640 | 654 | 0.98:1 |
| ChatWithPopoverPerf.default | 193 | 197 | 0.98:1 |
| LabelMinimalPerf.default | 214 | 218 | 0.98:1 |
| RosterPerf.default | 1554 | 1589 | 0.98:1 |
| SplitButtonMinimalPerf.default | 2226 | 2277 | 0.98:1 |
| StatusMinimalPerf.default | 395 | 404 | 0.98:1 |
| TextAreaMinimalPerf.default | 285 | 290 | 0.98:1 |
| DividerMinimalPerf.default | 203 | 209 | 0.97:1 |
| FlexMinimalPerf.default | 151 | 155 | 0.97:1 |
| HeaderSlotsPerf.default | 452 | 464 | 0.97:1 |
| TableManyItemsPerf.default | 1072 | 1103 | 0.97:1 |
| TextMinimalPerf.default | 187 | 192 | 0.97:1 |
| AlertMinimalPerf.default | 152 | 159 | 0.96:1 |
| CheckboxMinimalPerf.default | 1112 | 1156 | 0.96:1 |
| LoaderMinimalPerf.default | 180 | 187 | 0.96:1 |
| MenuMinimalPerf.default | 491 | 509 | 0.96:1 |
Perf Analysis (@fluentui/react)
No significant results to display.
All results
| Scenario | Render type | Master Ticks | PR Ticks | Iterations | Status |
|---|---|---|---|---|---|
| BaseButton | mount | 631 | 640 | 5000 | |
| Breadcrumb | mount | 1715 | 1700 | 1000 | |
| Checkbox | mount | 1687 | 1747 | 5000 | |
| CheckboxBase | mount | 1508 | 1503 | 5000 | |
| ChoiceGroup | mount | 3029 | 3021 | 5000 | |
| ComboBox | mount | 697 | 682 | 1000 | |
| CommandBar | mount | 6628 | 6713 | 1000 | |
| ContextualMenu | mount | 12264 | 12367 | 1000 | |
| DefaultButton | mount | 808 | 800 | 5000 | |
| DetailsRow | mount | 2302 | 2256 | 5000 | |
| DetailsRowFast | mount | 2311 | 2235 | 5000 | |
| DetailsRowNoStyles | mount | 2065 | 2098 | 5000 | |
| Dialog | mount | 2692 | 2733 | 1000 | |
| DocumentCardTitle | mount | 242 | 237 | 1000 | |
| Dropdown | mount | 2017 | 2001 | 5000 | |
| FocusTrapZone | mount | 1162 | 1126 | 5000 | |
| FocusZone | mount | 1128 | 1107 | 5000 | |
| GroupedList | mount | 43009 | 42820 | 2 | |
| GroupedList | virtual-rerender | 20596 | 20584 | 2 | |
| GroupedList | virtual-rerender-with-unmount | 52212 | 52325 | 2 | |
| GroupedListV2 | mount | 229 | 228 | 2 | |
| GroupedListV2 | virtual-rerender | 221 | 220 | 2 | |
| GroupedListV2 | virtual-rerender-with-unmount | 228 | 232 | 2 | |
| IconButton | mount | 1160 | 1175 | 5000 | |
| Label | mount | 342 | 346 | 5000 | |
| Layer | mount | 2862 | 2793 | 5000 | |
| Link | mount | 398 | 401 | 5000 | |
| MenuButton | mount | 1005 | 1020 | 5000 | |
| MessageBar | mount | 21638 | 21738 | 5000 | |
| Nav | mount | 2072 | 2140 | 1000 | |
| OverflowSet | mount | 830 | 788 | 5000 | |
| Panel | mount | 1895 | 1924 | 1000 | |
| Persona | mount | 775 | 755 | 1000 | |
| Pivot | mount | 930 | 931 | 1000 | |
| PrimaryButton | mount | 960 | 966 | 5000 | |
| Rating | mount | 4769 | 4716 | 5000 | |
| SearchBox | mount | 924 | 930 | 5000 | |
| Shimmer | mount | 1907 | 1941 | 5000 | |
| Slider | mount | 1355 | 1371 | 5000 | |
| SpinButton | mount | 3039 | 3018 | 5000 | |
| Spinner | mount | 395 | 387 | 5000 | |
| SplitButton | mount | 1884 | 1929 | 5000 | |
| Stack | mount | 433 | 426 | 5000 | |
| StackWithIntrinsicChildren | mount | 880 | 896 | 5000 | |
| StackWithTextChildren | mount | 2805 | 2852 | 5000 | |
| SwatchColorPicker | mount | 6510 | 6543 | 5000 | |
| TagPicker | mount | 1542 | 1485 | 5000 | |
| Text | mount | 388 | 398 | 5000 | |
| TextField | mount | 953 | 949 | 5000 | |
| ThemeProvider | mount | 866 | 856 | 5000 | |
| ThemeProvider | virtual-rerender | 582 | 598 | 5000 | |
| ThemeProvider | virtual-rerender-with-unmount | 1293 | 1306 | 5000 | |
| Toggle | mount | 632 | 631 | 5000 | |
| buttonNative | mount | 197 | 194 | 5000 |
📊 Bundle size report
| Package & Exports | Baseline (minified/GZIP) | PR | Change |
|---|---|---|---|
| keyboard-keys Multiple keyCodes |
0 B0 B |
50 B70 B |
🆕 New entry |
| keyboard-keys Multiple keys |
0 B0 B |
87 B94 B |
🆕 New entry |
| keyboard-keys Single key |
0 B0 B |
44 B64 B |
🆕 New entry |
| keyboard-keys Single keyCode |
0 B0 B |
39 B59 B |
🆕 New entry |
| react ExtendedPicker |
96.924 kB27.92 kB |
96.924 kB27.917 kB |
-3 B |
| react FloatingPicker |
242.44 kB69.088 kB |
242.44 kB69.089 kB |
1 B |
| react Fluent UI React (entire library) |
1.015 MB282.181 kB |
1.015 MB282.184 kB |
3 B |
| react SelectedItemsList |
232.95 kB67.977 kB |
232.95 kB67.979 kB |
2 B |
| react-aria ARIA - Default |
0 B0 B |
237 B181 B |
🆕 New entry |
| react-teaching-popover TeachingPopover |
0 B0 B |
90.611 kB27.593 kB |
🆕 New entry |
| react-tree FlatTree |
0 B0 B |
145.048 kB41.691 kB |
🆕 New entry |
| react-tree PersonaFlatTree |
0 B0 B |
145.736 kB41.798 kB |
🆕 New entry |
| react-tree PersonaTree |
0 B0 B |
141.967 kB40.615 kB |
🆕 New entry |
| react-tree Tree |
0 B0 B |
141.279 kB40.522 kB |
🆕 New entry |
Unchanged fixtures
| Package & Exports | Size (minified/GZIP) |
|---|---|
| global-context createContext |
510 B328 B |
| global-context createContextSelector |
537 B339 B |
| keyboard-key keyboard-key package |
3.746 kB1.928 kB |
| priority-overflow createOverflowManager |
4.457 kB1.856 kB |
| react ActivityItem |
71.236 kB23.357 kB |
| react Announced |
38.493 kB13.297 kB |
| react Autofill |
15.428 kB4.768 kB |
| react Breadcrumb |
202.406 kB60.482 kB |
| react Button |
195.858 kB56.697 kB |
| react ButtonGrid |
180.792 kB54.683 kB |
| react Calendar |
121.905 kB37.046 kB |
| react Callout |
84.33 kB27.648 kB |
| react Check |
53.204 kB17.848 kB |
| react Checkbox |
59.985 kB19.903 kB |
| react ChoiceGroup |
65.494 kB21.489 kB |
| react ChoiceGroupOption |
58.767 kB19.362 kB |
| react Coachmark |
93.151 kB29.428 kB |
| react Color |
7.789 kB3.127 kB |
| react ColorPicker |
135.359 kB42.257 kB |
| react ComboBox |
252.295 kB72.392 kB |
| react CommandBar |
203.447 kB60.224 kB |
| react ContextualMenu |
155.273 kB48.228 kB |
| react DatePicker |
184.333 kB56.194 kB |
| react DateTimeUtilities |
5.244 kB1.849 kB |
| react DetailsList |
230.107 kB65.952 kB |
| react Dialog |
211.784 kB63.237 kB |
| react Divider |
19.603 kB6.845 kB |
| react DocumentCard |
217.399 kB64.512 kB |
| react DragDrop |
8.343 kB2.724 kB |
| react DraggableZone |
34.305 kB11.509 kB |
| react Dropdown |
234.345 kB68.729 kB |
| react Fabric |
41.745 kB14.366 kB |
| react Facepile |
210.998 kB63.254 kB |
| react FocusTrapZone |
17.03 kB5.924 kB |
| react FocusZone |
55.182 kB17.503 kB |
| react Grid |
180.792 kB54.683 kB |
| react GroupedList |
135.178 kB40.798 kB |
| react GroupedListV2 |
122.767 kB37.881 kB |
| react HoverCard |
97.179 kB30.82 kB |
| react Icon |
51.885 kB17.272 kB |
| react Icons |
66.361 kB24.397 kB |
| react Image |
46.904 kB15.707 kB |
| react Keytip |
81.693 kB26.766 kB |
| react KeytipData |
14.039 kB4.588 kB |
| react KeytipLayer |
103.478 kB32.017 kB |
| react Keytips |
106.25 kB33.023 kB |
| react Label |
38.347 kB13.257 kB |
| react Layer |
48.099 kB16.367 kB |
| react Link |
39.682 kB13.67 kB |
| react List |
39.4 kB12.481 kB |
| react MarqueeSelection |
74.541 kB22.44 kB |
| react MessageBar |
190.922 kB57.155 kB |
| react Modal |
93.747 kB30.278 kB |
| react Nav |
188.398 kB56.575 kB |
| react OverflowSet |
33.393 kB11.329 kB |
| react Overlay |
40.902 kB14.095 kB |
| react Panel |
201.456 kB60.076 kB |
| react Persona |
114.967 kB36.546 kB |
| react PersonaCoin |
114.967 kB36.546 kB |
| react PersonaPresence |
58.074 kB19.384 kB |
| react Pickers |
294.462 kB82.501 kB |
| react Pivot |
189.29 kB57.329 kB |
| react Popup |
12.294 kB4.195 kB |
| react Positioning |
22.807 kB7.701 kB |
| react PositioningContainer |
73.85 kB23.765 kB |
| react ProgressIndicator |
39.504 kB13.554 kB |
| react Rating |
82.143 kB26.144 kB |
| react ResizeGroup |
13.338 kB4.377 kB |
| react ResponsiveMode |
8.13 kB2.966 kB |
| react ScrollablePane |
55.563 kB17.734 kB |
| react SearchBox |
189.171 kB56.737 kB |
| react SelectableOption |
724 B413 B |
| react Selection |
42.464 kB12.301 kB |
| react Separator |
35.384 kB12.146 kB |
| react Shimmer |
49.259 kB16.268 kB |
| react ShimmeredDetailsList |
240.889 kB68.7 kB |
| react Slider |
57.651 kB19.217 kB |
| react SpinButton |
192.874 kB57.835 kB |
| react Spinner |
41.777 kB14.478 kB |
| react Stack |
41.734 kB14.268 kB |
| react Sticky |
32.613 kB10.509 kB |
| react Styling |
46.033 kB15.135 kB |
| react SwatchColorPicker |
191.177 kB58.196 kB |
| react TeachingBubble |
206.173 kB61.106 kB |
| react Text |
36.908 kB12.822 kB |
| react TextField |
80.816 kB25.332 kB |
| react Theme |
43.501 kB14.183 kB |
| react ThemeGenerator |
12.392 kB4.126 kB |
| react TimePicker |
242.077 kB70.14 kB |
| react Toggle |
46.225 kB15.986 kB |
| react Tooltip |
87.456 kB28.268 kB |
| react Utilities |
82.931 kB25.148 kB |
| react Viewport |
23.888 kB7.656 kB |
| react WeeklyDayPicker |
102.058 kB31.861 kB |
| react WindowProvider |
1.059 kB541 B |
| react-accordion Accordion (including children components) |
106.728 kB32.718 kB |
| react-avatar Avatar |
49.303 kB15.815 kB |
| react-avatar AvatarGroup |
20.106 kB7.968 kB |
| react-avatar AvatarGroupItem |
63.447 kB20.034 kB |
| react-badge Badge |
25.954 kB8.595 kB |
| react-badge CounterBadge |
26.733 kB8.872 kB |
| react-badge PresenceBadge |
25.719 kB9.457 kB |
| react-breadcrumb @fluentui/react-breadcrumb - package |
114.291 kB31.695 kB |
| react-button Button |
37.174 kB10.803 kB |
| react-button CompoundButton |
43.588 kB12.101 kB |
| react-button MenuButton |
41.989 kB12.144 kB |
| react-button SplitButton |
50.006 kB13.716 kB |
| react-button ToggleButton |
53.107 kB12.561 kB |
| react-calendar-compat Calendar Compat |
150.095 kB40.026 kB |
| react-card Card - All |
101.77 kB28.772 kB |
| react-card Card |
94.544 kB26.951 kB |
| react-card CardFooter |
14.355 kB5.79 kB |
| react-card CardHeader |
16.888 kB6.669 kB |
| react-card CardPreview |
14.42 kB5.922 kB |
| react-checkbox Checkbox |
35.118 kB12.077 kB |
| react-combobox Combobox (including child components) |
104.383 kB34.197 kB |
| react-combobox Dropdown (including child components) |
104.996 kB34.122 kB |
| react-components react-components: Button, FluentProvider & webLightTheme |
69.21 kB20.174 kB |
| react-components react-components: Accordion, Button, FluentProvider, Image, Menu, Popover |
220.616 kB63.902 kB |
| react-components react-components: FluentProvider & webLightTheme |
44.447 kB14.59 kB |
| react-components react-components: entire library |
1.16 MB290.619 kB |
| react-datepicker-compat DatePicker Compat |
224.165 kB63.423 kB |
| react-dialog Dialog (including children components) |
100.297 kB30.076 kB |
| react-divider Divider |
21.328 kB7.953 kB |
| react-field Field |
23.399 kB8.898 kB |
| react-image Image |
15.36 kB6.236 kB |
| react-input Input |
28.014 kB9.444 kB |
| react-jsx-runtime Classic Pragma |
1.057 kB530 B |
| react-jsx-runtime JSX Dev Runtime |
3.771 kB1.643 kB |
| react-jsx-runtime JSX Runtime |
4.367 kB1.874 kB |
| react-label Label |
14.671 kB5.99 kB |
| react-link Link |
17.326 kB7.032 kB |
| react-list-preview List |
89.148 kB26.597 kB |
| react-list-preview ListItem |
112.707 kB33.428 kB |
| react-menu Menu (including children components) |
152.661 kB46.116 kB |
| react-menu Menu (including selectable components) |
155.342 kB46.598 kB |
| react-message-bar MessageBar (all components) |
24.878 kB9.264 kB |
| react-motion @fluentui/react-motion - createMotionComponent() |
4.303 kB1.899 kB |
| react-motion @fluentui/react-motion - createPresenceComponent() |
5.038 kB2.229 kB |
| react-motion @fluentui/react-motion - PresenceGroup |
1.714 kB819 B |
| react-northstar Accordion |
85.38 kB26.519 kB |
| react-northstar Alert |
87.435 kB26.905 kB |
| react-northstar Animation |
55.331 kB17.83 kB |
| react-northstar Attachment |
86.829 kB26.7 kB |
| react-northstar Avatar |
80.264 kB24.633 kB |
| react-northstar Box |
75.233 kB23.813 kB |
| react-northstar Breadcrumb |
79.908 kB24.717 kB |
| react-northstar Button |
83.145 kB25.952 kB |
| react-northstar Card |
82.693 kB25.037 kB |
| react-northstar Carousel |
105.17 kB31.873 kB |
| react-northstar Chat |
154.072 kB46.878 kB |
| react-northstar Checkbox |
79.792 kB25.08 kB |
| react-northstar Datepicker |
186.639 kB56.99 kB |
| react-northstar Debug |
8.801 kB3.594 kB |
| react-northstar Design |
36.589 kB12.067 kB |
| react-northstar Dialog |
112.046 kB33.622 kB |
| react-northstar Divider |
76.604 kB24.135 kB |
| react-northstar Dropdown |
198.196 kB60.223 kB |
| react-northstar Embed |
81.465 kB25.425 kB |
| react-northstar Flex |
47.716 kB15.443 kB |
| react-northstar Form |
92.515 kB28.888 kB |
| react-northstar Grid |
70.569 kB22.283 kB |
| react-northstar Header |
74.741 kB23.465 kB |
| react-northstar Image |
73.576 kB23.333 kB |
| react-northstar Input |
88.334 kB27.781 kB |
| react-northstar ItemLayout |
78.213 kB24.457 kB |
| react-northstar Label |
77.905 kB24.414 kB |
| react-northstar Layout |
75.378 kB23.803 kB |
| react-northstar List |
88.475 kB27.555 kB |
| react-northstar Loader |
78.601 kB24.733 kB |
| react-northstar Menu |
128.587 kB40.738 kB |
| react-northstar MenuButton |
162.993 kB49.614 kB |
| react-northstar Pill |
83.707 kB26.069 kB |
| react-northstar Popup |
135.304 kB42.259 kB |
| react-northstar Portal |
58.326 kB18.851 kB |
| react-northstar Provider |
93.129 kB29.627 kB |
| react-northstar RadioGroup |
83.27 kB26.053 kB |
| react-northstar Reaction |
77.265 kB24.128 kB |
| react-northstar Segment |
76.194 kB23.896 kB |
| react-northstar Skeleton |
77.75 kB24.205 kB |
| react-northstar Slider |
84.258 kB26.757 kB |
| react-northstar SplitButton |
178.231 kB53.438 kB |
| react-northstar Status |
76.257 kB24.054 kB |
| react-northstar SvgIcon |
36.811 kB11.746 kB |
| react-northstar Table |
80.784 kB25.157 kB |
| react-northstar Text |
74.099 kB23.511 kB |
| react-northstar TextArea |
74.233 kB23.496 kB |
| react-northstar Toolbar |
175.042 kB52.844 kB |
| react-northstar Tooltip |
109.961 kB35.238 kB |
| react-northstar Tree |
87.84 kB27.223 kB |
| react-northstar Video |
75.399 kB23.796 kB |
| react-overflow hooks only |
12.808 kB4.819 kB |
| react-persona Persona |
56.194 kB17.695 kB |
| react-popover Popover |
128.904 kB40.314 kB |
| react-portal Portal |
14.563 kB5.118 kB |
| react-portal-compat PortalCompatProvider |
8.39 kB2.64 kB |
| react-positioning usePositioning |
27.057 kB9.698 kB |
| react-progress ProgressBar |
17.084 kB6.891 kB |
| react-provider FluentProvider |
24.623 kB8.893 kB |
| react-radio Radio |
32.672 kB10.343 kB |
| react-radio RadioGroup |
15.762 kB6.423 kB |
| react-select Select |
27.732 kB10.124 kB |
| react-slider Slider |
37.169 kB12.538 kB |
| react-spinbutton SpinButton |
36.06 kB11.815 kB |
| react-spinner Spinner |
25.245 kB8.539 kB |
| react-swatch-picker @fluentui/react-swatch-picker - package |
104.258 kB30.231 kB |
| react-switch Switch |
35.319 kB11.314 kB |
| react-table DataGrid |
161.034 kB45.71 kB |
| react-table Table (Primitives only) |
42.666 kB13.854 kB |
| react-table Table as DataGrid |
131.869 kB36.57 kB |
| react-table Table (Selection only) |
70.536 kB19.999 kB |
| react-table Table (Sort only) |
69.179 kB19.61 kB |
| react-tag-picker @fluentui/react-tag-picker - package |
184.091 kB55.425 kB |
| react-tags InteractionTag |
15.199 kB6.157 kB |
| react-tags Tag |
29.016 kB9.524 kB |
| react-tags TagGroup |
82.719 kB24.524 kB |
| react-text Text - Default |
17.061 kB6.723 kB |
| react-text Text - Wrappers |
20.242 kB7.048 kB |
| react-textarea Textarea |
26.572 kB9.755 kB |
| react-theme Single theme token import |
69 B89 B |
| react-theme Teams: all themes |
35.666 kB7.453 kB |
| react-theme Teams: Light theme |
19.642 kB5.549 kB |
| react-timepicker-compat TimePicker |
107.372 kB35.755 kB |
| react-toast Toast (including Toaster) |
98.338 kB29.591 kB |
| react-tooltip Tooltip |
55.517 kB19.515 kB |
| react-utilities SSRProvider |
180 B160 B |
🕵 fluentui-web-components-v3 No visual regressions between this PR and main
📊 Bundle size report
| Package & Exports | Baseline (minified/GZIP) | PR | Change |
|---|---|---|---|
| keyboard-keys Multiple keyCodes |
0 B0 B |
50 B70 B |
🆕 New entry |
| keyboard-keys Multiple keys |
0 B0 B |
87 B94 B |
🆕 New entry |
| keyboard-keys Single key |
0 B0 B |
44 B64 B |
🆕 New entry |
| keyboard-keys Single keyCode |
0 B0 B |
39 B59 B |
🆕 New entry |
| react ExtendedPicker |
96.924 kB27.92 kB |
96.924 kB27.917 kB |
-3 B |
| react FloatingPicker |
242.44 kB69.088 kB |
242.44 kB69.089 kB |
1 B |
| react Fluent UI React (entire library) |
1.015 MB282.181 kB |
1.015 MB282.184 kB |
3 B |
| react SelectedItemsList |
232.95 kB67.977 kB |
232.95 kB67.979 kB |
2 B |
| react-aria ARIA - Default |
0 B0 B |
237 B181 B |
🆕 New entry |
| react-teaching-popover TeachingPopover |
0 B0 B |
90.611 kB27.593 kB |
🆕 New entry |
| react-tree FlatTree |
0 B0 B |
145.048 kB41.691 kB |
🆕 New entry |
| react-tree PersonaFlatTree |
0 B0 B |
145.736 kB41.798 kB |
🆕 New entry |
| react-tree PersonaTree |
0 B0 B |
141.967 kB40.615 kB |
🆕 New entry |
| react-tree Tree |
0 B0 B |
141.279 kB40.522 kB |
🆕 New entry |
Unchanged fixtures
| Package & Exports | Size (minified/GZIP) |
|---|---|
| global-context createContext |
510 B328 B |
| global-context createContextSelector |
537 B339 B |
| keyboard-key keyboard-key package |
3.746 kB1.928 kB |
| priority-overflow createOverflowManager |
4.457 kB1.856 kB |
| react ActivityItem |
71.236 kB23.357 kB |
| react Announced |
38.493 kB13.297 kB |
| react Autofill |
15.428 kB4.768 kB |
| react Breadcrumb |
202.406 kB60.482 kB |
| react Button |
195.858 kB56.697 kB |
| react ButtonGrid |
180.792 kB54.683 kB |
| react Calendar |
121.905 kB37.046 kB |
| react Callout |
84.33 kB27.648 kB |
| react Check |
53.204 kB17.848 kB |
| react Checkbox |
59.985 kB19.903 kB |
| react ChoiceGroup |
65.494 kB21.489 kB |
| react ChoiceGroupOption |
58.767 kB19.362 kB |
| react Coachmark |
93.151 kB29.428 kB |
| react Color |
7.789 kB3.127 kB |
| react ColorPicker |
135.359 kB42.257 kB |
| react ComboBox |
252.295 kB72.392 kB |
| react CommandBar |
203.447 kB60.224 kB |
| react ContextualMenu |
155.273 kB48.228 kB |
| react DatePicker |
184.333 kB56.194 kB |
| react DateTimeUtilities |
5.244 kB1.849 kB |
| react DetailsList |
230.107 kB65.952 kB |
| react Dialog |
211.784 kB63.237 kB |
| react Divider |
19.603 kB6.845 kB |
| react DocumentCard |
217.399 kB64.512 kB |
| react DragDrop |
8.343 kB2.724 kB |
| react DraggableZone |
34.305 kB11.509 kB |
| react Dropdown |
234.345 kB68.729 kB |
| react Fabric |
41.745 kB14.366 kB |
| react Facepile |
210.998 kB63.254 kB |
| react FocusTrapZone |
17.03 kB5.924 kB |
| react FocusZone |
55.182 kB17.503 kB |
| react Grid |
180.792 kB54.683 kB |
| react GroupedList |
135.178 kB40.798 kB |
| react GroupedListV2 |
122.767 kB37.881 kB |
| react HoverCard |
97.179 kB30.82 kB |
| react Icon |
51.885 kB17.272 kB |
| react Icons |
66.361 kB24.397 kB |
| react Image |
46.904 kB15.707 kB |
| react Keytip |
81.693 kB26.766 kB |
| react KeytipData |
14.039 kB4.588 kB |
| react KeytipLayer |
103.478 kB32.017 kB |
| react Keytips |
106.25 kB33.023 kB |
| react Label |
38.347 kB13.257 kB |
| react Layer |
48.099 kB16.367 kB |
| react Link |
39.682 kB13.67 kB |
| react List |
39.4 kB12.481 kB |
| react MarqueeSelection |
74.541 kB22.44 kB |
| react MessageBar |
190.922 kB57.155 kB |
| react Modal |
93.747 kB30.278 kB |
| react Nav |
188.398 kB56.575 kB |
| react OverflowSet |
33.393 kB11.329 kB |
| react Overlay |
40.902 kB14.095 kB |
| react Panel |
201.456 kB60.076 kB |
| react Persona |
114.967 kB36.546 kB |
| react PersonaCoin |
114.967 kB36.546 kB |
| react PersonaPresence |
58.074 kB19.384 kB |
| react Pickers |
294.462 kB82.501 kB |
| react Pivot |
189.29 kB57.329 kB |
| react Popup |
12.294 kB4.195 kB |
| react Positioning |
22.807 kB7.701 kB |
| react PositioningContainer |
73.85 kB23.765 kB |
| react ProgressIndicator |
39.504 kB13.554 kB |
| react Rating |
82.143 kB26.144 kB |
| react ResizeGroup |
13.338 kB4.377 kB |
| react ResponsiveMode |
8.13 kB2.966 kB |
| react ScrollablePane |
55.563 kB17.734 kB |
| react SearchBox |
189.171 kB56.737 kB |
| react SelectableOption |
724 B413 B |
| react Selection |
42.464 kB12.301 kB |
| react Separator |
35.384 kB12.146 kB |
| react Shimmer |
49.259 kB16.268 kB |
| react ShimmeredDetailsList |
240.889 kB68.7 kB |
| react Slider |
57.651 kB19.217 kB |
| react SpinButton |
192.874 kB57.835 kB |
| react Spinner |
41.777 kB14.478 kB |
| react Stack |
41.734 kB14.268 kB |
| react Sticky |
32.613 kB10.509 kB |
| react Styling |
46.033 kB15.135 kB |
| react SwatchColorPicker |
191.177 kB58.196 kB |
| react TeachingBubble |
206.173 kB61.106 kB |
| react Text |
36.908 kB12.822 kB |
| react TextField |
80.816 kB25.332 kB |
| react Theme |
43.501 kB14.183 kB |
| react ThemeGenerator |
12.392 kB4.126 kB |
| react TimePicker |
242.077 kB70.14 kB |
| react Toggle |
46.225 kB15.986 kB |
| react Tooltip |
87.456 kB28.268 kB |
| react Utilities |
82.931 kB25.148 kB |
| react Viewport |
23.888 kB7.656 kB |
| react WeeklyDayPicker |
102.058 kB31.861 kB |
| react WindowProvider |
1.059 kB541 B |
| react-accordion Accordion (including children components) |
106.728 kB32.718 kB |
| react-avatar Avatar |
49.303 kB15.815 kB |
| react-avatar AvatarGroup |
20.106 kB7.968 kB |
| react-avatar AvatarGroupItem |
63.447 kB20.034 kB |
| react-badge Badge |
25.954 kB8.595 kB |
| react-badge CounterBadge |
26.733 kB8.872 kB |
| react-badge PresenceBadge |
25.719 kB9.457 kB |
| react-breadcrumb @fluentui/react-breadcrumb - package |
114.291 kB31.695 kB |
| react-button Button |
37.174 kB10.803 kB |
| react-button CompoundButton |
43.588 kB12.101 kB |
| react-button MenuButton |
41.989 kB12.144 kB |
| react-button SplitButton |
50.006 kB13.716 kB |
| react-button ToggleButton |
53.107 kB12.561 kB |
| react-calendar-compat Calendar Compat |
150.095 kB40.026 kB |
| react-card Card - All |
101.77 kB28.772 kB |
| react-card Card |
94.544 kB26.951 kB |
| react-card CardFooter |
14.355 kB5.79 kB |
| react-card CardHeader |
16.888 kB6.669 kB |
| react-card CardPreview |
14.42 kB5.922 kB |
| react-checkbox Checkbox |
35.118 kB12.077 kB |
| react-combobox Combobox (including child components) |
104.383 kB34.197 kB |
| react-combobox Dropdown (including child components) |
104.996 kB34.122 kB |
| react-components react-components: Button, FluentProvider & webLightTheme |
69.21 kB20.174 kB |
| react-components react-components: Accordion, Button, FluentProvider, Image, Menu, Popover |
220.616 kB63.902 kB |
| react-components react-components: FluentProvider & webLightTheme |
44.447 kB14.59 kB |
| react-components react-components: entire library |
1.16 MB290.619 kB |
| react-datepicker-compat DatePicker Compat |
224.165 kB63.423 kB |
| react-dialog Dialog (including children components) |
100.297 kB30.076 kB |
| react-divider Divider |
21.328 kB7.953 kB |
| react-field Field |
23.399 kB8.898 kB |
| react-image Image |
15.36 kB6.236 kB |
| react-input Input |
28.014 kB9.444 kB |
| react-jsx-runtime Classic Pragma |
1.057 kB530 B |
| react-jsx-runtime JSX Dev Runtime |
3.771 kB1.643 kB |
| react-jsx-runtime JSX Runtime |
4.367 kB1.874 kB |
| react-label Label |
14.671 kB5.99 kB |
| react-link Link |
17.326 kB7.032 kB |
| react-list-preview List |
89.148 kB26.597 kB |
| react-list-preview ListItem |
112.707 kB33.428 kB |
| react-menu Menu (including children components) |
152.661 kB46.116 kB |
| react-menu Menu (including selectable components) |
155.342 kB46.598 kB |
| react-message-bar MessageBar (all components) |
24.878 kB9.264 kB |
| react-motion @fluentui/react-motion - createMotionComponent() |
4.303 kB1.899 kB |
| react-motion @fluentui/react-motion - createPresenceComponent() |
5.038 kB2.229 kB |
| react-motion @fluentui/react-motion - PresenceGroup |
1.714 kB819 B |
| react-northstar Accordion |
85.38 kB26.519 kB |
| react-northstar Alert |
87.435 kB26.905 kB |
| react-northstar Animation |
55.331 kB17.83 kB |
| react-northstar Attachment |
86.829 kB26.7 kB |
| react-northstar Avatar |
80.264 kB24.633 kB |
| react-northstar Box |
75.233 kB23.813 kB |
| react-northstar Breadcrumb |
79.908 kB24.717 kB |
| react-northstar Button |
83.145 kB25.952 kB |
| react-northstar Card |
82.693 kB25.037 kB |
| react-northstar Carousel |
105.17 kB31.873 kB |
| react-northstar Chat |
154.072 kB46.878 kB |
| react-northstar Checkbox |
79.792 kB25.08 kB |
| react-northstar Datepicker |
186.639 kB56.99 kB |
| react-northstar Debug |
8.801 kB3.594 kB |
| react-northstar Design |
36.589 kB12.067 kB |
| react-northstar Dialog |
112.046 kB33.622 kB |
| react-northstar Divider |
76.604 kB24.135 kB |
| react-northstar Dropdown |
198.196 kB60.223 kB |
| react-northstar Embed |
81.465 kB25.425 kB |
| react-northstar Flex |
47.716 kB15.443 kB |
| react-northstar Form |
92.515 kB28.888 kB |
| react-northstar Grid |
70.569 kB22.283 kB |
| react-northstar Header |
74.741 kB23.465 kB |
| react-northstar Image |
73.576 kB23.333 kB |
| react-northstar Input |
88.334 kB27.781 kB |
| react-northstar ItemLayout |
78.213 kB24.457 kB |
| react-northstar Label |
77.905 kB24.414 kB |
| react-northstar Layout |
75.378 kB23.803 kB |
| react-northstar List |
88.475 kB27.555 kB |
| react-northstar Loader |
78.601 kB24.733 kB |
| react-northstar Menu |
128.587 kB40.738 kB |
| react-northstar MenuButton |
162.993 kB49.614 kB |
| react-northstar Pill |
83.707 kB26.069 kB |
| react-northstar Popup |
135.304 kB42.259 kB |
| react-northstar Portal |
58.326 kB18.851 kB |
| react-northstar Provider |
93.129 kB29.627 kB |
| react-northstar RadioGroup |
83.27 kB26.053 kB |
| react-northstar Reaction |
77.265 kB24.128 kB |
| react-northstar Segment |
76.194 kB23.896 kB |
| react-northstar Skeleton |
77.75 kB24.205 kB |
| react-northstar Slider |
84.258 kB26.757 kB |
| react-northstar SplitButton |
178.231 kB53.438 kB |
| react-northstar Status |
76.257 kB24.054 kB |
| react-northstar SvgIcon |
36.811 kB11.746 kB |
| react-northstar Table |
80.784 kB25.157 kB |
| react-northstar Text |
74.099 kB23.511 kB |
| react-northstar TextArea |
74.233 kB23.496 kB |
| react-northstar Toolbar |
175.042 kB52.844 kB |
| react-northstar Tooltip |
109.961 kB35.238 kB |
| react-northstar Tree |
87.84 kB27.223 kB |
| react-northstar Video |
75.399 kB23.796 kB |
| react-overflow hooks only |
12.808 kB4.819 kB |
| react-persona Persona |
56.194 kB17.695 kB |
| react-popover Popover |
128.904 kB40.314 kB |
| react-portal Portal |
14.563 kB5.118 kB |
| react-portal-compat PortalCompatProvider |
8.39 kB2.64 kB |
| react-positioning usePositioning |
27.057 kB9.698 kB |
| react-progress ProgressBar |
17.084 kB6.891 kB |
| react-provider FluentProvider |
24.623 kB8.893 kB |
| react-radio Radio |
32.672 kB10.343 kB |
| react-radio RadioGroup |
15.762 kB6.423 kB |
| react-select Select |
27.732 kB10.124 kB |
| react-slider Slider |
37.169 kB12.538 kB |
| react-spinbutton SpinButton |
36.06 kB11.815 kB |
| react-spinner Spinner |
25.245 kB8.539 kB |
| react-swatch-picker @fluentui/react-swatch-picker - package |
104.258 kB30.231 kB |
| react-switch Switch |
35.319 kB11.314 kB |
| react-table DataGrid |
161.034 kB45.71 kB |
| react-table Table (Primitives only) |
42.666 kB13.854 kB |
| react-table Table as DataGrid |
131.869 kB36.57 kB |
| react-table Table (Selection only) |
70.536 kB19.999 kB |
| react-table Table (Sort only) |
69.179 kB19.61 kB |
| react-tag-picker @fluentui/react-tag-picker - package |
184.091 kB55.425 kB |
| react-tags InteractionTag |
15.199 kB6.157 kB |
| react-tags Tag |
29.016 kB9.524 kB |
| react-tags TagGroup |
82.719 kB24.524 kB |
| react-text Text - Default |
17.061 kB6.723 kB |
| react-text Text - Wrappers |
20.242 kB7.048 kB |
| react-textarea Textarea |
26.572 kB9.755 kB |
| react-theme Single theme token import |
69 B89 B |
| react-theme Teams: all themes |
35.666 kB7.453 kB |
| react-theme Teams: Light theme |
19.642 kB5.549 kB |
| react-timepicker-compat TimePicker |
107.372 kB35.755 kB |
| react-toast Toast (including Toaster) |
98.338 kB29.591 kB |
| react-tooltip Tooltip |
55.517 kB19.515 kB |
| react-utilities SSRProvider |
180 B160 B |
Pull request demo site: URL

