mxenabled / mx-react-components

A library of generic React components used at MX
MIT License
77 stars 61 forks source link

Improvements on Date Picker #280

Closed rachelpipkin closed 8 years ago

rachelpipkin commented 8 years ago

Here are some things I noticed when trying to use the DatePicker component. I'd like feedback before I start making changes though. There may be other things that aren't working smoothly, these are just want I happened upon so far.

  1. useInputForSelectedDate allows a user to input a value but on blur the value isn't saved or returns 'invalid date'
  2. defaultDate overrides placeholderText when set.
  3. defaultDate should default to today. Thoughts?
rachelpipkin commented 8 years ago

Docs should be updated to indicate that format actually defaults to 'MMM D, YYYY' but it's only for display. onDateSelect returns a unix timestamp.

derek-boman commented 8 years ago

@iheartrachie: the date picker needs some new design work as well. If you're going to be working on it, I'd like to sync up on new requirements.

See docs here (scroll down a bit): https://app.frontify.com/d/KHQZnlj1XMIO/web-patterns/inputs/form-elements/select#/inputs/form-elements/select

rachelpipkin commented 8 years ago

The internal item I'm working on right now needs a range selector. I think this is a good time to work on both of these components. I'll tackle it over the next couple of days.

derek-boman commented 8 years ago

Okay. LMK if you need additional design spec. I assume you mean the date range selector not this one here.

There are a few examples on here that I like from a functionality / usability standpoint (not necessarily how they're built). The date range selector in a single calendar here is really nice.

derek-boman commented 8 years ago

Here are some design specs I've been working with. LMK if something isn't going to work.

simple date selector copy 2 simple date selector copy

rachelpipkin commented 8 years ago

Thank you for this! I thought we were doing outline on hover, not a Fog background. Let's chat tomorrow.

rachelpipkin commented 8 years ago

Historically we had the option to allow the user to type in a date. It may have worked at one point but it's not working now. To accomplish this we need to convert the input string to a UTC timestamp. Turns out Moment.js no longer supports converting strings of this type. I can do some JS to parse the string and whatnot but wanted to check first to see if this is something we'd still like to include in the component.

cerinman commented 8 years ago

@iheartrachie I believe we're ok with leaving the type a date feature out for now. It adds complexity and more validation that I don't feel needs to be a concern at this point based upon how we currently plan to use the component. I'm sure we'll add this later but for now let's just go with selecting a date from the calendar.