Skip to content

Input: implement changes based on spec#20036

Merged
ecraig12345 merged 6 commits intomicrosoft:masterfrom
ecraig12345:input-implement-spec
Nov 2, 2021
Merged

Input: implement changes based on spec#20036
ecraig12345 merged 6 commits intomicrosoft:masterfrom
ecraig12345:input-implement-spec

Conversation

@ecraig12345
Copy link
Member

@ecraig12345 ecraig12345 commented Sep 29, 2021

Pull request checklist

Description of changes

Implement an initial round of changes based on the spec (#20035).

Note that bookends are not actually implemented yet. I'm also going to do the primary slot change separately.

@fabricteam
Copy link
Collaborator

fabricteam commented Sep 29, 2021

📊 Bundle size report

Package & Exports Baseline (minified/GZIP) PR Change
react-input
Input
16.751 kB
5.533 kB
14.78 kB
5.286 kB
-1.971 kB
-247 B

🤖 This report was generated against 7dbbcf2bcbd4d444b737aa3f4889ec6978cb8aa5

@codesandbox-ci
Copy link

codesandbox-ci bot commented Sep 29, 2021

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 5e6f859:

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

@size-auditor
Copy link

size-auditor bot commented Sep 29, 2021

Asset size changes

⚠️ Insufficient baseline data to detect size changes

Unable to find bundle size details for Baseline commit: b1df257

Possible causes

  • The baseline build b1df257 is broken
  • The Size Auditor run for the baseline build b1df257 was not triggered

Recommendations

  • Please merge your branch for this Pull request with the latest master build and commit your changes once again

@fabricteam
Copy link
Collaborator

fabricteam commented Sep 29, 2021

Perf Analysis (@fluentui/react)

No significant results to display.

All results

Scenario Render type Master Ticks PR Ticks Iterations Status
Avatar mount 1008 1037 5000
BaseButton mount 1011 1045 5000
Breadcrumb mount 2695 2723 1000
ButtonNext mount 560 535 5000
Checkbox mount 1718 1667 5000
CheckboxBase mount 1424 1476 5000
ChoiceGroup mount 5170 5065 5000
ComboBox mount 1047 1044 1000
CommandBar mount 10790 10334 1000
ContextualMenu mount 6560 6458 1000
DefaultButton mount 1202 1206 5000
DetailsRow mount 4024 4024 5000
DetailsRowFast mount 4118 4080 5000
DetailsRowNoStyles mount 3856 3885 5000
Dialog mount 2753 2752 1000
DocumentCardTitle mount 178 173 1000
Dropdown mount 3623 3490 5000
FluentProviderNext mount 3397 3413 5000
FluentProviderWithTheme mount 212 208 10
FluentProviderWithTheme virtual-rerender 97 106 10
FluentProviderWithTheme virtual-rerender-with-unmount 247 255 10
FocusTrapZone mount 1937 1892 5000
FocusZone mount 1907 1914 5000
IconButton mount 1904 1947 5000
Label mount 370 376 5000
Layer mount 3262 3269 5000
Link mount 543 525 5000
MakeStyles mount 1849 1875 50000
MenuButton mount 1611 1608 5000
MessageBar mount 2114 2084 5000
Nav mount 3653 3523 1000
OverflowSet mount 1187 1182 5000
Panel mount 2533 2609 1000
Persona mount 877 875 1000
Pivot mount 1485 1480 1000
PrimaryButton mount 1387 1350 5000
Rating mount 8241 8317 5000
SearchBox mount 1454 1432 5000
Shimmer mount 2697 2678 5000
Slider mount 2081 2121 5000
SpinButton mount 5364 5327 5000
Spinner mount 466 471 5000
SplitButton mount 3364 3420 5000
Stack mount 561 571 5000
StackWithIntrinsicChildren mount 1822 1845 5000
StackWithTextChildren mount 5215 5126 5000
SwatchColorPicker mount 11245 11133 5000
TagPicker mount 2925 3078 5000
TeachingBubble mount 13916 14001 5000
Text mount 478 476 5000
TextField mount 1509 1557 5000
ThemeProvider mount 1281 1247 5000
ThemeProvider virtual-rerender 651 641 5000
ThemeProvider virtual-rerender-with-unmount 2075 2111 5000
Toggle mount 890 895 5000
buttonNative mount 139 155 5000

Perf Analysis (@fluentui/react-northstar)

Perf tests with no regressions
Scenario Current PR Ticks Baseline Ticks Ratio
AttachmentMinimalPerf.default 190 176 1.08:1
BoxMinimalPerf.default 411 388 1.06:1
MenuButtonMinimalPerf.default 1974 1858 1.06:1
AccordionMinimalPerf.default 185 176 1.05:1
ButtonMinimalPerf.default 212 202 1.05:1
SkeletonMinimalPerf.default 392 374 1.05:1
IconMinimalPerf.default 700 667 1.05:1
TooltipMinimalPerf.default 1145 1090 1.05:1
CarouselMinimalPerf.default 526 508 1.04:1
GridMinimalPerf.default 373 358 1.04:1
HeaderMinimalPerf.default 400 384 1.04:1
LabelMinimalPerf.default 425 410 1.04:1
TableMinimalPerf.default 458 441 1.04:1
TextMinimalPerf.default 384 368 1.04:1
CardMinimalPerf.default 634 618 1.03:1
ReactionMinimalPerf.default 416 403 1.03:1
SliderMinimalPerf.default 1832 1771 1.03:1
StatusMinimalPerf.default 752 727 1.03:1
AttachmentSlotsPerf.default 1194 1166 1.02:1
ButtonOverridesMissPerf.default 1996 1966 1.02:1
CheckboxMinimalPerf.default 2833 2777 1.02:1
ListCommonPerf.default 687 676 1.02:1
MenuMinimalPerf.default 912 897 1.02:1
ProviderMergeThemesPerf.default 1823 1788 1.02:1
SplitButtonMinimalPerf.default 4630 4535 1.02:1
TableManyItemsPerf.default 2092 2051 1.02:1
AnimationMinimalPerf.default 442 438 1.01:1
AvatarMinimalPerf.default 220 217 1.01:1
ChatDuplicateMessagesPerf.default 328 324 1.01:1
DividerMinimalPerf.default 384 380 1.01:1
DropdownManyItemsPerf.default 742 736 1.01:1
InputMinimalPerf.default 1377 1370 1.01:1
ItemLayoutMinimalPerf.default 1306 1297 1.01:1
LayoutMinimalPerf.default 401 397 1.01:1
ListMinimalPerf.default 551 545 1.01:1
ProviderMinimalPerf.default 1218 1209 1.01:1
CustomToolbarPrototype.default 4278 4241 1.01:1
ChatMinimalPerf.default 695 693 1:1
DatepickerMinimalPerf.default 5723 5737 1:1
DropdownMinimalPerf.default 3250 3265 1:1
EmbedMinimalPerf.default 4524 4517 1:1
FlexMinimalPerf.default 301 302 1:1
HeaderSlotsPerf.default 819 817 1:1
ListNestedPerf.default 599 598 1:1
PopupMinimalPerf.default 609 606 1:1
RefMinimalPerf.default 235 234 1:1
TextAreaMinimalPerf.default 553 555 1:1
ButtonSlotsPerf.default 609 617 0.99:1
ChatWithPopoverPerf.default 413 417 0.99:1
DialogMinimalPerf.default 801 810 0.99:1
ListWith60ListItems.default 669 679 0.99:1
RosterPerf.default 1303 1311 0.99:1
RadioGroupMinimalPerf.default 474 477 0.99:1
SegmentMinimalPerf.default 361 364 0.99:1
VideoMinimalPerf.default 691 698 0.99:1
AlertMinimalPerf.default 299 306 0.98:1
PortalMinimalPerf.default 194 197 0.98:1
TreeMinimalPerf.default 823 839 0.98:1
ImageMinimalPerf.default 400 414 0.97:1
ToolbarMinimalPerf.default 974 1007 0.97:1
FormMinimalPerf.default 436 453 0.96:1
LoaderMinimalPerf.default 710 750 0.95:1
TreeWith60ListItems.default 190 202 0.94:1

khmakoto
khmakoto previously approved these changes Oct 15, 2021
* Size of the input (changes the font size and spacing).
* @default 'medium'
*/
// NOTE: can't use `size` as the name due to overlap with a native input prop :(
Copy link
Member

Choose a reason for hiding this comment

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

Can't we omit the size native input prop?

Copy link
Member Author

Choose a reason for hiding this comment

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

I don't think overriding it with a different purpose is a good idea, in case someone does want to use the native prop with its original purpose (there's a description on this page)

@ecraig12345
Copy link
Member Author

Made significant changes to remove bookends after spec discussion. @khmakoto can you take another look?

@ecraig12345 ecraig12345 merged commit 260f9a3 into microsoft:master Nov 2, 2021
@ecraig12345 ecraig12345 deleted the input-implement-spec branch November 3, 2021 18:36
mlp73 pushed a commit to mlp73/fluentui that referenced this pull request Jan 17, 2022
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.

3 participants