Payments Overview Widget - Filters

[anu-rock]

Description

The widget will have filters at the top to select the period for the displayed data and chart. This issue tracks the creation of the three filters.

Acceptance criteria

Tip

Check the design in additional context section below for up-to-date requirements.

• Create the Period filter component.
• Create the Comparison Period filter component.
• Create the Currency filter component.
• Create the container component to wrap the filters.
• Optimize for mobile web, including the "more filters" functionality.
• Add Tracks event(s) to record user interactions with the filters.

Designs

Dev notes

The WooCommerce date range component, as seen on the Analytics pages, may be repurposed.

Additional context

• Project - paJDYF-bWn-p2
• Designs - p6riRB-9OY-p2
• Widget breakdown - pepjwh-Jw-p2

[anu-rock]

The PR is reviewed and in good shape. Marking the issue as blocked until the API endpoint is ready. cc @Automattic/helix