fluent_ui icon indicating copy to clipboard operation
fluent_ui copied to clipboard

Calendars Rework

Open bdlukaa opened this issue 3 years ago • 6 comments

The current implementation of both date and time pickers are old and have many issues.

  • [x] They still use Acrylic as their base implementation, making it look like it's not native (https://github.com/bdlukaa/fluent_ui/pull/241)
  • [x] They only saves last changed dialer (https://github.com/bdlukaa/fluent_ui/issues/161)
  • [x] They do not make use of the FluentLocalizations (https://github.com/bdlukaa/fluent_ui/issues/213)
  • [x] The popup isn't positioned correctly over the button when there is space. Instead, it's either above or below.

  • [ ] Implement CalendarView (https://github.com/bdlukaa/fluent_ui/pull/1232)
  • [ ] Implement CalendarDatePicker, based on CalendarView

bdlukaa avatar Mar 23 '22 17:03 bdlukaa

Following DRY principles, can we ever consider use something curated like table_calendar as a base?

I have some experience with this one and this could simplify the ulterior development if we are able to render the calendar as expected in the spec.

@bdlukaa Do we have any specific policy about third party packages?

henry2man avatar Apr 02 '22 21:04 henry2man

As long as it's able to allow us to customizate it for our needs, I don't see any problem!

bdlukaa avatar Apr 02 '22 23:04 bdlukaa

@bdlukaa So, in order to make things clear prior to any development:

  • Upstream references:
    • https://docs.microsoft.com/es-es/windows/apps/design/controls/calendar-view
    • https://docs.microsoft.com/es-es/windows/apps/design/controls/calendar-date-picker
  • We want to create a new CalendarView, potentially based on table_calendar.
  • For this very first implementation we're going to have a minimal API:
    • CalendarView
      • initialValue: Show a defined month & Focus into that day (or DateTime.now() if not set)
      • minDate & maxDate: two optional DateTime args that limits min & max date (they will be unbounded if unset)
      • mandatory onSelect callback: function to be called when a day is selected
      • weekStartDay: First day of week (normally Sunday or Monday, depending on localization), defaults to Sunday.
      • UI: Change month using "up" and "down" buttons
      • UI: Use current locale to show current month & weekday tiles and also for formatting.
    • CalendarDatePicker
      • Display a form field with initialValue date (or DateTime.now() if not set)
      • On click, display a flyout with a CalendarView inside
      • When a day is clicked, hide the flyout and execute mandatory onChange callback

henry2man avatar Apr 04 '22 07:04 henry2man

@bdlukaa Can we close this issue? What is missing?

henry2man avatar Jun 07 '22 12:06 henry2man

CalendarView:

bdlukaa avatar Jun 07 '22 13:06 bdlukaa

Related: https://github.com/bdlukaa/fluent_ui/issues/417

henry2man avatar Jul 07 '22 06:07 henry2man