-
-
Notifications
You must be signed in to change notification settings - Fork 1.3k
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
[pickers] DatePicker click on outside triggers onAccept #10000
Comments
Likely this behavior has been impacted by #8312 Before that PR, the lifecycle was not clearly defined.
A solution could be to add additional information on the @flaviendelangle Might be time to add that information on all |
Slightly related to #9985 I guess it would be a property like |
Oh, right, I didn't see this.
That would be great! |
Since we started with a context object for {
shortcut?: { id: string };
actionBar?: { id: string };
view?: { type: 'year' | 'month' | ....};
other?: { type: 'keyboard-escape' | 'keyboard-enter' | 'click-outside'};
} |
Any progress ? |
I also need this behavior, since i have to implement a picker which won't make use of the |
This issue can be split by multiple PR (on per kind of action) |
Guys. You really do not need this because it already implemented. My version is You can achieve this with controlled
After you added Additionally read documentation for
|
Any update on this? @LukasTy |
Any updates guys @flaviendelangle @alexfauquette thanks |
This does not work for me. The dialog slot props are just ignored by the time picker. Am I missing something? |
This corrects the behavior for the e.g.
const [isEditing, setIsEditing] = useState(false);
const handleDateAccepted = (date: Dayjs | null) => {
console.log('handle date accepted: ', date);
};
<MobileDatePicker
open={isEditing}
closeOnSelect={false}
onAccept={handleDateAccepted}
onClose={() => setIsEditing(false)}
slotProps={{
actionBar: {
actions: ["cancel", "accept"]
},
dialog: {
onClose: () => {
setIsEditing(false);
},
},
}}
/>
<DatePicker
open={isEditing}
closeOnSelect={false}
onAccept={handleDateAccepted}
onClose={() => setIsEditing(false)}
slotProps={{
actionBar: {
actions: ["cancel", "accept"]
},
dialog: {
onClose: () => {
setIsEditing(false);
},
},
}}
/> I would not expect |
Duplicates
Latest version
Steps to reproduce 🕹
Link to live example: https://codesandbox.io/s/busy-shtern-qh99sw?file=/src/App.tsx
Steps:
Current behavior 😯
On
@mui/x-date-pickers
version6.0.3
(as it is on CodeSandbox), if I do this (click on the outside), theonAccept
doesn't trigger.You can see this on the CodeSandbox (the text below doesn't change, there's no
"foo"
in the console). And that's okay, that's what I want.However, on the newest version (
6.11.0
), which I have locally, the click on the outside triggers theonAccept
. I cannot select this version on CodeSandbox to show it.Expected behavior 🤔
I want the click on the outside of the picker dialog not to trigger the
onAccept
. I know that this wasn't the case in the earlier version (at least in6.0.3
).So basically, if the user changes their mind and closes the picker dialog by clicking on the outside (which some people prefer instead clicking
Cancel
), I want theonAccept
not to trigger. So I don't change the state, write to the context, etc. Or, maybe there's some other event listener, different thanonAccept
that I can use?P.S I think I cherry-picked the version that this got changed. Version
6.1.0
works as I want, version6.2.0
doesn't (like the newest one).Context 🔦
Explained above.
Your environment 🌎
npx @mui/envinfo
Order ID or Support key 💳 (optional)
No response
The text was updated successfully, but these errors were encountered: