chore: rename package from react-storybook-addon-codesandbox to react-storybook-addon-export-to-sandbox #29647

Hotell · 2023-10-25T16:39:17Z

Previous Behavior

New Behavior

see PR title
package rename to better express the intent/functionality
notes: this was executed via nx g @nx/workspace:move generator

Related Issue(s)

Follows feat(react-storybook-addon-codesandbox): support various providers for "export to" functionality #29536

Hotell · 2023-10-25T16:46:41Z

tsconfig.base.all.json

      "@fluentui/react-focus-management": ["packages/react-focus-management/src/index.ts"],
      "@fluentui/react-image": ["packages/react-components/react-image/src/index.ts"],
      "@fluentui/react-infobutton": ["packages/react-components/react-infobutton/src/index.ts"],
+      "@fluentui/react-infolabel": ["packages/react-components/react-infolabel/src/index.ts"],


re-generated via our nx generator (nx generate @fluentui/workspace-plugin:tsconfig-base-all) which alphabetically orders projects

fabricteam · 2023-10-25T16:51:38Z

📊 Bundle size report

Unchanged fixtures

Package & Exports	Size (minified/GZIP)
`global-context` createContext	`510 B` `330 B`
`global-context` createContextSelector	`537 B` `342 B`
`priority-overflow` createOverflowManager	`4.341 kB` `1.81 kB`
`react-accordion` Accordion (including children components)	`92.983 kB` `28.418 kB`
`react-alert` Alert	`84.293 kB` `23.456 kB`
`react-avatar` Avatar	`50.534 kB` `15.923 kB`
`react-avatar` AvatarGroup	`20.064 kB` `7.894 kB`
`react-avatar` AvatarGroupItem	`65.19 kB` `20.259 kB`
`react-badge` Badge	`27.264 kB` `8.808 kB`
`react-badge` CounterBadge	`28.165 kB` `9.101 kB`
`react-badge` PresenceBadge	`25.67 kB` `9.313 kB`
`react-button` Button	`40.074 kB` `11.292 kB`
`react-button` CompoundButton	`47.43 kB` `12.787 kB`
`react-button` MenuButton	`44.848 kB` `12.668 kB`
`react-button` SplitButton	`52.862 kB` `14.254 kB`
`react-button` ToggleButton	`57.122 kB` `13.194 kB`
`react-calendar-compat` Calendar Compat	`141.324 kB` `36.821 kB`
`react-card` Card - All	`92.955 kB` `26.977 kB`
`react-card` Card	`87.781 kB` `25.462 kB`
`react-card` CardFooter	`13.423 kB` `5.481 kB`
`react-card` CardHeader	`15.666 kB` `6.235 kB`
`react-card` CardPreview	`14.374 kB` `5.854 kB`
`react-checkbox` Checkbox	`37.505 kB` `12.327 kB`
`react-combobox` Combobox (including child components)	`91.781 kB` `29.935 kB`
`react-combobox` Dropdown (including child components)	`90.223 kB` `29.601 kB`
`react-components` react-components: Button, FluentProvider & webLightTheme	`70.002 kB` `20.161 kB`
`react-components` react-components: Accordion, Button, FluentProvider, Image, Menu, Popover	`207.417 kB` `59.289 kB`
`react-components` react-components: FluentProvider & webLightTheme	`42.286 kB` `14 kB`
`react-datepicker-compat` DatePicker Compat	`212.494 kB` `59.326 kB`
`react-dialog` Dialog (including children components)	`94.473 kB` `28.28 kB`
`react-divider` Divider	`21.179 kB` `7.839 kB`
`react-field` Field	`22.788 kB` `8.639 kB`
`react-image` Image	`16.096 kB` `6.317 kB`
`react-infobutton` InfoButton	`130.729 kB` `41.194 kB`
`react-infobutton` InfoLabel	`134.413 kB` `42.351 kB`
`react-input` Input	`27.247 kB` `9.194 kB`
`react-jsx-runtime` Classic Pragma	`1.049 kB` `531 B`
`react-jsx-runtime` JSX Dev Runtime	`4.14 kB` `1.741 kB`
`react-jsx-runtime` JSX Runtime	`4.734 kB` `1.983 kB`
`react-label` Label	`14.508 kB` `5.857 kB`
`react-link` Link	`17.4 kB` `6.977 kB`
`react-menu` Menu (including children components)	`140.176 kB` `43.004 kB`
`react-menu` Menu (including selectable components)	`142.862 kB` `43.51 kB`
`react-message-bar` MessageBar (all components)	`25.54 kB` `9.102 kB`
`react-overflow` hooks only	`12.598 kB` `4.754 kB`
`react-persona` Persona	`57.425 kB` `17.798 kB`
`react-popover` Popover	`119.46 kB` `37.714 kB`
`react-portal` Portal	`12.4 kB` `4.541 kB`
`react-portal-compat` PortalCompatProvider	`6.651 kB` `2.252 kB`
`react-positioning` usePositioning	`25.305 kB` `9.162 kB`
`react-progress` ProgressBar	`17.788 kB` `6.986 kB`
`react-provider` FluentProvider	`22.831 kB` `8.429 kB`
`react-radio` Radio	`31.266 kB` `10.267 kB`
`react-radio` RadioGroup	`15.704 kB` `6.35 kB`
`react-select` Select	`28.968 kB` `10.269 kB`
`react-slider` Slider	`38.349 kB` `12.595 kB`
`react-spinbutton` SpinButton	`37.133 kB` `11.856 kB`
`react-spinner` Spinner	`23.762 kB` `8.556 kB`
`react-switch` Switch	`33.731 kB` `10.899 kB`
`react-table` DataGrid	`157.084 kB` `43.906 kB`
`react-table` Table (Primitives only)	`43.941 kB` `13.76 kB`
`react-table` Table as DataGrid	`130.165 kB` `35.174 kB`
`react-table` Table (Selection only)	`75.777 kB` `20.477 kB`
`react-table` Table (Sort only)	`74.384 kB` `20.075 kB`
`react-tags` InteractionTag	`15.618 kB` `6.152 kB`
`react-tags` Tag	`30.341 kB` `9.505 kB`
`react-tags` TagGroup	`73.816 kB` `22.097 kB`
`react-text` Text - Default	`17.065 kB` `6.645 kB`
`react-text` Text - Wrappers	`20.237 kB` `6.965 kB`
`react-textarea` Textarea	`31.306 kB` `10.549 kB`
`react-theme` Single theme token import	`69 B` `89 B`
`react-theme` Teams: all themes	`34.611 kB` `7.295 kB`
`react-theme` Teams: Light theme	`19.282 kB` `5.486 kB`
`react-toast` Toast (including Toaster)	`92.725 kB` `27.876 kB`
`react-tooltip` Tooltip	`52.466 kB` `18.466 kB`
`react-utilities` SSRProvider	`180 B` `159 B`

_{🤖 This report was generated against 01912382b9a202b132f32a78fe8c67db5348b281}

fabricteam · 2023-10-25T16:56:19Z

Perf Analysis (`@fluentui/react-components`)

Scenario	Render type	Master Ticks	PR Ticks	Iterations	Status
FluentProviderWithTheme	virtual-rerender	60	68	10	Possible regression

All results

Scenario	Render type	Master Ticks	PR Ticks	Iterations	Status
Avatar	mount	619	662	5000
Button	mount	309	324	5000
Field	mount	1125	1165	5000
FluentProvider	mount	719	711	5000
FluentProviderWithTheme	mount	79	90	10
FluentProviderWithTheme	virtual-rerender	60	68	10	Possible regression
FluentProviderWithTheme	virtual-rerender-with-unmount	74	74	10
MakeStyles	mount	866	857	50000
Persona	mount	1818	1703	5000
SpinButton	mount	1404	1411	5000

fabricteam · 2023-10-25T16:59:19Z

🕵 fluentuiv8 No visual regressions between this PR and main

fabricteam · 2023-10-25T17:00:01Z

Perf Analysis (`@fluentui/react-northstar`)

Perf tests with no regressions

Scenario	Current PR Ticks	Baseline Ticks	Ratio
AvatarMinimalPerf.default	125	107	1.17:1
TreeWith60ListItems.default	91	82	1.11:1
AttachmentMinimalPerf.default	82	75	1.09:1
DividerMinimalPerf.default	217	202	1.07:1
GridMinimalPerf.default	191	179	1.07:1
LoaderMinimalPerf.default	201	188	1.07:1
IconMinimalPerf.default	397	371	1.07:1
VideoMinimalPerf.default	456	427	1.07:1
ButtonSlotsPerf.default	322	304	1.06:1
RefMinimalPerf.default	114	109	1.05:1
ChatDuplicateMessagesPerf.default	150	144	1.04:1
ListWith60ListItems.default	368	354	1.04:1
MenuButtonMinimalPerf.default	970	934	1.04:1
TextAreaMinimalPerf.default	293	282	1.04:1
CardMinimalPerf.default	305	295	1.03:1
HeaderSlotsPerf.default	485	471	1.03:1
ListMinimalPerf.default	306	297	1.03:1
ListNestedPerf.default	318	309	1.03:1
StatusMinimalPerf.default	398	385	1.03:1
TextMinimalPerf.default	197	192	1.03:1
AccordionMinimalPerf.default	82	80	1.02:1
ChatMinimalPerf.default	427	420	1.02:1
CheckboxMinimalPerf.default	1137	1120	1.02:1
DialogMinimalPerf.default	438	429	1.02:1
HeaderMinimalPerf.default	205	200	1.02:1
InputMinimalPerf.default	548	535	1.02:1
SliderMinimalPerf.default	742	731	1.02:1
TooltipMinimalPerf.default	1285	1255	1.02:1
AnimationMinimalPerf.default	299	297	1.01:1
EmbedMinimalPerf.default	1860	1837	1.01:1
FlexMinimalPerf.default	156	155	1.01:1
LabelMinimalPerf.default	211	209	1.01:1
RadioGroupMinimalPerf.default	263	260	1.01:1
ToolbarMinimalPerf.default	536	532	1.01:1
TreeMinimalPerf.default	466	461	1.01:1
DatepickerMinimalPerf.default	3520	3537	1:1
DropdownManyItemsPerf.default	388	388	1:1
DropdownMinimalPerf.default	1443	1447	1:1
ProviderMergeThemesPerf.default	654	653	1:1
ProviderMinimalPerf.default	196	196	1:1
SplitButtonMinimalPerf.default	2259	2267	1:1
TableMinimalPerf.default	232	233	1:1
ButtonOverridesMissPerf.default	636	640	0.99:1
CarouselMinimalPerf.default	254	256	0.99:1
ImageMinimalPerf.default	217	220	0.99:1
PopupMinimalPerf.default	347	349	0.99:1
PortalMinimalPerf.default	87	88	0.99:1
SkeletonMinimalPerf.default	196	197	0.99:1
TableManyItemsPerf.default	1081	1092	0.99:1
FormMinimalPerf.default	215	220	0.98:1
ItemLayoutMinimalPerf.default	713	726	0.98:1
RosterPerf.default	1538	1571	0.98:1
CustomToolbarPrototype.default	1458	1492	0.98:1
AlertMinimalPerf.default	155	160	0.97:1
MenuMinimalPerf.default	500	523	0.96:1
ReactionMinimalPerf.default	210	219	0.96:1
SegmentMinimalPerf.default	187	195	0.96:1
BoxMinimalPerf.default	191	201	0.95:1
ButtonMinimalPerf.default	78	82	0.95:1
ChatWithPopoverPerf.default	192	203	0.95:1
ListCommonPerf.default	371	389	0.95:1
AttachmentSlotsPerf.default	613	649	0.94:1
LayoutMinimalPerf.default	190	204	0.93:1

