-
Notifications
You must be signed in to change notification settings - Fork 2.8k
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
Structure and slots for SearchBox, using Input as a slot #28090
Structure and slots for SearchBox, using Input as a slot #28090
Conversation
📊 Bundle size report🤖 This report was generated against 02c7384de10ee35cc4db1a2132c32de59db58e1f |
packages/react-components/react-search/src/components/SearchBox/renderSearchBox.tsx
Outdated
Show resolved
Hide resolved
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 e9e42db:
|
Asset size changesSize Auditor did not detect a change in bundle size for any component! Baseline commit: 7516a6bde1bd7b8c957ca479ffcb0e737e9ca693 (build) |
Perf Analysis (
|
Scenario | Render type | Master Ticks | PR Ticks | Iterations | Status |
---|---|---|---|---|---|
InfoButton | mount | 14 | 11 | 5000 | Possible regression |
All results
Scenario | Render type | Master Ticks | PR Ticks | Iterations | Status |
---|---|---|---|---|---|
Avatar | mount | 576 | 578 | 5000 | |
Button | mount | 291 | 291 | 5000 | |
Field | mount | 1031 | 1037 | 5000 | |
FluentProvider | mount | 638 | 630 | 5000 | |
FluentProviderWithTheme | mount | 78 | 77 | 10 | |
FluentProviderWithTheme | virtual-rerender | 68 | 67 | 10 | |
FluentProviderWithTheme | virtual-rerender-with-unmount | 65 | 67 | 10 | |
InfoButton | mount | 14 | 11 | 5000 | Possible regression |
MakeStyles | mount | 834 | 826 | 50000 | |
Persona | mount | 1581 | 1561 | 5000 | |
SpinButton | mount | 1265 | 1311 | 5000 |
Perf Analysis (
|
Scenario | Current PR Ticks | Baseline Ticks | Ratio |
---|---|---|---|
FlexMinimalPerf.default | 166 | 145 | 1.14:1 |
PortalMinimalPerf.default | 89 | 82 | 1.09:1 |
CarouselMinimalPerf.default | 273 | 252 | 1.08:1 |
RosterPerf.default | 1621 | 1498 | 1.08:1 |
TreeWith60ListItems.default | 93 | 86 | 1.08:1 |
RefMinimalPerf.default | 118 | 110 | 1.07:1 |
BoxMinimalPerf.default | 200 | 189 | 1.06:1 |
AnimationMinimalPerf.default | 311 | 297 | 1.05:1 |
ButtonMinimalPerf.default | 91 | 87 | 1.05:1 |
ButtonSlotsPerf.default | 329 | 312 | 1.05:1 |
ChatDuplicateMessagesPerf.default | 156 | 149 | 1.05:1 |
FormMinimalPerf.default | 232 | 221 | 1.05:1 |
InputMinimalPerf.default | 548 | 522 | 1.05:1 |
LabelMinimalPerf.default | 230 | 220 | 1.05:1 |
SkeletonMinimalPerf.default | 208 | 198 | 1.05:1 |
GridMinimalPerf.default | 199 | 192 | 1.04:1 |
LayoutMinimalPerf.default | 207 | 199 | 1.04:1 |
MenuButtonMinimalPerf.default | 966 | 931 | 1.04:1 |
ProviderMinimalPerf.default | 210 | 201 | 1.04:1 |
SegmentMinimalPerf.default | 204 | 197 | 1.04:1 |
ButtonOverridesMissPerf.default | 665 | 645 | 1.03:1 |
TableMinimalPerf.default | 247 | 240 | 1.03:1 |
TreeMinimalPerf.default | 480 | 468 | 1.03:1 |
CheckboxMinimalPerf.default | 1158 | 1134 | 1.02:1 |
DialogMinimalPerf.default | 460 | 452 | 1.02:1 |
EmbedMinimalPerf.default | 1905 | 1871 | 1.02:1 |
ImageMinimalPerf.default | 230 | 225 | 1.02:1 |
ListCommonPerf.default | 402 | 394 | 1.02:1 |
PopupMinimalPerf.default | 355 | 348 | 1.02:1 |
ProviderMergeThemesPerf.default | 667 | 654 | 1.02:1 |
TableManyItemsPerf.default | 1152 | 1126 | 1.02:1 |
CardMinimalPerf.default | 315 | 312 | 1.01:1 |
ChatWithPopoverPerf.default | 197 | 195 | 1.01:1 |
DropdownManyItemsPerf.default | 396 | 394 | 1.01:1 |
ItemLayoutMinimalPerf.default | 711 | 706 | 1.01:1 |
ListMinimalPerf.default | 313 | 310 | 1.01:1 |
IconMinimalPerf.default | 392 | 389 | 1.01:1 |
AccordionMinimalPerf.default | 83 | 83 | 1:1 |
DropdownMinimalPerf.default | 1411 | 1415 | 1:1 |
MenuMinimalPerf.default | 500 | 502 | 1:1 |
ReactionMinimalPerf.default | 209 | 209 | 1:1 |
SliderMinimalPerf.default | 753 | 751 | 1:1 |
StatusMinimalPerf.default | 399 | 400 | 1:1 |
CustomToolbarPrototype.default | 1484 | 1482 | 1:1 |
ToolbarMinimalPerf.default | 529 | 530 | 1:1 |
VideoMinimalPerf.default | 436 | 436 | 1:1 |
AvatarMinimalPerf.default | 111 | 112 | 0.99:1 |
LoaderMinimalPerf.default | 192 | 193 | 0.99:1 |
RadioGroupMinimalPerf.default | 257 | 260 | 0.99:1 |
SplitButtonMinimalPerf.default | 2267 | 2292 | 0.99:1 |
TooltipMinimalPerf.default | 1309 | 1326 | 0.99:1 |
AttachmentSlotsPerf.default | 644 | 657 | 0.98:1 |
DividerMinimalPerf.default | 209 | 213 | 0.98:1 |
HeaderMinimalPerf.default | 207 | 212 | 0.98:1 |
HeaderSlotsPerf.default | 472 | 481 | 0.98:1 |
TextAreaMinimalPerf.default | 295 | 300 | 0.98:1 |
ChatMinimalPerf.default | 419 | 434 | 0.97:1 |
DatepickerMinimalPerf.default | 3555 | 3657 | 0.97:1 |
AlertMinimalPerf.default | 152 | 158 | 0.96:1 |
ListNestedPerf.default | 328 | 341 | 0.96:1 |
ListWith60ListItems.default | 366 | 380 | 0.96:1 |
AttachmentMinimalPerf.default | 80 | 84 | 0.95:1 |
TextMinimalPerf.default | 191 | 203 | 0.94:1 |
🕵 fluentuiv8 No visual regressions between this PR and main |
Perf Analysis (
|
Scenario | Render type | Master Ticks | PR Ticks | Iterations | Status |
---|---|---|---|---|---|
BaseButton | mount | 613 | 607 | 5000 | |
Breadcrumb | mount | 1677 | 1640 | 1000 | |
Checkbox | mount | 1703 | 1684 | 5000 | |
CheckboxBase | mount | 1453 | 1470 | 5000 | |
ChoiceGroup | mount | 2908 | 2879 | 5000 | |
ComboBox | mount | 665 | 644 | 1000 | |
CommandBar | mount | 6271 | 6272 | 1000 | |
ContextualMenu | mount | 14543 | 14303 | 1000 | |
DefaultButton | mount | 732 | 739 | 5000 | |
DetailsRow | mount | 2177 | 2155 | 5000 | |
DetailsRowFast | mount | 2187 | 2142 | 5000 | |
DetailsRowNoStyles | mount | 1983 | 2014 | 5000 | |
Dialog | mount | 2587 | 2625 | 1000 | |
DocumentCardTitle | mount | 227 | 226 | 1000 | |
Dropdown | mount | 1979 | 1990 | 5000 | |
FocusTrapZone | mount | 1131 | 1117 | 5000 | |
FocusZone | mount | 1076 | 1051 | 5000 | |
GroupedList | mount | 41199 | 41389 | 2 | |
GroupedList | virtual-rerender | 19817 | 19658 | 2 | |
GroupedList | virtual-rerender-with-unmount | 53743 | 53715 | 2 | |
GroupedListV2 | mount | 231 | 230 | 2 | |
GroupedListV2 | virtual-rerender | 209 | 211 | 2 | |
GroupedListV2 | virtual-rerender-with-unmount | 221 | 235 | 2 | |
IconButton | mount | 1072 | 1070 | 5000 | |
Label | mount | 340 | 345 | 5000 | |
Layer | mount | 2736 | 2711 | 5000 | |
Link | mount | 392 | 397 | 5000 | |
MenuButton | mount | 941 | 939 | 5000 | |
MessageBar | mount | 21354 | 21313 | 5000 | |
Nav | mount | 1974 | 1943 | 1000 | |
OverflowSet | mount | 794 | 755 | 5000 | |
Panel | mount | 1785 | 1798 | 1000 | |
Persona | mount | 758 | 746 | 1000 | |
Pivot | mount | 865 | 850 | 1000 | |
PrimaryButton | mount | 850 | 864 | 5000 | |
Rating | mount | 4582 | 4680 | 5000 | |
SearchBox | mount | 914 | 894 | 5000 | |
Shimmer | mount | 1916 | 1892 | 5000 | |
Slider | mount | 1319 | 1287 | 5000 | |
SpinButton | mount | 2838 | 2912 | 5000 | |
Spinner | mount | 375 | 393 | 5000 | |
SplitButton | mount | 1817 | 1806 | 5000 | |
Stack | mount | 411 | 407 | 5000 | |
StackWithIntrinsicChildren | mount | 871 | 858 | 5000 | |
StackWithTextChildren | mount | 2679 | 2634 | 5000 | |
SwatchColorPicker | mount | 6137 | 6025 | 5000 | |
TagPicker | mount | 1432 | 1435 | 5000 | |
Text | mount | 375 | 374 | 5000 | |
TextField | mount | 921 | 974 | 5000 | |
ThemeProvider | mount | 829 | 834 | 5000 | |
ThemeProvider | virtual-rerender | 594 | 583 | 5000 | |
ThemeProvider | virtual-rerender-with-unmount | 1290 | 1277 | 5000 | |
Toggle | mount | 596 | 614 | 5000 | |
buttonNative | mount | 189 | 189 | 5000 |
🕵 FluentUI-v0 No visual regressions between this PR and main |
🕵 fluentuiv9 No visual regressions between this PR and main |
packages/react-components/react-search/src/components/SearchBox/SearchBox.types.ts
Outdated
Show resolved
Hide resolved
/azp run |
Azure Pipelines successfully started running 4 pipeline(s). |
/azp run Fluent UI React - PR and CI |
Azure Pipelines successfully started running 1 pipeline(s). |
/azp run Fluent UI React - PR and CI |
Azure Pipelines successfully started running 1 pipeline(s). |
* master: (32 commits) applying package updates feat(react-tags): add styles for size (microsoft#28229) docs(react-dialog): update DialogTriggerOutsideDialog to include focus behavior (microsoft#28176) bugfix: Ensures dialog actions stretches on breakpoints (microsoft#28258) applying package updates fix: TableHeaderCell should not render button when not sortable (microsoft#28097) fix(react-file-type-icons): Map mhtml extension to html icon (microsoft#28112) Fix overlapping axis labels on smaller viewports (microsoft#28239) useArrowNavigationGroup grid-linear axis (microsoft#28253) applying package updates fix: Alert example missing aria-label for icon (microsoft#28234) Overflow divider fix (microsoft#28011) feat(tools): implement `cypress-component-configuration` generator (microsoft#28115) chore: migrate to TS 4.7 (microsoft#28067) fix(scripts-tasks): make generate-api work in deterministic way (microsoft#28215) feat(react-tags): add overflow story (microsoft#28012) Structure and slots for SearchBox, using Input as a slot (microsoft#28090) feat(tokens): Add/update theme tokens (microsoft#27791) feat(react-tags): add a11y role and best practices guide (microsoft#28075) fix: Toast intent should always be present in the context (microsoft#28226) ...
This PR begins laying out the slot structure and types for SearchBox.
As part of #26648