Comments (3)
Transitions shouldn't support the sx prop:
Why not? It's not clear. I get why Transition, react-transition-group shouldn't document the sx prop, it's not a DOM node, so it doesn't host it (it should technically work though if the host supports it and types should warn against doing it). But the <Collapse>
root hosts its own DOM node, so it looks like it should support the sx prop.
Here is another to look at it: if the className
prop works (e.g. to add utility classes) then the sx
prop should work. This looks like a baseline constraint to me, to never compromise on. I would actually love MUI System to implement the sx prop with class names: #23220.
I removed the "ready to take" label, it looks to me that we are at best all good. At worst, we miss the "Why" that we will write on the migration/deprecation docs page.
from material-ui.
From the user's perspective, there's no difference between Collapse
and the other transition components that don't host root DOM nodes. I would say the fact that Collapse
hosts its own DOM node is an implementation detail that shouldn't translate to its API.
The downside to keeping the sx
prop on Collapse
is that it could lead to users expecting the other transition components to support it (https://github.com/mui/material-ui/pull/32025)βthe mental model of how transition components work weakens.
It's not a huge issue, though. I see it as an API design enhancement rather than something that needs to be fixed.
What do you think @mnajdova?
from material-ui.
I think that the problem is that it's very hard to make a single DOM node an implementation detail, each impacts the customization experience.
Joy UI has an alternative implementation that we could benchmark with, maybe there is room to remove this DOM node, but still, I don't see it as a clear step forward, Joy UI introduces noticeable regressions, the one I remember is with the animation duration.
On my end, the most important is that we lock sync the class name with the sx prop. For example, If we remove the sx prop, we should remove the class name prop.
from material-ui.
Related Issues (20)
- [material-ui][Transition] Add flip transition HOT 1
- [material-ui] Next 13: Prop types error on children when using async component HOT 2
- [material-ui][Dialog] Wrong focus behavior using iOS VoiceOver and FocusTrap
- [material-ui][Slider] Webapp exiting fullscreen when dragging the slider in iPads
- Snackbar background color is not as expected with CssVarProvider
- [pigment-css][vite] HMR doesn't work when removing a css property HOT 1
- [material-ui][Autocomplete] Async server filtering not working
- [material-ui][next] AppCacheProvider with Next v13 and v14 Pages Router causes flickering
- Small issue in collapsible table docs HOT 2
- [material-ui][Autocomplete] broke backward compatibility with loading state HOT 4
- [icons] MUI missing "Emergency" icon HOT 4
- [material-ui] Focus-visible state does not meet WCAG AA across the system HOT 2
- Any plan for mention function with MUI Textarea HOT 1
- [docs-infra] Scoped notification per product HOT 3
- [material-ui][Autocomplete] Allow the user to remove the textarea warning
- [docs-infra] Investigate the report of web vitals
- [material-ui][Autocomplete] Using limitTags prevents clicking buttons outside of autocomplete while autocomplete is focused HOT 2
- Issue with createGenerateClassName HOT 2
- Enhancement Request: Remove Empty String Option in MUI DataGrid SingleSelect Filter
- Spaces getting trimmed inside label in Chips | Expectation is to see labels exactly as passed HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. πππ
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google β€οΈ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from material-ui.