codesandbox-ci · 2023-10-25T17:09:24Z

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 b2c4cdc:

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

fabricteam · 2023-10-25T17:11:02Z

Perf Analysis (`@fluentui/react`)

No significant results to display.

All results

Scenario	Render type	Master Ticks	PR Ticks	Iterations
BaseButton	mount	620	646	5000
Breadcrumb	mount	1663	1646	1000
Checkbox	mount	1677	1655	5000
CheckboxBase	mount	1467	1458	5000
ChoiceGroup	mount	2875	2966	5000
ComboBox	mount	637	625	1000
CommandBar	mount	6115	6208	1000
ContextualMenu	mount	12059	12037	1000
DefaultButton	mount	735	739	5000
DetailsRow	mount	2151	2147	5000
DetailsRowFast	mount	2171	2192	5000
DetailsRowNoStyles	mount	2014	1991	5000
Dialog	mount	2739	2607	1000
DocumentCardTitle	mount	225	235	1000
Dropdown	mount	1942	1974	5000
FocusTrapZone	mount	1133	1113	5000
FocusZone	mount	1084	1049	5000
GroupedList	mount	41624	41420	2
GroupedList	virtual-rerender	17838	19951	2
GroupedList	virtual-rerender-with-unmount	50564	52735	2
GroupedListV2	mount	225	213	2
GroupedListV2	virtual-rerender	212	210	2
GroupedListV2	virtual-rerender-with-unmount	221	221	2
IconButton	mount	1059	1094	5000
Label	mount	340	333	5000
Layer	mount	2732	2711	5000
Link	mount	386	387	5000
MenuButton	mount	942	918	5000
MessageBar	mount	21435	21847	5000
Nav	mount	1927	1915	1000
OverflowSet	mount	756	764	5000
Panel	mount	1823	1772	1000
Persona	mount	737	763	1000
Pivot	mount	862	837	1000
PrimaryButton	mount	858	852	5000
Rating	mount	4577	4603	5000
SearchBox	mount	880	902	5000
Shimmer	mount	1855	1861	5000
Slider	mount	1325	1313	5000
SpinButton	mount	2910	2885	5000
Spinner	mount	387	386	5000
SplitButton	mount	1783	1822	5000
Stack	mount	414	422	5000
StackWithIntrinsicChildren	mount	845	839	5000
StackWithTextChildren	mount	2569	2622	5000
SwatchColorPicker	mount	6072	6138	5000
TagPicker	mount	1410	1500	5000
Text	mount	378	365	5000
TextField	mount	924	932	5000
ThemeProvider	mount	823	834	5000
ThemeProvider	virtual-rerender	600	584	5000
ThemeProvider	virtual-rerender-with-unmount	1312	1293	5000
Toggle	mount	605	617	5000
buttonNative	mount	195	186	5000

