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

[SwipeableDrawer] Allow custom style #11805

Merged
merged 1 commit into from
Jun 11, 2018
Merged

[SwipeableDrawer] Allow custom style #11805

merged 1 commit into from
Jun 11, 2018

Conversation

Johann-S
Copy link
Contributor

I hope I followed all your contributing guidelines 😄

Fixes: #11799

@oliviertassinari oliviertassinari added bug 🐛 Something doesn't work component: drawer This is the name of the generic UI component, not the React module! labels Jun 10, 2018
Copy link
Member

@leMaik leMaik left a comment

Choose a reason for hiding this comment

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

Nice first contribution! 👍

pointerEvents: variant === 'temporary' && !open ? 'none' : '',
};

if (PaperProps && PaperProps.style) {
Copy link
Member

Choose a reason for hiding this comment

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

PaperProps will never be undefined, only the PaperProps.style check is needed here. Also, destructuring null or undefined is perfectly fine. This could be simplified (and inlined) to

style: { ...PaperProps.style, pointerEvents: variant === 'temporary' && !open ? 'none' : '' }

Copy link
Contributor Author

Choose a reason for hiding this comment

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

I tested locally on the documentation and I had a PaperProps undefined that's but I'll double check that thanks 👍

Copy link
Member

Choose a reason for hiding this comment

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

This should do it:

-      PaperProps,
+      PaperProps = {},
       swipeAreaWidth,
       variant,
       ...other
     } = this.props; 

// ...

           PaperProps={{
             ...PaperProps,
+            style: {
+              pointerEvents: variant === 'temporary' && !open ? 'none' : '',
+              ...PaperProps.style,
+            }

/>,
);

assert.strictEqual(customStyle, wrapper.prop('PaperProps'));
Copy link
Member

Choose a reason for hiding this comment

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

Just for consistency with the codebase.

.prop('PaperProps') <> .props().PaperProps

pointerEvents: variant === 'temporary' && !open ? 'none' : '',
};

if (PaperProps && PaperProps.style) {
Copy link
Member

Choose a reason for hiding this comment

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

This should do it:

-      PaperProps,
+      PaperProps = {},
       swipeAreaWidth,
       variant,
       ...other
     } = this.props; 

// ...

           PaperProps={{
             ...PaperProps,
+            style: {
+              pointerEvents: variant === 'temporary' && !open ? 'none' : '',
+              ...PaperProps.style,
+            }

@oliviertassinari oliviertassinari changed the title fix(swipeable-drawer): allow custom style [SwipeableDrawer] Allow custom style Jun 11, 2018
@oliviertassinari oliviertassinari merged commit 8ab1e4f into mui:master Jun 11, 2018
@oliviertassinari
Copy link
Member

@Johann-S It's a great first pull request on Material-UI 👌🏻. Thank you for giving it a shot!

@Johann-S Johann-S deleted the fix-paper-propes-style branch June 11, 2018 19:10
@Johann-S
Copy link
Contributor Author

That's nothing 😊 and it's pretty easy to contribute to your project thanks to the different hint you gave 😉

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug 🐛 Something doesn't work component: drawer 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.

None yet

3 participants