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

[Select] Migrate to emotion #25653

Merged
merged 35 commits into from
Apr 12, 2021
Merged

Conversation

mnajdova
Copy link
Member

@mnajdova mnajdova commented Apr 7, 2021

One of #24405

@mnajdova mnajdova added the component: select This is the name of the generic UI component, not the React module! label Apr 7, 2021
@mui-pr-bot
Copy link

mui-pr-bot commented Apr 7, 2021

Details of bundle changes

Generated by 🚫 dangerJS against b244bbb

@mnajdova mnajdova marked this pull request as ready for review April 7, 2021 17:02
@github-actions github-actions bot added the PR: out-of-date The pull request has merge conflicts and can't be merged label Apr 8, 2021
@github-actions github-actions bot removed the PR: out-of-date The pull request has merge conflicts and can't be merged label Apr 8, 2021
@@ -7,106 +7,6 @@ import ArrowDropDownIcon from '../internal/svg-icons/ArrowDropDown';
import Input from '../Input';
import useThemeProps from '../styles/useThemeProps';

export const styles = (theme) => ({
Copy link
Member Author

Choose a reason for hiding this comment

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

These are not used anymore.

{},
{ name: 'MuiNativeSelect', slot: 'Root', overridesResolver },
)(({ styleProps, theme }) => ({
export const nativeSelectRootStyles = ({ styleProps, theme }) => ({
Copy link
Member Author

Choose a reason for hiding this comment

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

Exporting the styles as they should be used in the SelectInput too.

paddingRight: 32,
},
}),
...(styleProps.selectMenu && {
Copy link
Member Author

Choose a reason for hiding this comment

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

Moved to SelectInput, not used here anyway.


const IconRoot = experimentalStyled(
'svg',
const NativeSelectRoot = experimentalStyled(
Copy link
Member Author

Choose a reason for hiding this comment

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

Improved naming consistency.

@@ -77,24 +77,19 @@ const SelectRoot = experimentalStyled(
'&:focus': {
borderRadius: theme.shape.borderRadius, // Reset the reset for Chrome style
},
'&&': {
'&&&': {
Copy link
Member Author

Choose a reason for hiding this comment

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

For bumping the specificity we need to use now specificity of 3, as naturally the style overrides for the slot would override these definitions

);
container = innerContainer;
}).toErrorDev(
'Material-UI: The key `root` provided to the classes prop is not implemented in Select.',
Copy link
Member Author

Choose a reason for hiding this comment

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

It throws error as classes inside the Select is not empty object, as it is not created with withStyles

Copy link
Member

@oliviertassinari oliviertassinari Apr 11, 2021

Choose a reason for hiding this comment

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

I have done b244bbb as a proposal to solve the issue. The alternative would be to have our own mergeClasses helper. The one from @material-ui/styles is legacy. The accepted classes are so dynamic now that we can't make a warning work for classes that don't exist (as far as I understand the problem)

...(styleProps.variant && styles[`icon${capitalize(styleProps.variant)}`]),
...(styleProps.open && styles.iconOpen),

return deepmerge(
Copy link
Member Author

Choose a reason for hiding this comment

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

Fixed merging.

@mnajdova

This comment has been minimized.

@mnajdova mnajdova requested review from oliviertassinari and removed request for oliviertassinari April 9, 2021 10:35
@eps1lon eps1lon merged commit b0a717f into mui:next Apr 12, 2021
@@ -0,0 +1,21 @@
import { generateUtilityClass, generateUtilityClasses } from '@material-ui/unstyled';

export function getSelectUtilitiyClasses(slot) {

Choose a reason for hiding this comment

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

Nitpick: typo. 🙂 getSelectUtilityClasses

Copy link
Member

Choose a reason for hiding this comment

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

fixed in #25804

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: select This is the name of the generic UI component, not the React module!
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants