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

[Feature Request] Cannot set hour/minute/second state to time picker programmatically #20671

Open
kschwedler opened this issue Nov 5, 2024 · 9 comments · May be fixed by #20677
Open

[Feature Request] Cannot set hour/minute/second state to time picker programmatically #20671

kschwedler opened this issue Nov 5, 2024 · 9 comments · May be fixed by #20677
Assignees
Labels
C: VTimePicker VTimePicker S: has PR The issue has a pending Pull Request T: feature A new feature

Comments

@kschwedler
Copy link

Problem to solve

When using the time picker clock and controls separated from another, there is currently no way to control the current state of the clock itself (hour/minute/second).

Proposed solution

Emit the clicks on hour/minute/second buttons in the time picker control so it'll possible to react on these actions.

@kschwedler kschwedler changed the title [Feature Request] Cannot set hour/minnute/second to time picker programmatically [Feature Request] Cannot set hour/minute/second state to time picker clock programmatically Nov 5, 2024
@kschwedler kschwedler changed the title [Feature Request] Cannot set hour/minute/second state to time picker clock programmatically [Feature Request] Cannot set hour/minute/second state to time picker programmatically Nov 5, 2024
@J-Sek J-Sek self-assigned this Nov 6, 2024
@J-Sek J-Sek added T: bug Functionality that does not work as intended/expected C: VTimePicker VTimePicker and removed S: triage labels Nov 6, 2024
@J-Sek
Copy link
Contributor

J-Sek commented Nov 6, 2024

Reproduction demo with workaround.

Well.. I wonder if it is a bug we can tackle with massaging TS types or is it just IDE getting confused. All parts (hour/minute/second/period) are emit-only as stated in the API docs, but autocomplete suggests 2-way binding.

image

@J-Sek
Copy link
Contributor

J-Sek commented Nov 6, 2024

@kschwedler, could you share if you were just mislead by IDE or is there any real-life use case where you'd like to set individual pieces instead of updating the full time value string?

@kschwedler
Copy link
Author

Thanks for the quick response, but unfortunately this is not what I meant. I have to use the time picker separately for design reasons. The time picker control component can emit ‘update:selecting’, but the time picker itself cannot be controlled with this value.
It would be cool if the picker gets a prop ‘selecting’ or something, so that you can adjust the clock accordingly on the clicks of the buttons (hour/minute/second) of the control.

@J-Sek J-Sek added T: feature A new feature and removed T: bug Functionality that does not work as intended/expected labels Nov 6, 2024
@J-Sek
Copy link
Contributor

J-Sek commented Nov 6, 2024

@kschwedler, did you consider using <v-time-picker-clock> instead? Pickers (in general) try to force users to go through all the modes to produce valid date or time. So even if the PR gets merged and the prop would let you control the state - selecting hour switches mode to minutes - you would need to make the picker unclickable with inert or pointer-events none in order to force the selection mode from outside.

@kschwedler
Copy link
Author

The mode switching to minute/second when selecting hour/minute is fine. The only problem was that the v-time-picker-control is useless because it couldn't update the time picker (e. g. you selected hour in the clock and it switches to minutes but want to change the hour again by clicking on the hour button of the time-picker-control without entering minutes), which hopefully works with the pr you created.

@J-Sek
Copy link
Contributor

J-Sek commented Nov 14, 2024

@kschwedler , I don't get the last part. It clearly works in the most basic example in the docs. I can go back to selecting hours without selecting minutes.

recording shows it works

Peek 2024-11-14 15-01

@kschwedler
Copy link
Author

kschwedler commented Nov 15, 2024

As I already mentioned, I need the clock and the control to be seperated. I know that the main component itself is working. I made a small example of what I mean.

@J-Sek
Copy link
Contributor

J-Sek commented Nov 15, 2024

Consider these 2 playgrounds: one that works today, and the one that would work after merging the PR.

  • 1st one is based on <v-time-picker-clock> and has different API, but I took it all from the sources
  • 2nd one would still progress to minutes after selecting an hour - forcing user to fight against it

Would you pick the first today or still wait for the 2nd one to accept selecting prop?

@kschwedler
Copy link
Author

I think I'll wait for the PR. It's not urgent for us, just a bit annoying at the moment. Thanks for your help so far, I hope the PR will be merged soon :)

@J-Sek J-Sek added the S: has PR The issue has a pending Pull Request label Dec 5, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
C: VTimePicker VTimePicker S: has PR The issue has a pending Pull Request T: feature A new feature
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants