Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Scaffold new dev docs #30483

Merged
merged 6 commits into from Feb 28, 2024
Merged

Scaffold new dev docs #30483

merged 6 commits into from Feb 28, 2024

Conversation

mltejera
Copy link
Contributor

@mltejera mltejera commented Feb 5, 2024

This PR is scaffolding our new documentation directory in the repo.

I will fast follow with individual PR's for each file, with the assigned reviewer giving me feedback.

Related issues:

Related RFC #30274
Related Epic #30642

@mltejera mltejera mentioned this pull request Feb 5, 2024
@fabricteam
Copy link
Collaborator

fabricteam commented Feb 5, 2024

Perf Analysis (@fluentui/react-components)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 609 609 5000
Button mount 278 280 5000
Field mount 1046 1076 5000
FluentProvider mount 654 679 5000
FluentProviderWithTheme mount 79 81 10
FluentProviderWithTheme virtual-rerender 61 53 10
FluentProviderWithTheme virtual-rerender-with-unmount 75 61 10
MakeStyles mount 844 852 50000
Persona mount 1672 1657 5000
SpinButton mount 1328 1360 5000

Copy link

codesandbox-ci bot commented Feb 5, 2024

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.

@fabricteam
Copy link
Collaborator

fabricteam commented Feb 5, 2024

🕵 fluentuiv8 No visual regressions between this PR and main

@fabricteam
Copy link
Collaborator

fabricteam commented Feb 5, 2024

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
AttachmentMinimalPerf.default 91 79 1.15:1
ImageMinimalPerf.default 236 212 1.11:1
SkeletonMinimalPerf.default 202 184 1.1:1
TreeWith60ListItems.default 90 82 1.1:1
AvatarMinimalPerf.default 113 105 1.08:1
DropdownManyItemsPerf.default 415 384 1.08:1
AnimationMinimalPerf.default 298 279 1.07:1
ButtonMinimalPerf.default 88 83 1.06:1
LayoutMinimalPerf.default 201 190 1.06:1
ListMinimalPerf.default 320 301 1.06:1
BoxMinimalPerf.default 192 183 1.05:1
ChatDuplicateMessagesPerf.default 159 151 1.05:1
ChatWithPopoverPerf.default 186 177 1.05:1
HeaderSlotsPerf.default 476 452 1.05:1
LabelMinimalPerf.default 221 211 1.05:1
ChatMinimalPerf.default 449 431 1.04:1
ListWith60ListItems.default 375 359 1.04:1
StatusMinimalPerf.default 400 384 1.04:1
ButtonSlotsPerf.default 322 312 1.03:1
InputMinimalPerf.default 536 519 1.03:1
MenuMinimalPerf.default 515 499 1.03:1
ProviderMergeThemesPerf.default 664 647 1.03:1
ReactionMinimalPerf.default 219 213 1.03:1
SliderMinimalPerf.default 753 728 1.03:1
SplitButtonMinimalPerf.default 2246 2178 1.03:1
CustomToolbarPrototype.default 1495 1458 1.03:1
ToolbarMinimalPerf.default 553 537 1.03:1
EmbedMinimalPerf.default 1896 1861 1.02:1
HeaderMinimalPerf.default 210 206 1.02:1
ListNestedPerf.default 327 322 1.02:1
MenuButtonMinimalPerf.default 955 940 1.02:1
TreeMinimalPerf.default 498 486 1.02:1
VideoMinimalPerf.default 454 443 1.02:1
AccordionMinimalPerf.default 79 78 1.01:1
GridMinimalPerf.default 187 186 1.01:1
LoaderMinimalPerf.default 189 188 1.01:1
RosterPerf.default 1538 1522 1.01:1
ProviderMinimalPerf.default 202 200 1.01:1
TooltipMinimalPerf.default 1267 1259 1.01:1
AttachmentSlotsPerf.default 625 622 1:1
ButtonOverridesMissPerf.default 647 646 1:1
CardMinimalPerf.default 305 305 1:1
CheckboxMinimalPerf.default 1114 1116 1:1
PopupMinimalPerf.default 349 348 1:1
PortalMinimalPerf.default 80 80 1:1
RadioGroupMinimalPerf.default 261 261 1:1
TableMinimalPerf.default 223 224 1:1
TextAreaMinimalPerf.default 286 285 1:1
DividerMinimalPerf.default 198 201 0.99:1
DropdownMinimalPerf.default 1399 1415 0.99:1
FlexMinimalPerf.default 152 153 0.99:1
FormMinimalPerf.default 225 227 0.99:1
ItemLayoutMinimalPerf.default 690 700 0.99:1
IconMinimalPerf.default 387 390 0.99:1
TableManyItemsPerf.default 1096 1107 0.99:1
DatepickerMinimalPerf.default 3477 3566 0.98:1
DialogMinimalPerf.default 433 443 0.98:1
RefMinimalPerf.default 112 114 0.98:1
CarouselMinimalPerf.default 254 263 0.97:1
ListCommonPerf.default 400 411 0.97:1
TextMinimalPerf.default 190 195 0.97:1
AlertMinimalPerf.default 155 163 0.95:1
SegmentMinimalPerf.default 187 196 0.95:1

@fabricteam
Copy link
Collaborator

fabricteam commented Feb 5, 2024

🕵 FluentUIV0 No visual regressions between this PR and main

@fabricteam
Copy link
Collaborator

fabricteam commented Feb 5, 2024

📊 Bundle size report

Unchanged fixtures
Package & Exports Size (minified/GZIP)
global-context
createContext
510 B
328 B
global-context
createContextSelector
537 B
339 B
keyboard-key
keyboard-key package
3.746 kB
1.928 kB
priority-overflow
createOverflowManager
4.447 kB
1.853 kB
react
ActivityItem
68.833 kB
22.613 kB
react
Announced
36.473 kB
12.628 kB
react
Autofill
15.365 kB
4.743 kB
react
Breadcrumb
196.083 kB
58.757 kB
react
Button
190.127 kB
55.019 kB
react
ButtonGrid
175.918 kB
53.25 kB
react
Calendar
118.756 kB
36.101 kB
react
Callout
80.866 kB
26.564 kB
react
Check
51.062 kB
17.152 kB
react
Checkbox
57.791 kB
19.17 kB
react
ChoiceGroup
63.339 kB
20.824 kB
react
ChoiceGroupOption
56.601 kB
18.695 kB
react
Coachmark
89.704 kB
28.407 kB
react
Color
7.737 kB
3.106 kB
react
ColorPicker
129.984 kB
40.589 kB
react
ComboBox
245.355 kB
70.51 kB
react
CommandBar
197.362 kB
58.46 kB
react
ContextualMenu
150.967 kB
46.982 kB
react
DatePicker
180.318 kB
54.947 kB
react
DateTimeUtilities
5.244 kB
1.849 kB
react
DetailsList
225.886 kB
64.647 kB
react
Dialog
205.294 kB
61.428 kB
react
Divider
17.63 kB
6.234 kB
react
DocumentCard
211.08 kB
62.793 kB
react
DragDrop
8.343 kB
2.724 kB
react
DraggableZone
33.345 kB
11.166 kB
react
Dropdown
227.732 kB
66.867 kB
react
ExtendedPicker
94.987 kB
27.297 kB
react
Fabric
39.75 kB
13.688 kB
react
Facepile
205.992 kB
61.67 kB
react
FloatingPicker
236.233 kB
67.368 kB
react
FocusTrapZone
15.831 kB
5.54 kB
react
FocusZone
53.259 kB
16.869 kB
react
Grid
175.918 kB
53.25 kB
react
GroupedList
131.636 kB
39.657 kB
react
GroupedListV2
119.324 kB
36.822 kB
react
HoverCard
93.735 kB
29.778 kB
react
Icon
49.74 kB
16.603 kB
react
Icons
65.829 kB
24.212 kB
react
Image
44.79 kB
15.024 kB
react
Keytip
78.588 kB
25.825 kB
react
KeytipData
13.585 kB
4.418 kB
react
KeytipLayer
100.422 kB
31.128 kB
react
Keytips
103.175 kB
32.07 kB
react
Label
36.347 kB
12.639 kB
react
Layer
45.683 kB
15.585 kB
react
Link
37.673 kB
12.993 kB
react
List
38.136 kB
12.004 kB
react
MarqueeSelection
72.119 kB
21.676 kB
react
MessageBar
184.707 kB
55.523 kB
react
Modal
90.409 kB
29.213 kB
react
Nav
183.442 kB
55.093 kB
react
OverflowSet
31.044 kB
10.593 kB
react
Overlay
38.784 kB
13.401 kB
react
Panel
194.946 kB
58.34 kB
react
Persona
111.705 kB
35.58 kB
react
PersonaCoin
111.705 kB
35.58 kB
react
PersonaPresence
55.928 kB
18.715 kB
react
Pickers
287.603 kB
80.607 kB
react
Pivot
184.252 kB
55.823 kB
react
Popup
12.032 kB
4.114 kB
react
Positioning
21.821 kB
7.334 kB
react
PositioningContainer
70.754 kB
22.84 kB
react
ProgressIndicator
37.498 kB
12.906 kB
react
Rating
78.989 kB
25.18 kB
react
ResizeGroup
13.286 kB
4.365 kB
react
ResponsiveMode
8.078 kB
2.95 kB
react
ScrollablePane
53.538 kB
17.113 kB
react
SearchBox
182.982 kB
55.1 kB
react
SelectableOption
724 B
413 B
react
SelectedItemsList
226.659 kB
66.321 kB
react
Selection
41.202 kB
11.839 kB
react
Separator
33.397 kB
11.529 kB
react
Shimmer
47.265 kB
15.632 kB
react
ShimmeredDetailsList
236.654 kB
67.42 kB
react
Slider
55.575 kB
18.574 kB
react
SpinButton
186.661 kB
56.205 kB
react
Spinner
39.691 kB
13.815 kB
react
Stack
40.761 kB
13.931 kB
react
Sticky
32.064 kB
10.324 kB
react
Styling
44.812 kB
14.688 kB
react
SwatchColorPicker
186.166 kB
56.724 kB
react
TeachingBubble
200.004 kB
59.345 kB
react
Text
35.931 kB
12.486 kB
react
TextField
78.587 kB
24.642 kB
react
Theme
42.456 kB
13.773 kB
react
ThemeGenerator
12.34 kB
4.106 kB
react
TimePicker
235.197 kB
68.29 kB
react
Toggle
44.17 kB
15.346 kB
react
Tooltip
84.225 kB
27.277 kB
react
Utilities
71.851 kB
21.843 kB
react
Viewport
22.945 kB
7.292 kB
react
WeeklyDayPicker
98.762 kB
30.828 kB
react
WindowProvider
1.059 kB
541 B
react-accordion
Accordion (including children components)
100.127 kB
30.426 kB
react-alert
Alert
83.737 kB
23.474 kB
react-avatar
Avatar
50.175 kB
15.944 kB
react-avatar
AvatarGroup
19.704 kB
7.796 kB
react-avatar
AvatarGroupItem
64.831 kB
20.274 kB
react-badge
Badge
26.905 kB
8.729 kB
react-badge
CounterBadge
27.806 kB
9.024 kB
react-badge
PresenceBadge
25.311 kB
9.306 kB
react-breadcrumb
@fluentui/react-breadcrumb - package
115.48 kB
31.84 kB
react-button
Button
39.513 kB
11.169 kB
react-button
CompoundButton
46.874 kB
12.661 kB
react-button
MenuButton
44.292 kB
12.542 kB
react-button
SplitButton
52.306 kB
14.134 kB
react-button
ToggleButton
56.559 kB
13.068 kB
react-calendar-compat
Calendar Compat
152.073 kB
39.83 kB
react-card
Card - All
101.557 kB
28.932 kB
react-card
Card
96.382 kB
27.401 kB
react-card
CardFooter
13.064 kB
5.385 kB
react-card
CardHeader
15.307 kB
6.143 kB
react-card
CardPreview
14.015 kB
5.752 kB
react-checkbox
Checkbox
35.656 kB
12.07 kB
react-combobox
Combobox (including child components)
102.463 kB
33.101 kB
react-combobox
Dropdown (including child components)
103.837 kB
33.038 kB
react-components
react-components: Button, FluentProvider & webLightTheme
70.732 kB
20.465 kB
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover
217.207 kB
61.943 kB
react-components
react-components: FluentProvider & webLightTheme
43.219 kB
14.299 kB
react-datepicker-compat
DatePicker Compat
224.523 kB
62.939 kB
react-dialog
Dialog (including children components)
100.93 kB
29.924 kB
react-divider
Divider
20.82 kB
7.763 kB
react-field
Field
22.542 kB
8.608 kB
react-image
Image
15.745 kB
6.23 kB
react-infobutton
InfoButton
138.696 kB
43.398 kB
react-infobutton
InfoLabel
142.497 kB
44.627 kB
react-input
Input
26.891 kB
9.119 kB
react-jsx-runtime
Classic Pragma
1.057 kB
530 B
react-jsx-runtime
JSX Dev Runtime
3.783 kB
1.648 kB
react-jsx-runtime
JSX Runtime
4.377 kB
1.881 kB
react-label
Label
14.266 kB
5.828 kB
react-link
Link
17.082 kB
6.911 kB
react-menu
Menu (including children components)
149.428 kB
45.509 kB
react-menu
Menu (including selectable components)
152.114 kB
46.021 kB
react-message-bar
MessageBar (all components)
25.566 kB
9.131 kB
react-northstar
Accordion
85.357 kB
26.509 kB
react-northstar
Alert
87.425 kB
26.91 kB
react-northstar
Animation
55.304 kB
17.834 kB
react-northstar
Attachment
86.819 kB
26.7 kB
react-northstar
Avatar
80.254 kB
24.634 kB
react-northstar
Box
75.223 kB
23.814 kB
react-northstar
Breadcrumb
79.889 kB
24.707 kB
react-northstar
Button
83.135 kB
25.957 kB
react-northstar
Card
82.674 kB
25.027 kB
react-northstar
Carousel
105.15 kB
31.882 kB
react-northstar
Chat
152.326 kB
45.963 kB
react-northstar
Checkbox
79.782 kB
25.085 kB
react-northstar
Datepicker
184.887 kB
56.167 kB
react-northstar
Debug
8.801 kB
3.594 kB
react-northstar
Design
36.564 kB
12.07 kB
react-northstar
Dialog
112.02 kB
33.638 kB
react-northstar
Divider
76.594 kB
24.137 kB
react-northstar
Dropdown
196.43 kB
59.442 kB
react-northstar
Embed
81.446 kB
25.42 kB
react-northstar
Flex
47.702 kB
15.45 kB
react-northstar
Form
92.492 kB
28.881 kB
react-northstar
Grid
70.555 kB
22.283 kB
react-northstar
Header
74.731 kB
23.476 kB
react-northstar
Image
73.566 kB
23.339 kB
react-northstar
Input
88.31 kB
27.784 kB
react-northstar
ItemLayout
78.206 kB
24.458 kB
react-northstar
Label
77.895 kB
24.415 kB
react-northstar
Layout
75.368 kB
23.806 kB
react-northstar
List
88.472 kB
27.57 kB
react-northstar
Loader
78.591 kB
24.745 kB
react-northstar
Menu
126.85 kB
39.875 kB
react-northstar
MenuButton
161.254 kB
48.881 kB
react-northstar
Pill
83.697 kB
26.077 kB
react-northstar
Popup
133.56 kB
41.486 kB
react-northstar
Portal
58.294 kB
18.855 kB
react-northstar
Provider
93.114 kB
29.626 kB
react-northstar
RadioGroup
83.25 kB
26.056 kB
react-northstar
Reaction
77.255 kB
24.138 kB
react-northstar
Segment
76.184 kB
23.899 kB
react-northstar
Skeleton
77.74 kB
24.21 kB
react-northstar
Slider
84.235 kB
26.744 kB
react-northstar
SplitButton
176.487 kB
52.632 kB
react-northstar
Status
76.247 kB
24.059 kB
react-northstar
SvgIcon
36.819 kB
11.744 kB
react-northstar
Table
80.765 kB
25.159 kB
react-northstar
Text
74.089 kB
23.522 kB
react-northstar
TextArea
74.223 kB
23.501 kB
react-northstar
Toolbar
173.3 kB
52.087 kB
react-northstar
Tooltip
108.23 kB
34.491 kB
react-northstar
Tree
87.83 kB
27.223 kB
react-northstar
Video
75.379 kB
23.794 kB
react-overflow
hooks only
12.862 kB
4.827 kB
react-persona
Persona
57.066 kB
17.821 kB
react-popover
Popover
126.886 kB
39.806 kB
react-portal
Portal
13.633 kB
4.869 kB
react-portal-compat
PortalCompatProvider
7.944 kB
2.588 kB
react-positioning
usePositioning
26.398 kB
9.539 kB
react-progress
ProgressBar
17.428 kB
6.898 kB
react-provider
FluentProvider
23.759 kB
8.657 kB
react-radio
Radio
32.95 kB
10.251 kB
react-radio
RadioGroup
15.354 kB
6.265 kB
react-select
Select
28.609 kB
10.205 kB
react-slider
Slider
39.949 kB
12.968 kB
react-spinbutton
SpinButton
36.774 kB
11.788 kB
react-spinner
Spinner
23.517 kB
8.512 kB
react-switch
Switch
35.14 kB
11.2 kB
react-table
DataGrid
165.168 kB
45.902 kB
react-table
Table (Primitives only)
45.324 kB
14.116 kB
react-table
Table as DataGrid
136.55 kB
36.811 kB
react-table
Table (Selection only)
76.311 kB
20.546 kB
react-table
Table (Sort only)
74.977 kB
20.154 kB
react-tags
InteractionTag
15.259 kB
6.058 kB
react-tags
Tag
29.982 kB
9.439 kB
react-tags
TagGroup
80.556 kB
24.027 kB
react-text
Text - Default
16.705 kB
6.569 kB
react-text
Text - Wrappers
19.878 kB
6.896 kB
react-textarea
Textarea
30.947 kB
10.476 kB
react-theme
Single theme token import
69 B
89 B
react-theme
Teams: all themes
34.616 kB
7.317 kB
react-theme
Teams: Light theme
19.287 kB
5.498 kB
react-timepicker-compat
TimePicker
104.484 kB
34.49 kB
react-toast
Toast (including Toaster)
100.198 kB
29.76 kB
react-tooltip
Tooltip
54.58 kB
19.188 kB
react-utilities
SSRProvider
180 B
160 B
🤖 This report was generated against 6dbbed43b5a12846cbb4f781f8de8b62f010ebc9

