The `ActiveDatesCard` component provides functionality to select a start and end date and time. ## Example code ```jsx?title:'MyApp.jsx' import React, { useState } from "react"; import { ActiveDatesCard } from "@shopify/discount-app-components"; function MyApp() { const [startTime, setStartTime] = useState("2022-06-13T04:30:00.000Z"); const [endTime, setEndTime] = useState("2022-06-14T03:30:00.000Z"); return ( ); } ``` ## Properties |Name|Type|Description|Required| |---|---|---|---| |startDate|`Field`|The field to use for the start date picker, formatted as an [ISO 8601](https://en.wikipedia.org/wiki/ISO_8601) timestamp in UTC|Yes| |endDate|Field<DateTime|null>|The field to use for the end date picker, formatted as an [ISO 8601](https://en.wikipedia.org/wiki/ISO_8601) timestamp in UTC|Yes| |timezoneAbbreviation|`string`|The timezone abbreviation for display.|Yes| |weekStartsOn|`Weekday`|The day of the week to show as the first day in the date picker.|No| |disabled|`boolean`|Disables all inputs.|No|