Skip to content

chore(react-storybook-addon): bootstrap package#19247

Merged
Hotell merged 6 commits into
microsoft:masterfrom
Hotell:hotell/build-system/storybook-addon-1
Aug 4, 2021
Merged

chore(react-storybook-addon): bootstrap package#19247
Hotell merged 6 commits into
microsoft:masterfrom
Hotell:hotell/build-system/storybook-addon-1

Conversation

@Hotell

@Hotell Hotell commented Aug 4, 2021

Copy link
Copy Markdown
Contributor

Pull request checklist

Description of changes

  • yarn create-package
  • yarn nx workspace-generator migrate-converged-pkg --name=@fluentui/react-storybook-addon
  • manual adjustments
  • added initial code boilerplate for addon

Focus areas to test

(optional)

@codesandbox-ci

codesandbox-ci Bot commented Aug 4, 2021

Copy link
Copy Markdown

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 66bbcee:

Sandbox Source
Fluent UI React Starter Configuration

@Hotell
Hotell force-pushed the hotell/build-system/storybook-addon-1 branch from bcded1f to 65007ee Compare August 4, 2021 10:40
Comment thread package.json Outdated

module.exports = /** @type {Pick<import('../../../.storybook/main').StorybookConfig,'addons'|'stories'|'webpackFinal'>} */ ({
stories: [...rootMain.stories, '../src/**/*.stories.mdx', '../src/**/*.stories.@(ts|tsx)'],
addons: ['../preset.js', ...rootMain.addons],

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

added ../preset.js to test addon in place

@fabricteam

fabricteam commented Aug 4, 2021

Copy link
Copy Markdown
Collaborator

📊 Bundle size report

Unchanged fixtures
Package & Exports Size (minified/GZIP)
react-accordion
Accordion (including children components)
78.506 kB
23.21 kB
react-avatar
Avatar
54.242 kB
14.662 kB
react-badge
Badge
24.343 kB
7.165 kB
react-badge
CounterBadge
27.156 kB
7.851 kB
react-badge
PresenseBadge
237 B
177 B
react-button
Button
24.934 kB
8.001 kB
react-button
CompoundButton
30.226 kB
8.878 kB
react-button
MenuButton
26.521 kB
8.509 kB
react-button
ToggleButton
34.531 kB
8.637 kB
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover
179.799 kB
50.935 kB
react-components
react-components: FluentProvider & webLightTheme
36.237 kB
11.596 kB
react-divider
Divider
15.889 kB
5.747 kB
react-image
Image
10.642 kB
4.264 kB
react-label
Label
9.397 kB
3.839 kB
react-link
Link
14.715 kB
6.012 kB
react-make-styles
makeStaticStyles (runtime)
7.59 kB
3.321 kB
react-make-styles
makeStyles + mergeClasses (runtime)
22.135 kB
8.356 kB
react-make-styles
makeStyles + mergeClasses (build time)
2.557 kB
1.202 kB
react-menu
Menu (including children components)
114.61 kB
34.554 kB
react-menu
Menu (including selectable components)
116.71 kB
34.824 kB
react-popover
Popover
124.181 kB
36.121 kB
react-portal
Portal
7.78 kB
2.672 kB
react-positioning
usePopper
23.157 kB
7.942 kB
react-provider
FluentProvider
16.235 kB
5.972 kB
react-theme
Teams: all themes
32.941 kB
6.674 kB
react-theme
Teams: Light theme
20.247 kB
5.662 kB
react-tooltip
Tooltip
45.281 kB
15.45 kB
react-utilities
SSRProvider
213 B
170 B
🤖 This report was generated against 0dc13aeac08956ca9d9bc69293b77f7707d2fbce

@size-auditor

size-auditor Bot commented Aug 4, 2021

Copy link
Copy Markdown

Asset size changes

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

Baseline commit: 0dc13aeac08956ca9d9bc69293b77f7707d2fbce (build)

@fabricteam

fabricteam commented Aug 4, 2021

Copy link
Copy Markdown
Collaborator

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 890 914 5000
BaseButton mount 994 1013 5000
Breadcrumb mount 2775 2749 1000
ButtonNext mount 475 472 5000
Checkbox mount 1674 1685 5000
CheckboxBase mount 1429 1429 5000
ChoiceGroup mount 5257 5189 5000
ComboBox mount 1057 1055 1000
CommandBar mount 10685 10675 1000
ContextualMenu mount 6555 6631 1000
DefaultButton mount 1263 1216 5000
DetailsRow mount 4092 4194 5000
DetailsRowFast mount 4103 4027 5000
DetailsRowNoStyles mount 3857 3806 5000
Dialog mount 2296 2348 1000
DocumentCardTitle mount 153 158 1000
Dropdown mount 3628 3610 5000
FluentProviderNext mount 7471 7393 5000
FocusTrapZone mount 1965 2007 5000
FocusZone mount 1924 1927 5000
IconButton mount 1933 1906 5000
Label mount 370 349 5000
Layer mount 1970 1968 5000
Link mount 521 517 5000
MakeStyles mount 1888 1987 50000
MenuButton mount 1590 1594 5000
MessageBar mount 2109 2182 5000
Nav mount 3642 3566 1000
OverflowSet mount 1149 1112 5000
Panel mount 2199 2186 1000
Persona mount 887 911 1000
Pivot mount 1549 1537 1000
PrimaryButton mount 1403 1414 5000
Rating mount 8622 8656 5000
SearchBox mount 1474 1521 5000
Shimmer mount 2843 2949 5000
Slider mount 2113 2101 5000
SpinButton mount 5347 5601 5000
Spinner mount 454 432 5000
SplitButton mount 3543 3552 5000
Stack mount 581 559 5000
StackWithIntrinsicChildren mount 1725 1741 5000
StackWithTextChildren mount 5133 5190 5000
SwatchColorPicker mount 11393 11317 5000
Tabs mount 1511 1528 1000
TagPicker mount 2891 2861 5000
TeachingBubble mount 12670 12455 5000
Text mount 468 460 5000
TextField mount 1485 1527 5000
ThemeProvider mount 1312 1221 5000
ThemeProvider virtual-rerender 664 635 5000
Toggle mount 937 922 5000
buttonNative mount 146 120 5000

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
AccordionMinimalPerf.default 182 167 1.09:1
AttachmentMinimalPerf.default 175 161 1.09:1
TreeWith60ListItems.default 203 186 1.09:1
BoxMinimalPerf.default 399 371 1.08:1
RefMinimalPerf.default 263 245 1.07:1
IconMinimalPerf.default 688 644 1.07:1
FormMinimalPerf.default 476 450 1.06:1
LayoutMinimalPerf.default 419 394 1.06:1
TextMinimalPerf.default 396 375 1.06:1
DividerMinimalPerf.default 416 396 1.05:1
DropdownManyItemsPerf.default 784 749 1.05:1
GridMinimalPerf.default 391 372 1.05:1
PortalMinimalPerf.default 193 183 1.05:1
AnimationMinimalPerf.default 457 440 1.04:1
ItemLayoutMinimalPerf.default 1388 1331 1.04:1
ListNestedPerf.default 627 605 1.04:1
SegmentMinimalPerf.default 396 382 1.04:1
TableMinimalPerf.default 457 440 1.04:1
ButtonSlotsPerf.default 616 597 1.03:1
ChatDuplicateMessagesPerf.default 330 321 1.03:1
DialogMinimalPerf.default 842 818 1.03:1
HeaderMinimalPerf.default 419 406 1.03:1
LabelMinimalPerf.default 438 425 1.03:1
MenuButtonMinimalPerf.default 1843 1784 1.03:1
StatusMinimalPerf.default 758 737 1.03:1
AvatarMinimalPerf.default 216 211 1.02:1
ChatMinimalPerf.default 755 743 1.02:1
ImageMinimalPerf.default 424 417 1.02:1
InputMinimalPerf.default 1376 1350 1.02:1
ListCommonPerf.default 719 705 1.02:1
ListWith60ListItems.default 697 685 1.02:1
TextAreaMinimalPerf.default 573 560 1.02:1
VideoMinimalPerf.default 681 669 1.02:1
CarouselMinimalPerf.default 527 520 1.01:1
CheckboxMinimalPerf.default 2978 2955 1.01:1
DatepickerMinimalPerf.default 5934 5859 1.01:1
FlexMinimalPerf.default 328 324 1.01:1
PopupMinimalPerf.default 664 656 1.01:1
ProviderMergeThemesPerf.default 1781 1762 1.01:1
ProviderMinimalPerf.default 1108 1098 1.01:1
SkeletonMinimalPerf.default 399 394 1.01:1
SliderMinimalPerf.default 1710 1689 1.01:1
SplitButtonMinimalPerf.default 4213 4159 1.01:1
CustomToolbarPrototype.default 4210 4148 1.01:1
ToolbarMinimalPerf.default 1040 1032 1.01:1
TreeMinimalPerf.default 865 857 1.01:1
ButtonOverridesMissPerf.default 1832 1833 1:1
DropdownMinimalPerf.default 3338 3349 1:1
HeaderSlotsPerf.default 874 874 1:1
LoaderMinimalPerf.default 729 732 1:1
EmbedMinimalPerf.default 4557 4587 0.99:1
RosterPerf.default 1325 1337 0.99:1
RadioGroupMinimalPerf.default 496 500 0.99:1
TableManyItemsPerf.default 2114 2135 0.99:1
AttachmentSlotsPerf.default 1134 1162 0.98:1
CardMinimalPerf.default 615 628 0.98:1
ChatWithPopoverPerf.default 386 394 0.98:1
TooltipMinimalPerf.default 1104 1128 0.98:1
ListMinimalPerf.default 558 573 0.97:1
MenuMinimalPerf.default 916 947 0.97:1
ButtonMinimalPerf.default 186 194 0.96:1
ReactionMinimalPerf.default 407 424 0.96:1
AlertMinimalPerf.default 301 325 0.93:1

@Hotell
Hotell enabled auto-merge (squash) August 4, 2021 11:57
@Hotell
Hotell merged commit 502b775 into microsoft:master Aug 4, 2021
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