Enhance Date Cell controls

JustinRyanH commented 2 years ago

Motivation

Developers should know when the user starts and stop interacting with the Date Control.

For example, if the developer needs to hold off making an HTTP request until the Date is complete when the end user manually types in the date into the input type=date cell.

Notable Changes

Activate the Date Control whenever the user tabs into the Date control component.
When the user reverse tabs into the Date Control the focus directly goes into the Input first.
IconButton will now forward onBlur and onFocus (needed for the updated accessibility controls with Date Control)

BEFORE

https://user-images.githubusercontent.com/571433/166849163-d15ce5a4-9d56-41d3-84dd-70e6691fcb82.mp4

AFTER

https://user-images.githubusercontent.com/571433/166849034-06f9d927-27f8-4b5b-8fdb-bf46044118e5.mp4

Acceptance Criteria

PR upkeep checklist

[x] Change log entry
[x] Label(s)
[x] Assignee(s)
[x] Deployment URL: https://mavenlink.github.io/design-system/enhance-cell-data-controls/
[x] (When ready for review) Reviewer(s)
[x] Green Bigmaven CI check https://github.com/mavenlink/mavenlink/pull/29249
[ ] DevQA on Bigmaven staging (e.g. does the work need to be imported in the internal design system?)

JustinRyanH commented 2 years ago

@juanca Each of my fix: Spec commit has a pretty lengthy description. Let me know if any of them are confusing

juanca commented 2 years ago

Still LGTM.

juanca commented 2 years ago

@JustinRyanH Do you have an associated bigmaven PR? We need to verify the bigmaven test suite is green with these changes. If so, we can make a release in this PR and bump the bigmaven PR to the latest release.

JustinRyanH commented 2 years ago

@juanca Oh sorry. I'll make one later today

mavenlink / design-system