@fabricteam
Copy link
Collaborator

fabricteam commented Feb 5, 2024

🕵 fluentuiv9 No visual regressions between this PR and main

@fabricteam
Copy link
Collaborator

fabricteam commented Feb 5, 2024

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
BaseButton mount 623 624 5000
Breadcrumb mount 1697 1681 1000
Checkbox mount 1693 1683 5000
CheckboxBase mount 1487 1453 5000
ChoiceGroup mount 2876 2879 5000
ComboBox mount 644 635 1000
CommandBar mount 6260 6327 1000
ContextualMenu mount 13800 13763 1000
DefaultButton mount 747 726 5000
DetailsRow mount 2217 2162 5000
DetailsRowFast mount 2167 2223 5000
DetailsRowNoStyles mount 1975 1991 5000
Dialog mount 2779 2645 1000
DocumentCardTitle mount 228 234 1000
Dropdown mount 1984 1987 5000
FocusTrapZone mount 1141 1160 5000
FocusZone mount 1071 1078 5000
GroupedList mount 37574 41586 2
GroupedList virtual-rerender 19958 19910 2
GroupedList virtual-rerender-with-unmount 50763 50724 2
GroupedListV2 mount 228 217 2
GroupedListV2 virtual-rerender 216 220 2
GroupedListV2 virtual-rerender-with-unmount 228 223 2
IconButton mount 1067 1069 5000
Label mount 328 340 5000
Layer mount 2760 2782 5000
Link mount 387 390 5000
MenuButton mount 939 940 5000
MessageBar mount 21552 21571 5000
Nav mount 1893 1981 1000
OverflowSet mount 807 775 5000
Panel mount 2063 1759 1000
Persona mount 739 736 1000
Pivot mount 868 857 1000
PrimaryButton mount 838 835 5000
Rating mount 4604 4558 5000
SearchBox mount 901 905 5000
Shimmer mount 1902 1831 5000
Slider mount 1321 1334 5000
SpinButton mount 2951 2831 5000
Spinner mount 383 382 5000
SplitButton mount 1825 1793 5000
Stack mount 404 406 5000
StackWithIntrinsicChildren mount 838 853 5000
StackWithTextChildren mount 2589 2616 5000
SwatchColorPicker mount 6191 6198 5000
TagPicker mount 1455 1427 5000
Text mount 373 369 5000
TextField mount 933 942 5000
ThemeProvider mount 844 828 5000
ThemeProvider virtual-rerender 587 579 5000
ThemeProvider virtual-rerender-with-unmount 1260 1289 5000
Toggle mount 603 612 5000
buttonNative mount 185 191 5000