fabricteam · 2023-10-25T17:14:57Z

🕵 FluentUIV0 No visual regressions between this PR and main

fabricteam · 2023-10-25T17:19:59Z

🕵 fluentuiv9 No visual regressions between this PR and main

…-storybook-addon-export-to-sandbox

size-auditor · 2023-10-26T11:22:01Z

Asset size changes

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

Baseline commit: 01912382b9a202b132f32a78fe8c67db5348b281 (build)

…o react-storybook-addon-export-to-sandbox

Hotell added the Storybook label Oct 25, 2023

github-actions bot added this to the October Project Cycle Q4 2023 milestone Oct 25, 2023

Hotell added the Fluent UI react-components (v9) label Oct 25, 2023

Hotell force-pushed the hotell/rename-react-storybook-export-to-codesandbox-pkg branch from d9a80c6 to 9e6d136 Compare October 25, 2023 16:44

Hotell commented Oct 25, 2023

View reviewed changes

Hotell force-pushed the hotell/rename-react-storybook-export-to-codesandbox-pkg branch from 9e6d136 to 40aff37 Compare October 25, 2023 16:56

chore: rename package from react-storybook-addon-codesandbox to react…

cbdc673

…-storybook-addon-export-to-sandbox

fixup! chore: rename package from react-storybook-addon-codesandbox t…

b2c4cdc

…o react-storybook-addon-export-to-sandbox

Hotell force-pushed the hotell/rename-react-storybook-export-to-codesandbox-pkg branch from e20417e to b2c4cdc Compare October 26, 2023 12:27

