-
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
CompoundButton: Re-introducing CompoundButton using latest version of makeStyles #17534
Conversation
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 7065a11:
|
Asset size changesSize Auditor did not detect a change in bundle size for any component! Baseline commit: a8767b680206226010a1a3e6cf9b426ed66612b1 (build) |
Perf AnalysisNo significant results to display. All results
Perf Analysis (Fluent)Perf comparison
Perf tests with no regressions
|
} = state; | ||
state.className = undefined; | ||
if (state.children) { | ||
state.children.className = undefined; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
What is state.children
? is this guaranteed to be a props object, or can it be jsx or a string?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It is treated as a slot so it can be any of those.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
In here it is guaranteed to be an object after going through useCompoundButton
though.
selectors.size === 'large' && styles.secondaryContentLarge, | ||
selectors.primary && styles.secondaryContentPrimary, | ||
selectors.disabled && styles.secondaryContentDisabled, | ||
state.secondaryContent.className, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I'm don't know the internals of what ax
does, but I see some inconsistencies in the ordering of the input. In the root, I see that state.className
(the user's input) comes as the first param. Same with icon. But with secondaryContent
, the user's input comes last.
Is that intended? Does it matter, is there an ordering here to ensure user overrides are more important?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It is intended, it should normally come in the end but it's coming here first because that's actually the result of the useButtonStyles
call before that. If you take a closer look I actually get the classnames
that are applied at the end at the beginning of the function.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Please investigate perf and vr tests.
Hello @khmakoto! Because this pull request has the p.s. you can customize the way I help with merging this pull request, such as holding this pull request until a specific person approves. Simply @mention me (
|
🎉 Handy links: |
🎉 Handy links: |
… makeStyles (microsoft#17534) #### Pull request checklist - [ ] Addresses an existing issue: Fixes #0000 - [x] Include a change request file using `$ yarn change` #### Description of changes This PR re-introduces the `CompoundButton` component with the latest `makeStyles` changes under `@fluentui/react-button` after having been removed for the initial release of `@fluentui/react-components`. PRs reintroducing `MenuButton`, `SplitButton` and `ToggleButton` will follow. PRs reintroducing the `block`, `subtle` and `transparent` props will follow.
… makeStyles (microsoft#17534) #### Pull request checklist - [ ] Addresses an existing issue: Fixes #0000 - [x] Include a change request file using `$ yarn change` #### Description of changes This PR re-introduces the `CompoundButton` component with the latest `makeStyles` changes under `@fluentui/react-button` after having been removed for the initial release of `@fluentui/react-components`. PRs reintroducing `MenuButton`, `SplitButton` and `ToggleButton` will follow. PRs reintroducing the `block`, `subtle` and `transparent` props will follow.
Pull request checklist
$ yarn change
Description of changes
This PR re-introduces the
CompoundButton
component with the latestmakeStyles
changes under@fluentui/react-button
after having been removed for the initial release of@fluentui/react-components
.PRs reintroducing
MenuButton
,SplitButton
andToggleButton
will follow.PRs reintroducing the
block
,subtle
andtransparent
props will follow.