@mltejera mltejera marked this pull request as ready for review February 20, 2024 21:04
@mltejera mltejera requested review from a team as code owners February 20, 2024 21:04
CONTRIBUTING.md Outdated Show resolved Hide resolved
@JustSlone
Copy link
Collaborator

JustSlone commented Feb 21, 2024

Thanks for spinning this up!

On the __documentation__ folder name. I think should avoid the double __'s unless there is a strong reason to use this. It's odd, I assume this is to affect the sort order of the folder. To either hide it or make it stand out more. Perhaps there is something I'm missing here but it seems like a strange practice that will draw unnecessary attention within the repo.

This treatment, either makes the folder really obvious, or makes it hard to find given it's now above the dotfile folders which are ignored. I think the outcome here will vary depending on the engineer with some seeing it and some ignoring it, I don't think we want that outcome.
image

I think it would be better to just have the folder be docs or documentation (I prefer docs following the pattern of shorter folder names where reasonable). Let's just let it fit within the folders there are already a small number, and there will be less with rfcs and specs moving under docs.

@JustSlone
Copy link
Collaborator

Every unowned file is owned by fluentui-admins

* @microsoft/fluentui-admins

I'd suggest adding a code owner entry for the docs folder, following the pattern of rfcs

rfcs/ @microsoft/cxe-red @microsoft/cxe-prg @microsoft/teams-prg