Hotell marked this pull request as ready for review October 26, 2023 13:22

Hotell requested review from a team, JustSlone, jurokapsiar, ms-acalzaretto, sopranopillow and tudorpopams as code owners October 26, 2023 13:22

JustSlone approved these changes Oct 26, 2023

View reviewed changes

ling1726 approved these changes Oct 27, 2023

View reviewed changes

Hotell mentioned this pull request Oct 27, 2023

feat(react-storybook-addon-export-to-sandbox): make addon generic so it can be published and used outside this repo #29674

Merged

1 task

Hotell merged commit 2ea8827 into microsoft:master Oct 27, 2023

Hotell deleted the hotell/rename-react-storybook-export-to-codesandbox-pkg branch October 27, 2023 13:24

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

chore: rename package from react-storybook-addon-codesandbox to react-storybook-addon-export-to-sandbox #29647

chore: rename package from react-storybook-addon-codesandbox to react-storybook-addon-export-to-sandbox #29647

Uh oh!

Hotell commented Oct 25, 2023 •

edited

Loading

Uh oh!

Hotell Oct 25, 2023

Uh oh!

fabricteam commented Oct 25, 2023 •

edited

Loading

Uh oh!

fabricteam commented Oct 25, 2023 •

edited

Loading

Uh oh!

fabricteam commented Oct 25, 2023 •

edited

Loading

Uh oh!

fabricteam commented Oct 25, 2023 •

edited

Loading

Uh oh!

codesandbox-ci bot commented Oct 25, 2023 •

edited

Loading

Uh oh!

fabricteam commented Oct 25, 2023 •

edited

Loading

Uh oh!

fabricteam commented Oct 25, 2023 •

edited

Loading

Uh oh!

fabricteam commented Oct 25, 2023 •

edited

Loading

Uh oh!

size-auditor bot commented Oct 26, 2023 •

edited

Loading

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

chore: rename package from react-storybook-addon-codesandbox to react-storybook-addon-export-to-sandbox #29647

chore: rename package from react-storybook-addon-codesandbox to react-storybook-addon-export-to-sandbox #29647

Uh oh!

Conversation

Hotell commented Oct 25, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Previous Behavior

New Behavior

Related Issue(s)

Uh oh!

Hotell Oct 25, 2023

Choose a reason for hiding this comment

Uh oh!

fabricteam commented Oct 25, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

📊 Bundle size report

Uh oh!

fabricteam commented Oct 25, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Perf Analysis (@fluentui/react-components)

Uh oh!

fabricteam commented Oct 25, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🕵 fluentuiv8 No visual regressions between this PR and main

Uh oh!

fabricteam commented Oct 25, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Perf Analysis (@fluentui/react-northstar)

Uh oh!

codesandbox-ci bot commented Oct 25, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

fabricteam commented Oct 25, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Perf Analysis (@fluentui/react)

Uh oh!

fabricteam commented Oct 25, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🕵 FluentUIV0 No visual regressions between this PR and main

Uh oh!

fabricteam commented Oct 25, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🕵 fluentuiv9 No visual regressions between this PR and main

Uh oh!

size-auditor bot commented Oct 26, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Asset size changes

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Hotell commented Oct 25, 2023 •

edited

Loading

fabricteam commented Oct 25, 2023 •

edited

Loading

fabricteam commented Oct 25, 2023 •

edited

Loading

Perf Analysis (`@fluentui/react-components`)

fabricteam commented Oct 25, 2023 •

edited

Loading

fabricteam commented Oct 25, 2023 •

edited

Loading

Perf Analysis (`@fluentui/react-northstar`)

codesandbox-ci bot commented Oct 25, 2023 •

edited

Loading

fabricteam commented Oct 25, 2023 •

edited

Loading

Perf Analysis (`@fluentui/react`)

fabricteam commented Oct 25, 2023 •

edited

Loading

fabricteam commented Oct 25, 2023 •

edited

Loading

size-auditor bot commented Oct 26, 2023 •

edited

Loading