@marcosmoura
Copy link
Contributor

I'm not sure if it should be part of this PR, but I'm leaving this comment so we can start to think about it.
It is worth mentioning the contrib repo somehow. It is confusing to people that are not deeply involved in the day-to-day development of the library if a component should belong to the main repo or go to contrib. It would be good to have a document explaining that. :)

CONTRIBUTING.md Outdated Show resolved Hide resolved
@JustSlone
Copy link
Collaborator

Is this PR ready to merge, or will there be work to complete the //TODO's? (If you could elaborate on the plan and details for the PR in the description that will help)

I'm a little unsure about adding actual files with //TODO and assignees, should that be issues instead?

If we have high confidence that we'll fast follow to fix these it's fine, but I'd hate for us to have empty md files with //TODO in them in the repo for an extended period of time (where as having an issue we haven't gotten around to yet is fine).

Thanks!

Copy link
Collaborator

@JustSlone JustSlone left a comment

Choose a reason for hiding this comment

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

Thanks for the updates, PR looks good!

@mltejera mltejera force-pushed the user/matjera/scaffold-new-dev-docs branch from e7cf0de to c1793a5 Compare February 28, 2024 21:59
@mltejera mltejera enabled auto-merge (squash) February 28, 2024 22:19
@mltejera mltejera merged commit b0f39c7 into master Feb 28, 2024
23 checks passed
@mltejera mltejera deleted the user/matjera/scaffold-new-dev-docs branch March 8, 2024 22:55
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.

None yet

7 participants